VUE 3 شامل روتر، Vuex، ترکیب API و Firebase

یادگیری Vue 3 راه درست، شامل روتر، Vuex، ترکیب API، Firebase و بسیاری از پروژه ها!

عنوان اصلی : Vue 3 incl. Router, VueX, Composition API & Firebase

سرفصل های دوره :

مقدمه - Vue 3 Course incl. روتر، VueX، Composition API و Firebase:
به انجمن Discord ما بپیوندید!
مبانی Vue (101):
Vue Dev Tools را نصب کنید!
دیده بان ها
رندر مشروط
رندر شرطی (v-if در مقابل v-show)
صحافی ورودی فرم (v-model)
مدیریت رویداد
حباب کردن رویداد
تغییرگرهای رویداد
ارائه فهرست (v-for)
ارائه فهرست (v-for با اشیا)
ارائه فهرست (v-for با محدوده)
ارائه فهرست و رندر شرطی (v-for با v-if)
ارائه فهرست با تکنیک فیلترینگ/مرتب سازی
v-for Filtering/Sorting Challenge
v-for Filtering/Sorting Challenge راه حل
نمایش فهرست و کلیدها
CSS Class Bindings Object Syntax
CSS Class Bindings Array Syntax
مبانی اجزاء :
اولین جزء پایه با الگو
ارسال داده ها به کامپوننت ها (Props)
جریان داده یک طرفه
ویژگیهای کامپوننت پروپ
رویدادهای مؤلفه سفارشی
گوش دادن به رویدادهای مؤلفه سفارشی
استفاده از v-for با کامپوننت ها
استفاده از v-model در کامپوننت های سفارشی
Multiple V-Model Bindings
چرا استفاده از کلید در دستورالعمل v-for مهم است؟
شاخه های اجزای اصلی
Refs الگو (ارجاع مستقیم به عناصر DOM)
اجزای فایل منفرد:
اجزای فایل واحد
مرحله ساخت
تنظیم Vue CLI
Vue CLI نمای کلی پروژه ایجاد کرد
اجزای یک فایل و ماژول های ES6
حرکت به اجزای تک فایل (چالش و کارگاه!)
پیکربندی برنامه مبتنی بر Vue CLI (چند صفحه)
پیکربندی برنامه مبتنی بر Vue CLI (حالت‌ها و متغیرهای Env)
روتر Vue:
نصب و راه اندازی روتر Vue
Vue Router و Vue DevTools
ایجاد لینک
مسیرهای نامگذاری شده
مسیرهای پویا با پارامترها
واکنش به تغییرات پارامتر مسیر
Catch All Route (با ایجاد صفحه یافت نشد 404)
پارامترهای اختیاری و نحو تطبیق مسیر
پیمایش برنامه‌ای
ارسال پارامترها به مسیرها (عملی)
پارامترهای مسیر به عنوان Props (قابلیت استفاده مجدد جزء)
پارامترهای مسیر قابل تکرار
تغییر مسیر و نام مستعار
مسیرهای تودرتو
نگهبانان ناوبری
مبانی VueX:
نصب و راه اندازی VueX
حالت خواندن
نمونه حالت اشتراک گذاری
جهش های حالت
سابقه جهش در Vue DevTools
به‌روزرسانی وضعیت وظیفه با استفاده از جهش
استفاده از v-model با Computed Property Getter/Setter
معرفی پروژه ها به برنامه
VueX State Getters
بازسازی وضعیت VueX برای درک پروژه ها
پلاگین های VueX
نمونه پلاگین LocalStorage
نام های جهش با استفاده از ثابت ها
توابع کمکی VueX (mapState و mapGetters)
توابع کمکی VueX (mapMutations)
موضوعات میانی VueX و اجزاء:
سازماندهی مجدد برنامه
افزودن اجزای منو
ارائه/تزریق
واکنش پذیری را ارائه/تزریق کنید
اقدامات VueX
VueX Action Dispatching
ماژول های VueX
ماژول های VueX - کار با حالت مدولار
ماژول های فضای نام VueX
Composition API :
ایجاد پروژه با استفاده از Vite
عملکرد راه اندازی
Ref و Reactive
Composition API Computed Properties
Composition API Watchers
Composition API Props
Reactivity Props - toRefs
زمینه ترکیب - انتشار رویدادها
قلاب چرخه حیات ترکیب
Composition API & VueX - راه‌اندازی
Composition API - کار با VueX
Composition API - Composables
Composition API - Composables در مقابل VueX
ویژگی تنظیم اسکریپت
تبدیل به تنظیمات اسکریپت
حرکت از Options API به Composition API:
تبدیل جزء اول و استفاده از toRef
Refs الگو با Composition API
ارائه/تزریق با Composition API
استفاده از VueX با Composition API و Computed Setter
نگاهی به پروژه تبدیل شده و خلاصه
انتقال از Vue CLI به Vite (برای خوب!)
Firebase & Firestore - [پروژه بزرگ]:
Firebase چیست و چرا از آن استفاده کنیم؟
راه اندازی پروژه Firebase
Firestore (پایگاه داده NoSQL) توضیح داده شده است
بازی با Firestore
آیا ما به VueX با Firestore نیاز داریم؟
ابتدا تنظیم داده ها (مهم!)
واکشی یک سند واحد
در حال واکشی همه اسناد مجموعه
اصول جستجوی Firebase
پرس و جوی بیدرنگ داده در Firestore
جستجوی لیست پروژه در زمان واقعی قابل تنظیم
دریافت لیست پروژه ها از Firestore [پروژه]
به‌روزرسانی‌های سند واحد در زمان واقعی [پروژه]
به روز رسانی اسناد (تنظیمات کاربر)
افزودن اسناد
افزودن جزء پروژه ها [پروژه]
مجموعه های فرعی Firestore (نگهداری وظایف)
حذف اسناد
معاملات فایرستور - پروژه دستی:
پرس و جوهای تجمع
معاملات - افزودن کار [پروژه]
معاملات - به‌روزرسانی وظیفه [پروژه]
معاملات - حذف یک کار [پروژه]
Transactions - Moving Task [پروژهct]
مهر زمان و مرتب‌سازی سرور
تأیید هویت، مجوز و امنیت Vue و Firebase:
تنظیم احراز هویت در Firebase
ورود به سیستم، خروج از سیستم و وضعیت احراز هویت
افزودن روتر و فرم ورود به سیستم
ورود به سیستم Logic & Composables
منطق و فرم ثبت نام
نمایه کاربر و اسناد خاص کاربر
ارتباط اسناد با کاربران
قوانین امنیتی توضیح داده شده است
قوانین امنیت پروژه - مثال عملی
دکمه خروج
استقرار تولید:
تثبیت جزء خلاصه پروژه
تنظیمات تولید Tailwind CSS
ساختمان برای تولید و استقرار میزبانی Firebase
انتقال‌ها و انیمیشن‌ها:
معرفی ماژول Transitions & Animations
CSS Transitions
توابع کاهش و منحنی های مکعبی بزیه
انتقال به داخل و انتقال به خارج
انیمیشن های CSS
انتقال های اساسی با Vue
مؤلفه
انتقال های نامگذاری شده
انتقال بین عناصر
کامپوننت انتقال سفارشی
برای متحرک کردن لیست ها