کورس یادگیری کامل Vue.js 3 و Vite و Tailwind CSS

VUE3، tailwindcss، vuex، روتر Vue، ترکیب API، Pinia، و Vite

عنوان اصلی : Complete Vue.js 3 Course: Vuejs 3, Vite, TailwindCSS, Pinia

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

دستورالعمل‌های آماده‌سازی، مبانی Vue، واکنش‌پذیری و معمولاً مورد استفاده Vue:
نحو قالب، واکنش پذیری، به روز رسانی اجباری
v-bind: کنترل مقادیر مشخصه
v-bind قسمت 2
v-text، v-html، v-once، v-pre، و v-cloak
رندر شرطی: v-show، v-if، v-else، و v-else-if
v-for: تکرار روی آرایه ها و اشیا
v-for: JSON
ویژگی‌های محاسبه‌شده، روش‌های Vue و v-on:
ویژگی های محاسبه شده: مقدمه
ویژگی های محاسبه شده: هشدارها
ویژگی های محاسبه شده: موقعیت های سخت
ویژگی های محاسبه شده + v-for ===
_
روش ها و دستورالعمل V-ON:
V-ON و Closure
اصلاح‌کننده‌های رویداد: یک بار، .stop، .self، .capture و .prevent
اصلاح کننده غیرفعال
تمرین و چالش: ترتیب موارد فهرست:
مرتب سازی همه موارد فهرست
پین کردن یک مورد انتخاب شده در بالای لیست
مرتب سازی موارد فهرست به صورت جداگانه
پیگیری تغییر ترتیب موارد فهرست
تمرین و چالش: Vue + COOKIE:
معرفی کوکی
عملیات پایه کوکی
درخواست اجازه کاربر
منویی که قسمت 1 را "به خاطر می آورد".
منویی که قسمت 2 را "به خاطر می آورد".
تمرین و چالش: Vue + Recursion:
مقدمه ای بر بازگشت
کپی عمیق یک آرایه یا شی
لیست "بی نهایت".
بهبود
جمع آوری داده از کاربران:
V-MODEL و اصلاح کننده های آن: Number، Lazy و Trim
Mini APP: محدود کردن داده های ارسالی توسط کاربر
V-MODEL در دکمه های رادیویی
V-MODEL در لیست های انتخابی و چک باکس ها
برنامه کوتاه
کنترل سبک‌های CSS با استفاده از Vue:
کلاس های CSS اتصال
کنترل CSS درون خطی
برنامه و تمرین: برجسته کردن خودکار موارد فهرست انتخاب شده
اجرای خودکار: قلاب چرخه حیات:
قلاب چرخه زندگی
به روز رسانی و رندر قلاب ها
اجرای خودکار: Watchers:
دیده بان ها
تماشای آرایه ها و اشیا
زمان‌بندی فلاش
نظارتان چندگانه
$watch
$watch: آرایه ها و اشیا
تنظیم یک گیرنده برای تماشای نتایج پیچیده
اجزای Vue :
معرفی اجزای کودک Vue
قلاب چرخه زندگی اجزای کودک
لوازم
Props Misc
نحو شیء برای تنظیم Props: PLACEHOLDER VIDEO
رویدادهای سفارشی: ارسال داده از مؤلفه فرزند به مؤلفه اصلی آن
ایجاد یک مسیر داده دو طرفه بین مؤلفه والد و فرزند اول آن
استفاده از دستورالعمل v-model در برچسب‌های مؤلفه کودک
اصول اسلات
شکاف های محدوده
تله پورت
به ارث بردن ویژگی های غیر مناسب
اجزای پویا
KeepAlive: استفاده مجدد از نمونه های مؤلفه
خروجی مولفه ها به صورت پویا
اثرات گذار:
ویژگی های انتقال CSS
کلاس های انتقال Vue
ایجاد افکت انتقال
انتقال موارد فهرست
نحوه استفاده از Animate.css
ایجاد جلوه های انتقال با استفاده از Animate.css
قلاب های انتقالی
چگونه با استفاده از GSAP "Tween" کنیم: پلتفرم انیمیشن جوراب سبز
کشورهای در حال گذار با استفاده از GSAP
مؤلفه انتقال
کدهای استفاده مجدد: ترکیب ها و دستورالعمل های سفارشی:
میکسین
مقدمه ای بر دستورالعمل های سفارشی
استدلال الزام آور: انتقال اطلاعات خارجی به دستورالعمل های سفارشی
یک کاربرد واقعی دستورالعمل سفارشی
رندر:
معرفی رندر
رندر اسلات
ارائه دستورالعمل های Vue
ارائه دستورالعمل‌های Nested v-for: مدیریت آرایه‌های JSON
ارائه دستورالعمل مدل V
مولفه ها را با دستورالعمل v-model رندر کنید
پردازش اجزای پویا
ارائه دستورالعمل های سفارشی
واکنش پذیری Vue 3 در عمق:
واکنش پذیری Vue: Vue.ref() و Vue.reactive()
Vue.computed()
Vue.reactive() متفرقه
Vue.ref() متفرقه
Vue.customRef()
معرفی Debounce
در Vue در حال رد شدن است
جلوگیری با استفاده از مرجع سفارشی
دریچه گاز
ارائه و تزریق مقدمه
ارائه و تزریق نحو تابع
مهم: درک این موضوع برای خوب:
همه چیز درباره این
آزمایش درک شما از این
Vue Watcher و کاربرد آن:
Vue.watch()
Vue.watchEffect
ایجاد یک درخواست Axios قابل لغو
ایجاد یک درخواست Axios قابل لغو با استفاده از Vue
برخورد با کاربران بی حوصله
Vue 3 Composition API: تابع SetUp:
Vue 3 Composition API: تابع SetUp
ارائه و تزریق کنید
تعریف روشها در تابع SetUp
دو آرگومان تابع SetUp: Props و Context
ویژگی ها و اسلات های غیر مناسب
context.expose(): کنترل آنچه از vm.$refs.ref_name دریافت می کنید
بررسی الگوی بسته شدن و کارخانه
ایجاد یک برنامه شمارنده با استفاده از بسته شدن و الگوی کارخانه
کاربرد تابع SetUp: حفاظت از اطلاعات حساس
کاربرد واقعی SetUp Function: Protectکلید تأیید
انتقال همه چیز به تابع SetUp
اجزای فایل واحد: Vue CLI & Vite:
Vue CLI 4
سفارشی کردن بسته بندی
برنامه SFC قسمت 2
برچسب تنظیم اسکریپت
روتر Vue:
حالت WebHistory
مسیرهای نامگذاری شده
نمای نامگذاری شده
مسیرهای تودرتو و نمای تودرتو
مسیرهای پویا
RegEx
سوابق تاریخ
مسیریابی برنامه ای
متفرقه: خصوصیات پرس و جو، تغییر مسیر مسیر، و نام مستعار مسیر
لوازم روتر Vue
نگهبانان در هر مسیر
نگهبان های درون جزئی
گاردهای جهانی
KeepAlive و Transition
انتقال های سفارشی
تضاد ناشی از KeepAlive و Key
پرس و جو از API Backend بعد از پیمایش
پرس و جو از API Backend قبل از ناوبری
استفاده از روتر Vue در تابع SetUp
چرا نباید IMMEDIATE را روی TRUE تنظیم کنید
onBeforeRouteUpdate و onBeforeRouteLeave Guards
نحوه هایلایت کردن Active RouterLink
روتر لینک سفارشی
جزء روتر لینک سفارشی
روتر لینک را جایگزین کنید
نقص ناوبری
پیمایش کنید
Vue Router Single File Component
برنامه تک فایل روتر Vue
VueX:
وضعیت VueX در جزئیات
VueX Getter در جزئیات
جهش VueX در جزئیات
VueX State و V-MODEL
اقدامات VueX در جزئیات
اولین برنامه VueX: هر چیزی را که یاد گرفته ایم اعمال کنید
ماژول های VueX: وضعیت ها و دریافت کننده ها
فضای نام ماژول VueX
جهش‌های ماژول VueX
اقدامات ماژول VueX
ماژول های پویا VueX
افزونه های ماژول VueX
برنامه پلاگین VueX
از VueX در تابع SetUp استفاده کنید
برنامه آب و هوا را دوباره ایجاد کنید
راه اندازی VueX در اجزای فایل منفرد
Pinia: جایگزینی بهتر و قدرتمندتر برای VueX:
معرفی پینیا و خداحافظی با VueX
تنظیم Pinia
مشکلات با نسخه فعلی Pinia
ایالات پینیا
Pinia Actions
Pinia $onActions
پلاگین های Pinia
کتابخانه UI: Tailwind برای Vue 3:
مقدمه ای بر Tailwindcss
تنظیم و پیکربندی Tailwind
لایه ها و اولویت ها
لایه های Tailwind
@import
انواع بادهای دمی
طراحی واکنشگرا
موضوع: سفارشی کردن کلاس های کاربردی
ویدیوهای قدیمی:
معرفی Vue.js
مقدمه: MVVM، MVC، واکنش پذیری، اتصال داده دو طرفه، ارائه سمت سرور
Vue 2 Reactivity
Vue 3 Reactivity
الگوی کارخانه و الگوی تک تن
ایجاد یک برنامه Virtual Vue 3
اولین برنامه Vue.js 3
$ref
محاسبه شده
v-for: تکرار روی آرایه ها و اشیا
v-for: JSON
"به طور تصادفی شکسته شود" واکنش پذیری ویژگی های محاسبه شده