قسمت اول : راهاندازی اپلیکیشن VUE 3 : نصب و راهاندازی Vite, VUE و TailwindCSS
در این دوره آموزشی جامع و پروژه محور، شما با یکی از محبوبترین فریمورکهای جاوا اسکریپت یعنی Vue.js آشنا خواهید شد. همراه با ما، یک داشبورد حرفهای را با استفاده از ابزارهای قدرتمند Vite و Tailwind CSS توسعه خواهیم داد.
☑️ در این دوره یاد خواهید گرفت:
Vue.js: مفاهیم پایه، کامپوننتها، مدیریت دادهها، روتر و ...
Vite: ساخت پروژههای Vue.js با سرعت بالا و تجربه توسعه بهتر
Tailwind CSS: طراحی رابط کاربری زیبا و واکنشگرا بدون نوشتن CSS زیاد
ساختار پروژه Vue: درک عمیق از ساختار فایلها و پوشههای یک پروژه Vue
مدیریت بستهها با npm: نصب و مدیریت وابستگیهای پروژه
در این قسمت اول، به موارد زیر پرداختیم:
معرفی Vue.js، Vite و Tailwind CSS
نصب Node.js و npm
ایجاد یک پروژه جدید Vue با Vite
ساختار اولیه پروژه و فایلهای مهم آن
نصب و پیکربندی Tailwind CSS
ایجاد یک کامپوننت ساده و اعمال استایل با Tailwind CSS
________________
☑️ در قسمتهای بعدی، به مباحث پیشرفتهتری مانند:
کامپوننتهای سفارشی
مدیریت حالت با Pinia
روتر Vue
تست واحد
استایلینگ پیشرفته با Tailwind CSS
و ... خواهیم پرداخت.
اگر به توسعه وب با Vue.js علاقهمند هستید، این دوره برای شما مناسب است. حتی اگر هیچ تجربه قبلی در زمینه فریمورکهای جاوا اسکریپت ندارید، میتوانید به راحتی مفاهیم را یاد بگیرید.
برای مشاهده قسمتهای بعدی، کانال ما را دنبال کنید.
_______________
☑️ لینکهای مفید:
گیت هاب قسمت اول : https://github.com/unknownman/bw8-vue3-dashboad/tree/01
Node.js: https://nodejs.org/
npm: https://www.npmjs.com/
Vite: https://vitejs.dev/
Tailwind CSS: https://tailwindcss.com/
Vue.js: https://vuejs.org/
nvm (Node Version Manager): https://github.com/nvm-sh/nvm
📖 Visual Studio Extentions
Tailwind CSS IntelliSense : https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss
Vola : https://marketplace.visualstudio.com/items?itemName=vue.volar
Prettier Formatter for Visual Studio Code : https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
Vue 3 snippets : https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets