آموزش Nuxt.js 2 - Vue.js در استروئیدها

Nuxt.js 2 - Vue.js on Steroids

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: برنامه های Vue JS بسیار جذاب را با Nuxt.js بسازید. Nuxt رندر سمت سرور و رویکرد پیکربندی مبتنی بر پوشه را اضافه می کند. ساخت اپلیکیشن های تک صفحه ای ارائه شده از سمت سرور (SPA) ساخت SPA های معمولی و بهینه شده با کمترین تلاش ایجاد یک صفحه وب ثابت از کد Vuejs در واقع همه، بقیه را در دوره یاد خواهید گرفت :)

Vue.js یک چارچوب جاوا اسکریپت شگفت انگیز است که می توانید از آن برای ایجاد رابط های کاربری بسیار جذاب و برنامه های تک صفحه ای استفاده کنید. اگر می‌خواهید درباره این چارچوب عالی بیشتر بدانید، می‌توانید به دوره پرفروش من در Vue.js، اینجا در Udemy بپیوندید!

Nuxt.js آن را به سطح بعدی می برد!

این یک کتابخانه برای Vue.js است (نوعی "چارچوبی برای یک چارچوب") و دو چیز اصلی را به Vue.js اضافه می کند:

  • اجرای برنامه Vue شما در سمت سرور از جعبه

  • پیکربندی آسان برنامه Vue از طریق پوشه ها و فایل ها

مطمئناً در این دوره آموزشی همه جزئیات را خواهید آموخت، اما مهمترین نکته این است که Nuxt.js ایجاد برنامه های Vue بهتر، بهینه تر و توانمندتر را بسیار آسان تر می کند - و همه اینها در حالی که تقریباً هیچ اضافه نمی کند. سربار.

در این دوره، نحوه ایجاد برنامه های Nuxt/Vue را از ابتدا به شما آموزش می دهم! ما یک پروژه دوره کامل می سازیم و به ویژگی های اصلی ارائه شده توسط Nuxt.js می پردازیم.

در پایان دوره، یک برنامه کامل Vue خواهید داشت که با Nuxt.js ساخته شده است که می تواند بر روی سرور (یا به عنوان یک وب سایت ثابت!) ارائه شود و بسیار بهینه شده است.

این دوره به شما می آموزد ...

  • ... Nuxt.js دقیقاً چیست و چگونه به Vue.js متصل می شود

  • ... چگونه از Nuxt.js برای ساختن برنامه های بهتر Vue استفاده می کنید

  • ... هر آنچه باید در مورد رویکرد "پیکربندی از طریق فایل‌های پوشه‌ها" که توسط Nuxt اتخاذ شده است بدانید

  • ... امکانات مختلف ساخت مانند برنامه‌های SSR، SPA یا یک صفحه وب ثابت

  • ... نحوه ساخت کل پروژه، از جمله احراز هویت، از طریق Nuxt.js

  • و خیلی بیشتر!

من کی هستم؟

اسم من ماکسیمیلیان شوارتزمولر است و صفحه وب شرکتم (Academind) را با Nuxt.js ساختم.

علاوه بر این، من مربی دوره پرفروش Vue.js با رتبه 5* در Udemy هستم. من با Vue کار کردم از آنجایی که نسخه بتا است، همین امر برای Nuxt.js نیز صادق است.

من کاملاً عاشق این دو فریمورک هستم و نمی‌توانم منتظر بمانم تا با شما آنها را بررسی کنم!


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

شروع شدن Getting Started

  • خوش آمدید و معرفی Welcome & Introduction

  • Nuxt.js چیست؟ What is Nuxt.js?

  • به انجمن آموزش آنلاین ما بپیوندید Join our Online Learning Community

  • آشنایی با رندر سمت سرور Understanding Server Side Rendering

  • Nuxt در مقابل رندر سمت سرور "عادی". Nuxt vs "Normal" Server Side Rendering

  • ایجاد پروژه های جدید Nuxt و Nuxt 2 Creating New Nuxt Projects & Nuxt 2

  • ایجاد اولین برنامه Nuxt ما Creating our First Nuxt App

  • آشنایی با ساختار پوشه Understanding the Folder Structure

  • چه چیزی می توانیم با Nuxt بسازیم؟ What can we Build with Nuxt?

  • داخل این دوره چیست؟ What's Inside This Course?

  • چگونه از این دوره بیشترین بهره را ببرید How To Get The Most Out Of This Course

  • کجا کد منبع را پیدا کنیم Where to Find the Source Code

شروع شدن Getting Started

  • خوش آمدید و معرفی Welcome & Introduction

  • Nuxt.js چیست؟ What is Nuxt.js?

  • به انجمن آموزش آنلاین ما بپیوندید Join our Online Learning Community

  • آشنایی با رندر سمت سرور Understanding Server Side Rendering

  • Nuxt در مقابل رندر سمت سرور "عادی". Nuxt vs "Normal" Server Side Rendering

  • ایجاد پروژه های جدید Nuxt و Nuxt 2 Creating New Nuxt Projects & Nuxt 2

  • ایجاد اولین برنامه Nuxt ما Creating our First Nuxt App

  • آشنایی با ساختار پوشه Understanding the Folder Structure

  • چه چیزی می توانیم با Nuxt بسازیم؟ What can we Build with Nuxt?

  • داخل این دوره چیست؟ What's Inside This Course?

  • چگونه از این دوره بیشترین بهره را ببرید How To Get The Most Out Of This Course

  • کجا کد منبع را پیدا کنیم Where to Find the Source Code

صفحات، مسیریابی و بازدیدها Pages, Routing & Views

  • معرفی ماژول Module Introduction

  • از پوشه ها به مسیرها From Folders to Routes

  • ایجاد یک مسیر با یک مسیر پویا Creating a Route with a Dynamic Path

  • افزودن پیوندها و پیمایش در اطراف Adding Links & Navigating Around

  • زمان تمرین - صفحات و مسیریابی Time to Practice - Pages & Routing

  • اعتبارسنجی پارامترها Validating Parameters

  • ایجاد مسیرهای تودرتو Creating Nested Routes

  • طرح‌بندی، صفحات و مؤلفه‌ها - تئوری Layouts, Pages & Components - Theory

  • افزودن یک طرح بندی جدید Adding a New Layout

  • افزودن صفحه خطای پیش فرض Adding a Default Error Page

  • کار با اجزای "عادی". Working with "Normal" Components

  • استایل سازی برنامه های Nuxt Styling Nuxt Apps

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

صفحات، مسیریابی و بازدیدها Pages, Routing & Views

  • معرفی ماژول Module Introduction

  • از پوشه ها به مسیرها From Folders to Routes

  • ایجاد یک مسیر با یک مسیر پویا Creating a Route with a Dynamic Path

  • افزودن پیوندها و پیمایش در اطراف Adding Links & Navigating Around

  • زمان تمرین - صفحات و مسیریابی Time to Practice - Pages & Routing

  • اعتبارسنجی پارامترها Validating Parameters

  • ایجاد مسیرهای تودرتو Creating Nested Routes

  • طرح‌بندی، صفحات و مؤلفه‌ها - تئوری Layouts, Pages & Components - Theory

  • افزودن یک طرح بندی جدید Adding a New Layout

  • افزودن صفحه خطای پیش فرض Adding a Default Error Page

  • کار با اجزای "عادی". Working with "Normal" Components

  • استایل سازی برنامه های Nuxt Styling Nuxt Apps

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

پروژه - صفحات، مسیریابی و نماها Project - Pages, Routing & Views

  • معرفی ماژول Module Introduction

  • ایجاد "بخش" اصلی (صفحات) Creating the Main "Sections" (Pages)

  • اضافه کردن فونت های خارجی Adding External Fonts

  • ایجاد صفحه فرود Creating the Landing Page

  • تقسیم صفحه به اجزا Splitting the Page into Components

  • افزودن دارایی های ثابت - تصویر پس زمینه Adding Static Assets - The Background Image

  • اضافه کردن کامپوننت هدر Adding the Header Component

  • روتر Vue در مقابل روتر Nuxt Vue Router vs. Nuxt Router

  • کار بر روی صفحه پست Working on the Post Page

  • ایجاد بخش مدیریت Creating an Admin Section

  • آماده سازی Backend Preparing the Backend

  • بهبود برنامه Improving the App

  • اضافه کردن یک چیدمان جداگانه به قسمت مدیریت Adding a Separate Layout to the Admin Area

  • منابع و لینک های مفید Useful Resources & Links

پروژه - صفحات، مسیریابی و نماها Project - Pages, Routing & Views

  • معرفی ماژول Module Introduction

  • ایجاد "بخش" اصلی (صفحات) Creating the Main "Sections" (Pages)

  • اضافه کردن فونت های خارجی Adding External Fonts

  • ایجاد صفحه فرود Creating the Landing Page

  • تقسیم صفحه به اجزا Splitting the Page into Components

  • افزودن دارایی های ثابت - تصویر پس زمینه Adding Static Assets - The Background Image

  • اضافه کردن کامپوننت هدر Adding the Header Component

  • روتر Vue در مقابل روتر Nuxt Vue Router vs. Nuxt Router

  • کار بر روی صفحه پست Working on the Post Page

  • ایجاد بخش مدیریت Creating an Admin Section

  • آماده سازی Backend Preparing the Backend

  • بهبود برنامه Improving the App

  • اضافه کردن یک چیدمان جداگانه به قسمت مدیریت Adding a Separate Layout to the Admin Area

  • منابع و لینک های مفید Useful Resources & Links

مدیریت داده ها Handling Data

  • معرفی ماژول Module Introduction

  • افزودن داده های پویا Adding Dynamic Data

  • آماده سازی داده ها در سمت سرور (از طریق Nuxt) Preparing Data on the Server-Side (through Nuxt)

  • زمان تمرین - داده های سمت سرور Time to Practice - Server-Side Data

  • asyncData روی کلاینت و سرور asyncData on Client & Server

  • نگاهی دقیق تر به Context Object A Closer Look at the Context Object

  • افزودن داده های Async به یک پست واحد Adding Async Data to a Single Post

  • رسیدگی به خطاها با پاسخ به تماس Handling Errors with a Callback

  • استفاده از Promises در asyncData Using Promises in asyncData

  • مهم: در سخنرانی بعدی سرور توسعه دهنده را راه اندازی مجدد کنید! Important: Restart the dev server in next lecture!

  • افزودن فروشگاه Vuex Adding the Vuex Store

  • Vuex، fetch() و nuxtServerInit() Vuex, fetch() and nuxtServerInit()

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

مدیریت داده ها Handling Data

  • معرفی ماژول Module Introduction

  • افزودن داده های پویا Adding Dynamic Data

  • آماده سازی داده ها در سمت سرور (از طریق Nuxt) Preparing Data on the Server-Side (through Nuxt)

  • زمان تمرین - داده های سمت سرور Time to Practice - Server-Side Data

  • asyncData روی کلاینت و سرور asyncData on Client & Server

  • نگاهی دقیق تر به Context Object A Closer Look at the Context Object

  • افزودن داده های Async به یک پست واحد Adding Async Data to a Single Post

  • رسیدگی به خطاها با پاسخ به تماس Handling Errors with a Callback

  • استفاده از Promises در asyncData Using Promises in asyncData

  • مهم: در سخنرانی بعدی سرور توسعه دهنده را راه اندازی مجدد کنید! Important: Restart the dev server in next lecture!

  • افزودن فروشگاه Vuex Adding the Vuex Store

  • Vuex، fetch() و nuxtServerInit() Vuex, fetch() and nuxtServerInit()

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

اتصال برنامه ما به Backend Connecting our App to the Backend

  • معرفی ماژول Module Introduction

  • اجرای کد روی سرور Executing Code on the Server

  • افزودن Firebase به عنوان Backend Adding Firebase as a Backend

  • استفاده از Firebase برای ذخیره داده ها Using Firebase to Store Data

  • واکشی داده ها از Backend Fetching Data from the Backend

  • راه اندازی فروشگاه ما Initializing our Store

  • واکشی همه پست ها Fetching all Posts

  • زمان تمرین - واکشی داده ها Time to Practice - Fetching Data

  • ویرایش پست ها Editing Posts

  • همگام سازی Vuex و Backend Synchronizing Vuex and the Backend

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

اتصال برنامه ما به Backend Connecting our App to the Backend

  • معرفی ماژول Module Introduction

  • اجرای کد روی سرور Executing Code on the Server

  • افزودن Firebase به عنوان Backend Adding Firebase as a Backend

  • استفاده از Firebase برای ذخیره داده ها Using Firebase to Store Data

  • واکشی داده ها از Backend Fetching Data from the Backend

  • راه اندازی فروشگاه ما Initializing our Store

  • واکشی همه پست ها Fetching all Posts

  • زمان تمرین - واکشی داده ها Time to Practice - Fetching Data

  • ویرایش پست ها Editing Posts

  • همگام سازی Vuex و Backend Synchronizing Vuex and the Backend

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

Nuxt - پیکربندی، پلاگین ها و ماژول ها Nuxt - Config, Plugins & Modules

  • معرفی ماژول Module Introduction

  • فایل پیکربندی Nuxt The Nuxt Config File

  • ویژگی بارگیری The Loading Property

  • کار با متغیرهای محیطی Working with Environment Variables

  • دستکاری تنظیمات مسیریابی Manipulating Routing Settings

  • متحرک سازی انتقال صفحه Animating Page Transitions

  • اضافه کردن پلاگین ها Adding Plugins

  • ثبت فیلتر تاریخ Registering a Date Filter

  • درک ماژول ها Understanding Modules

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

Nuxt - پیکربندی، پلاگین ها و ماژول ها Nuxt - Config, Plugins & Modules

  • معرفی ماژول Module Introduction

  • فایل پیکربندی Nuxt The Nuxt Config File

  • ویژگی بارگیری The Loading Property

  • کار با متغیرهای محیطی Working with Environment Variables

  • دستکاری تنظیمات مسیریابی Manipulating Routing Settings

  • متحرک سازی انتقال صفحه Animating Page Transitions

  • اضافه کردن پلاگین ها Adding Plugins

  • ثبت فیلتر تاریخ Registering a Date Filter

  • درک ماژول ها Understanding Modules

  • بسته شدن Wrap Up

  • منابع و لینک های مفید Useful Resources & Links

میان افزار و احراز هویت Middleware & Authentication

  • معرفی ماژول Module Introduction

  • Middleware چیست؟ What is Middleware?

  • اضافه کردن ثبت نام کاربر Adding User Signup

  • افزودن ورود کاربر Adding User Login

  • ذخیره توکن Storing the Token

  • استفاده از توکن برای احراز هویت Using the Token for Authentication

  • پیاده سازی میان افزار Implementing a Middleware

  • باطل کردن توکن Invalidating the Token

  • تداوم توکن در سراسر صفحه بازخوانی می شود Persisting the Token Across Page Refreshes

  • پیاده سازی کوکی ها Implementing Cookies

  • تعمیر تایمر خروج Fixing the Logout Timer

  • افزودن عملکرد خروج Adding the Logout Functionality

  • رفع اشکال سریع A Quick Bugfix

  • منابع و لینک های مفید Useful Resources & Links

میان افزار و احراز هویت Middleware & Authentication

  • معرفی ماژول Module Introduction

  • Middleware چیست؟ What is Middleware?

  • اضافه کردن ثبت نام کاربر Adding User Signup

  • افزودن ورود کاربر Adding User Login

  • ذخیره توکن Storing the Token

  • استفاده از توکن برای احراز هویت Using the Token for Authentication

  • پیاده سازی میان افزار Implementing a Middleware

  • باطل کردن توکن Invalidating the Token

  • تداوم توکن در سراسر صفحه بازخوانی می شود Persisting the Token Across Page Refreshes

  • پیاده سازی کوکی ها Implementing Cookies

  • تعمیر تایمر خروج Fixing the Logout Timer

  • افزودن عملکرد خروج Adding the Logout Functionality

  • رفع اشکال سریع A Quick Bugfix

  • منابع و لینک های مفید Useful Resources & Links

سمت سرور The Server Side

  • معرفی ماژول Module Introduction

  • افزودن میان افزار سمت سرور Adding Server Side Middleware

  • تست Middleware Testing the Middleware

  • شروع پروژه با قالب سمت سرور Starting a Project with a Server Side Template

  • منابع و لینک های مفید Useful Resources & Links

سمت سرور The Server Side

  • معرفی ماژول Module Introduction

  • افزودن میان افزار سمت سرور Adding Server Side Middleware

  • تست Middleware Testing the Middleware

  • شروع پروژه با قالب سمت سرور Starting a Project with a Server Side Template

  • منابع و لینک های مفید Useful Resources & Links

ساخت اپلیکیشن Nuxt Building a Nuxt App

  • معرفی ماژول Module Introduction

  • یونیورسال در مقابل SPA در مقابل استاتیک Universal vs SPA vs Static

  • ساخت برنامه ما به عنوان یک برنامه جهانی Building our App as a Universal App

  • استقرار یک برنامه جهانی Deploying a Universal App

  • ساخت برنامه ما به عنوان یک SPA Building our App as a SPA

  • واکشی داده ها در SPA Fetching Data in the SPA

  • ساخت برنامه ما به عنوان یک وب سایت ثابت Building our App as a Static Website

  • بهبود فرآیند تولید Improving the Generate Process

  • محدود کردن تعداد درخواست‌های http Limiting the Amount of http Requests

  • تنظیم فروشگاه Adjusting the Store

  • استقرار SPA و صفحات وب استاتیک Deploying SPAs and Static Webpages

  • منابع و لینک های مفید Useful Resources & Links

ساخت اپلیکیشن Nuxt Building a Nuxt App

  • معرفی ماژول Module Introduction

  • یونیورسال در مقابل SPA در مقابل استاتیک Universal vs SPA vs Static

  • ساخت برنامه ما به عنوان یک برنامه جهانی Building our App as a Universal App

  • استقرار یک برنامه جهانی Deploying a Universal App

  • ساخت برنامه ما به عنوان یک SPA Building our App as a SPA

  • واکشی داده ها در SPA Fetching Data in the SPA

  • ساخت برنامه ما به عنوان یک وب سایت ثابت Building our App as a Static Website

  • بهبود فرآیند تولید Improving the Generate Process

  • محدود کردن تعداد درخواست‌های http Limiting the Amount of http Requests

  • تنظیم فروشگاه Adjusting the Store

  • استقرار SPA و صفحات وب استاتیک Deploying SPAs and Static Webpages

  • منابع و لینک های مفید Useful Resources & Links

گرد کردن Round Up

  • خلاصه دوره Course Roundup

  • امتیاز: محتوای بیشتر! Bonus: More Content!

گرد کردن Round Up

  • خلاصه دوره Course Roundup

  • امتیاز: محتوای بیشتر! Bonus: More Content!

نمایش نظرات

آموزش Nuxt.js 2 - Vue.js در استروئیدها
جزییات دوره
6.5 hours
107
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
32,436
4.4 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Maximilian Schwarzmüller Maximilian Schwarzmüller

دارای گواهینامه AWS، توسعه دهنده وب و مدرس حرفه ای

Academind by Maximilian Schwarzmüller Academind by Maximilian Schwarzmüller

آموزش آنلاین