godofphp
سه شنبه 05 آذر 1398, 18:12 عصر
http://s7.picofile.com/file/8379758418/vuejs_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 (https://avasam.ir/product/27)
.
دوره ی آموزش پروژه محور دفترچه تلفن با 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 (https://avasam.ir/product/27)
.