آموزش Vuetify: یک برنامه با Vue JS و Vuex ایجاد کنید - آخرین آپدیت

درس ها Lessons

• هنگام جستجو، مرتب سازی را غیرفعال کنید Disable Sorting when Searching

• ذخیره تاریخ سررسید و بستن گفتگو Save Due Date & Close Dialog

• کشو را راه اندازی کنید Setup the Drawer

• یک تصویر اضافه کنید Add an Image

• علامت زدن کار به عنوان انجام شده Mark Task as Done

• Tasks را به Vuex Store منتقل کنید Move Tasks into Vuex Store

• متد ()deleteTask را به Vuex Store منتقل کنید Move deleteTask() Method into Vuex Store

• فیلد جستجو را اضافه کنید Add the Search Field

• Task را حذف کنید Delete Task

• مؤلفه کودک «بدون کار» را ایجاد کنید Create “No Tasks” Child Component

• عنوان به‌روزرسانی را حفظ کنید Make Update Title Persist

• باز کردن روی Focus، Close روی Blur Open on Focus, Close on Blur

• کامپوننت Task Child را ایجاد کنید Create Task Child Component

• با Wireframe شروع کنید Start with a Wireframe

• دیالوگ را سفارشی کنید و روی حذف کلیک کنید Customize Dialog and Show on Delete Click

• اضافه کردن نام و نام کاربری Add Name & Username

• آن را به Vuex State متصل کنید Hook it up to Vuex State

• در تغییر مسیر نام صفحه را به عنوان اضافه کنید Add Page Name to Title on Route Change

• تاریخ واقعی را نشان دهید Show the Real Date

• پوشه و ساختار فایل Folder & File Structure

• متد doneTask() را به Vuex Store منتقل کنید Move doneTask() Method into Vuex Store

• افزودن وظیفه را ادامه دهید Make Add Task Persist

• فهرستی از وظایف ایجاد کنید Create a List of Tasks

• سبک های سرصفحه Header Styles

• دیالوگ را ببندید Close the Dialog

• ساخت برای تولید Build for Production

• صفحات را آماده کنید Get Pages Ready

• تاریخ و زمان کامل را نمایش دهید و آن را زنده کنید Display Full Date & Time and Make it Live

• Node.js و Vue CLI را نصب کنید Install Node.js & Vue CLI

• Task را ذخیره کنید Save the Task

• پنهان کردن فیلد افزودن وظیفه در صفحه درباره Hide Add Task Field on About Page

• مقدمه Introduction

• یک مؤلفه Snackbar ایجاد کنید Create a Snackbar Component

• وضعیت Vuex را به روز کنید Update the Vuex State

• یک ویژگی داده برای Tasks اضافه کنید Add a Data Property for the Tasks

• Vuex چیست؟ What is Vuex?

• Data & Styles را تنظیم کنید Setup the Data & Styles

• رفع مشکلات هدر Fix Header Issues

• تاریخ را با date-fns فیلتر کنید Filter the Date with date-fns

• بهبود سبک Improve the Style

• اجازه دهید Snackbar رد شود Allow Snackbar to be Dismissed

• Vue Draggable را نصب کنید Install Vue Draggable

• اعتبار سنجی فیلد Field Validation

• از متغیر محیطی در اجزای ما استفاده کنید (2) Use the Environment Variable in Our Components (2)

• پروژه را پاکسازی کنید Clean up the Project

• یک مخزن از راه دور در GitHub راه اندازی کنید Setup a Remote Repository on GitHub

• راه اندازی صفحات و مسیرها Setup Pages & Routes

• تست روی iOS Testing on iOS

• فقط اگر خالی باشد ببندید Only Close if Empty

• اجزای کودک؟ Child Components?

• اعتبار سنجی فیلد وظیفه را اضافه کنید Add Task Field Validation

• سفارش مجدد را ادامه دهید Make Reordering Persist

• از متغیر محیطی در صفحه و روتر HTML استفاده کنید Use Environment Variable in HTML Page & Router

• افزودن آیتم منوی مرتب سازی و دکمه مرتب سازی انجام شد Add Sort Menu Item & Done Sorting Button

• Task را حذف کنید Delete Task

• متن اسنکبار را پویا کنید Make the Snackbar Text Dynamic

• Tasks را از Localbase در بارگیری دریافت کنید Get Tasks from Localbase on Load

• یک پروژه Vue ایجاد کنید و Vuetify را اضافه کنید Create a Vue Project & Add Vuetify

• رفع مشکلات اسکرول Fix Scrolling Issues

• نمایش Snackbar هنگام حذف وظیفه Show Snackbar when Task Deleted

• از متغیر محیطی در اجزای ما استفاده کنید (1) Use the Environment Variable in Our Components (1)

• هنگامی که دکمه "بله" کلیک کردید، وظیفه را حذف کنید Delete the Task when “Yes” Button Clicked

• یک آواتار اضافه کنید Add an Avatar

• خوش آمدی! Welcome!

• دیالوگ را ایجاد کنید Create the Dialog

• عنوان صفحه پایه را تنظیم کنید Set a Base Page Title

• نمایش نوار اسنک Show a Snackbar

• Delete Task را ادامه دهید Make Delete Task Persist

• دیالوگ را ایجاد کنید Create the Dialog

• رسیدگی به کلیک ها Handle Clicks

• یک مخزن گیت محلی راه اندازی کنید Setup a Local Git Repository

• کشو را به صورت پیش فرض در تبلت و بالاتر نشان دهید Show the Drawer by Default on Tablet & Above

• ایجاد مؤلفه فرزند فهرست وظایف Create Task List Child Component

• اسنک بارها را تعمیر کنید Fix the Snackbars

• تداوم کار انجام شده Make Done Task Persist

• نمایش عنوان کار فعلی در گفتگو Display Current Task Title in Dialog

• یک منوی کار اضافه کنید Add a Task Menu

• افزودن انیمیشن Add Animation

• Localbase را نصب کنید Install Localbase

• دیالوگ "Prompt to Delete" را نمایش دهید Show a “Prompt to Delete” Dialog

• ویرایشگر و راه اندازی نرم افزار Editor & Software Setup

• متغیر محیطی برای عنوان برنامه Environment Variable for App Title

• Task را اضافه کنید Add Task

• Vue Devtools را روی کروم نصب کنید Install Vue Devtools on Chrome

• کمی سبک اضافه کنید Add Some Style

• فیلد جستجو را ببندید Close the Search Field

• نمایش Snackbar هنگام اضافه شدن وظیفه Show Snackbar when Task Added

• به Snackbar ها اجازه دهید به صورت پیاپی سریع نمایش داده شوند Allow Snackbars to be Shown in Quick Succession

• در Netlify مستقر شوید Deploy to Netlify

• یک Getter برای فیلتر کردن وظایف ایجاد کنید Create a Getter to Filter the Tasks

• متد addTask() را به Vuex Store منتقل کنید Move addTask() Method into Vuex Store

• آیتم ها و نمادهای منو را اضافه کنید Add the Menu Items & Icons

• مبانی Vue.js Vue.js Basics

• تست در اندروید Testing on Android

• تصویر و عنوان را جایگزین کنید Replace Image & Title

• بدون بازگشت به کار No Tasks Fallback

• تاریخ سررسید را ثابت نگه دارید Make Due Date Persist

• دیالوگ را نمایش دهید و تاریخ فعلی را انتخاب کنید Show Dialog and Select Current Date

• بستن دیالوگ روی "نه" کلیک کنید Close the Dialog on “No” Click

• ایجاد Add Task Field Component Child Create Add Task Field Child Component

• Sort Handle & Setup State را اضافه کنید Add the Sort Handle & Setup State

• Vuetify چیست؟ What is Vuetify?

• یک مؤلفه تاریخ و زمان زنده ایجاد کنید Create a Live Date & Time Component

• فیلد Add Task را برطرف کنید Fix the Add Task Field