http://s7.picofile.com/file/83797584..._tutorial.jpeg
دوره ی آموزش پروژه محور دفترچه تلفن با Vue.js و فریمورک محبوب Laravel
دوره ی آموزش پروژه محور ساخت دفترچه مخاطبین بصورت single page application یا سایت تک صفحه ای توسط فریمورک Laravel و فریمورک Vue.js و فریمورک Bulma:: سخن مدرس ::در این دوره ی آموزشی بصورت پروژه محور ، یک دفترچه مخاطبین آنلاین میسازیم که بتوانیم عملیات CRUD دیتابیس یا همان عملیات CREATE READ UPDATE DELETE را بدون ریفرش کردن صفحه ی مرورگر و بصورت AJAX با استفاده از Vue.js انجام دهیم . در این دوره ی آموزشی از فریمورک Laravel پی اچ پی برای ایجاد پروژه و ارتباط آن با Vue.js استفاده میکنیم .از فریمورک Bulma که یک فریمورک جدید برای css هست بهره میبریم که باعث بالا رفتن سرعت سایت و همچنین ریسپانسیو بودن آن میشود که در دستگاه های موبایل به خوبی یک اپلیکیشن موبایلی نصب شده اجرا میشود . نحوه ی کار با axios برای ارسال داده ها بصورت AJAX را آموزش میدهیم و در نهایت میتوان گفت شما الفبای فریمورک قوی Vue.js را در این دوره طی خواهید کرد و مطمئنا مباحث مطرح شده در این دوره هم برای فریمورک Vue.js و هم برای Laravel و هم برای Bulma بی نظیر است . :: سرفصل های این دوره ی آموزشی ::
جلسه ۱ :
- معرفی فریمورک Vue.js و مقایسه آن با انواع فریمورک های JavaScript
- آموزش دانلود و نصب Node.js و npm
- آموزش دانلود و نصب Vue.js
جلسه ۲ :
- آموزش افزودن صحیح فایل Vue.js به سند HTML
- آموزش شروع کدنویسی با Vue.js
- آموزش کار با آبجکت اصلی Vue
- آموزش کار با el و انتخاب element مورد نظر
- آموزش کار با متد data و تعریف متغیرهای Vue.js
جلسه ۳ :
- آموزش مدیریت آبجکت ها در Vue.js
- آموزش نحوه ی استفاده از console مرورگر کروم جهت مشاهده ی رخ دادها در طول کدنویسی Vue.js و مدیریت خطاهای کدنویسی رخ داده
- آموزش تغییر لحظه ای داده ها با console
- آموزش کار با delimiters در Vue.js
- آموزش استفاده از v-bind: جهت تغییر ویژگی های تگ های HTML با استفاده از Vue.js
جلسه ۴ :
- آموزش کار با فرم های HTML و V-bind
- آموش کار با v-model
- آموزش کار با v-model-lazy
- آموزش کار با checkbox و v-model برای دریافت آیتم های انتخاب شده در فرم HTML
- آموزش متد join در Vue.js
- آموزش کار با v-for یا ساخت حلقه در Vue.js
جلسه ۵ :
- آموزش کار با آرایه ها در Vue.js
- ساخت یک لیست از آیتم های قابل انتخاب در Vue.js
- آموزش تعریف key برای آیتم های حلقه ی v-for
- آموزش شرط if و else و elseif
جلسه ۶ :
- آموزش کار با رویداد کلیک یا v-on:click
- آموزش کار با توابع در Vue.js و نوشتن تابع جدید در بخش methods
- آموزش استفاده از @click بجای v-on:click در رویداد کلیک
- آموزش کار با @click.prevent
جلسه ۷ :
- آموزش استایل نویسی با Vue.js
- آموزش اختصاص کلاس css توسط Vue.js
- آموزش کار با متد @mousehover در Vue.js
- اختصاص مقادیر استایل با استفاده از v-model
جلسه ۸ :
- آموزش Bind کردن انواع کلاس های css با استفاده از Vuejs به همراه مثال
- تغییر کلاس های css و استایل element های HTML با استفاده از Vue.js
جلسه ۹ :
- آموزش ساخت لیست در Vuejs
- آموزش ساخت لیستی از مرورگرها و ورژن های متناظر آنها بصورت تمرین عملی
جلسه ۱۰ :
- آموزش انتساب رشته ها در Vuejs
- آموزش انجام عملیات ریاضی روی داده های عددی
- آموزش ایجاد پروژه مبدل داده های ریاضی(سانتی متر) بصورت عملی
جلسه ۱۱ :
- آموزش کار با متد indexOf
- ساخت یک پروژه سوال و جواب اتوماتیک برای نشان دادن کارآیی indexOf
- آموزش افزودن Jquery و استفاده از متد Ajax
- آموزش فراخوانی api جیسان یک وب سرویس
- آموزش لود کردن محصولات از یک وب سرویس به همراه توضیحات و تصویر و ...
جلسه ۱۲ :
- آموزش چرخه ی حیات در Vuejs
- آموزش کار با متد beforeCreate
- آموزش کار با متد Created
- آموزش کار با متد beforeMounted
- آموزش کار با متد Mounted
- آموزش کار با متد beforeUpdate
- آموزش کار با متد Updated
- آموزش کار با متد beforeDestroy
- آموزش کار با متد destroyed
- آموزش ایجاد و کار با component های Vue.js
- آموزش ایجاد template های مختلف با استفاده از Component ها
جلسه ۱۳ :
- ادامه ی آموزش کار با component ها و ایجاد component های جدید
- دریافت json از وب سرویس و نمایش محصولات با استفاده از component ها
- آموزش استفاده از component برای افزودن element های جدید
جلسه ۱۴ :
- آموزش نصب و کار با vue.js devtools برای مرورگر کروم
- آموزش ایجاد toggle برای نمایش بخشی از متن محصول
- آموزش کار با devtools جهت پیدا کردن component های vue.js و مدیریت آنها به آسانی
جلسه ۱۵ :
- آموزش پیشرفته ی کار با component ها در Vue.js و ایجاد template های بیشتر
- آموزش کار با scope
- آموزش افزودن تگ های HTML سفارشی به لیست component ها فراخوانی شده با json
جلسه ۱۶ :
- آموزش تعریف متد remove برای پاک کردن یک آیتم از یک لیست در Vue.js
- آموزش کار با متد splice در Vue.js
:: سرفصل دوره ی پروژه محور Vue.js + Laravel ۵ + Bulma ::
جلسه ۱۷ :
- آموزش نصب Composer
- آموزش نصب فریمورک Laravel
- آموزش نصب Nodejs و npm
- آموزش دانلود و نصب فریمورک Bulma
- آموزش نصب Vue.js و Vue-router
جلسه ۱۸ :
- ایجاد view جدید در Laravel
- ایجاد route جدید در Laravel
- آموزش ایجاد یک view به همراه Vuejs در Laravel
- تست و راه اندازی Vuejs و استفاده از Laravel Mix
جلسه ۱۹ :
- آموزش نصب محیط توسعه ی Atom و افزونه های مورد نیاز برای Laravel و Vue.js
- آموزش استفاده از دستور npm run watch برای کامپایل css و js های پروژه در یک فایل
- آموزش ایجاد و استفاده از component مربوط به header و footer سایت توسط Vue.js
- آموزش استفاده از vue-router در پروژه دفترچه مخاطبین
- آموزش ساخت فایل component های مختلف و لود کردن آنها بدون ریفرش شدن مرورگر
جلسه ۲۰ :
- آموزش نصب Font Awesome در Laravel با استفاده از npm
- ایجاد item برای نمایش مخاطبین در لیست
- ایجاد دکمه های مدیریتی مثل ویرایش - حذف - نمایش یک آیتم در دفترچه مخاطبین
- آموزش استفاده از پنجره ی modal در bulma و استفاده ی آن توسط Vue.js
- آموزش کدنویسی رویداد کلیک @click برای نمایش و بستن یک پنجره ی modal
جلسه ۲۱ :
- آموزش ایجاد دامنه ی مجازی در xampp بصورت phonebook.me
- آموزش ساخت Model جدید در لاراول
- آموزش ساخت migration جدید در لاراول
- آموزش ساخت Controller جدید در لاراول از نوع resource
- آموزش مدیریت جدول دیتابیس با استفاده از Migration
- آموزش استفاده از php artisan جهت migrate کردن تغییرات جدول دیتابیس
جلسه ۲۲ :
- آموزش اعتبار سنجی فرم با Laravel Request اختصاصی و Vuejs
- آموزش نصب axios و استفاده از آن برای درج اطلاعات در پایگاه داده با استفاده از Model لاراول و Vuejs بصورت ایجکسی ( درج مخاطب جدید )
جلسه ۲۳ :
- آموزش ایجاد متد جدید getData در کنترلر برای لود کردن داده های مخاطبین از دیتابیس
- آموزش لود کردن داده ها توسط axios
- آموزش پر کردن لیست از مخاطبین موجود در دیتابیس توسط Vue.js
جلسه ۲۴ :
- آموزش ایجاد modal جدید و نمایش آن زمان کلیک شدن نمایش یک مخاطب
- آموزش فراخوانی یک مخاطب با آیدی بدون رفرش صفحه توسط axios
- آموزش نمایش اطلاعات یک مخاطب لود شده در modal ایجاد شده
جلسه ۲۵ :
- آموزش ایجاد modal یا پنجره جدید با استفاده از Vue.js برای عملیات بروزرسانی یک مخاطب خاص از دفترچه مخاطبین
- آموزش فراخوانی اطلاعات مخاطب از دیتابیس و نمایش ان در فرم modal ، جهت ویرایش
- آموزش ثبت تغییرات انجام شده در دیتابیس با Axios و متدهای model
جلسه ۲۶ :
- آموزش ایجاد متد delete یک مخاطب خاص از دیتایس با استفاده از axios
- آموزش برنامه نویسی متد delete و پاک کردن آیتم انتخاب شده توسط Vue.js و متد destroy کنترلر ، بدون رفرش مرورگر
جلسه ۲۷ :
- رفع برخی باگ های پروژه
- آموزش تبدیل تمام قسمت های پروژه به یک وب سایت Single Page Application
جلسه ۲۸ :
- آموزش مرتب کردن خودکار لیست توسط Vue.js بصورت حروف الفبایی بعد از درج یک فیلد جدید بدون نیاز به رفرش مرورگر
- آموزش خالی کردن فیلد های فرم به محض افزودن یک آیتم برای لیست مخاطبین با استفاده از دستورات Vue.js
جلسه ۲۹ :
- آموزش ایجاد متد جستجو بین آیتم های لیست مخاطبین با وارد کردن عبارت در input جستجو
- ایجاد watcher برای جستجو بین فیلدهای Name
جلسه ۳۰ :
- آموزش کدنویسی جستجوی پیشرفته برای سرچ بین فیلد های دیگر مثل email , phone و ...
- آموزش پر کردن لیست از نتایج جستجو شده و بازگشت اطلاعات قبلی بعد از پاکسازی فیلد جستجو
- جستجو بصورت آنی با تایپ هر حرف یا حذف آن ، در فیلد input جستجو
در بالا خلاصه ای از سرفصل های دو دوره ی آموزشی فوق العاده برای شما آورده شده است که میتوانید با مطالعه سرفصل ها ، قبل از تهیه این دوره دید کلی نسبت به این دوره داشته باشید .
برای دریافت دوره ی آموزشی لینک زیر کلیک کنید :
دوره ی آموزشی پروژه محور دفترچه تلفن با Vue.js و Laravel
.
