آموزش Next.js Dev to Deployment

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

معرفی Introduction

• به دوره خوش آمدید Welcome To The Course

• به دوره خوش آمدید Welcome To The Course

• Next.js چیست؟ What Is Next.js?

• بررسی اجمالی پروژه اصلی Main Project Overview

• بررسی اجمالی پروژه اصلی Main Project Overview

• محیط و ابزار Environment & Tools

• محیط و ابزار Environment & Tools

• پیوندهای مخزن کد نهایی Final Code Repo Links

معرفی Introduction

• Next.js چیست؟ What Is Next.js?

• پیوندهای مخزن کد نهایی Final Code Repo Links

Next.js Fundamentals Next.js Fundamentals

• ایجاد یک برنامه Next.js Creating a Next.js App

• ایجاد یک برنامه Next.js Creating a Next.js App

• صفحات و مسیریابی Pages & Routing

• لینک بعدی و روتر Next Link & Router

• برچسب ها و طرح بندی سر Head Tags & Layout

• سربرگ و پاورقی Header & Footer

• سربرگ و پاورقی Header & Footer

• صفحه سفارشی 404 Custom 404 Page

• صفحه سفارشی 404 Custom 404 Page

• نام مستعار ماژول با jsconfig Module Aliases With jsconfig

• کامپوننت ویترین Showcase Component

Next.js Fundamentals Next.js Fundamentals

• صفحات و مسیریابی Pages & Routing

• لینک بعدی و روتر Next Link & Router

• برچسب ها و طرح بندی سر Head Tags & Layout

• نام مستعار ماژول با jsconfig Module Aliases With jsconfig

• کامپوننت ویترین Showcase Component

واکشی داده ها Data Fetching

• مسیرهای API API Routes

• getServerSideProps و getStaticProps getServerSideProps & getStaticProps

• getServerSideProps و getStaticProps getServerSideProps & getStaticProps

• نمایش رویدادها DIsplaying Events

• getStaticPaths getStaticPaths

• صفحه رویداد واحد Single Event Page

• صفحه رویداد واحد Single Event Page

واکشی داده ها Data Fetching

• مسیرهای API API Routes

• نمایش رویدادها DIsplaying Events

• getStaticPaths getStaticPaths

Strapi Backend Strapi Backend

• راه اندازی Strapi CMS Strapi CMS Setup

• ابری برای تصاویر Cloudinary For Images

• ابری برای تصاویر Cloudinary For Images

• نوع محتوای رویداد Event Content Type

• نوع محتوای رویداد Event Content Type

Strapi Backend Strapi Backend

• راه اندازی Strapi CMS Strapi CMS Setup

عملکرد رویدادها - قسمت 1 Events Functionality - Part 1

• اتصال به Strapi API Connecting to the Strapi API

• جستجوی صفحه با استفاده از فیلترها Search Page Using Filters

• افزودن صفحه رویداد Add Event Page

• رویداد Submit & React Toastify Event Submit & React Toastify

• رویداد Submit & React Toastify Event Submit & React Toastify

• Slug ایجاد کنید Create a Slug

عملکرد رویدادها - قسمت 1 Events Functionality - Part 1

• اتصال به Strapi API Connecting to the Strapi API

• جستجوی صفحه با استفاده از فیلترها Search Page Using Filters

• کامپوننت جستجو Search Component

• افزودن صفحه رویداد Add Event Page

• Slug ایجاد کنید Create a Slug

عملکرد رویدادها - قسمت 2 Events Functionality - Part 2

• حذف رویدادها Delete Events

• ویرایش پیش نمایش رویداد و تصویر Edit Event & Image Preview

• جزء معین Modal Component

• جزء معین Modal Component

• آپلود تصویر Image Upload

• آپلود تصویر Image Upload

• صفحه بندی رویدادها Events Pagination

• صفحه بندی رویدادها Events Pagination

عملکرد رویدادها - قسمت 2 Events Functionality - Part 2

• حذف رویدادها Delete Events

• ویرایش پیش نمایش رویداد و تصویر Edit Event & Image Preview

کوکی‌های احراز هویت، JWT و HttpOnly Authentication, JWT & HttpOnly Cookies

• فرم های ثبت نام و ورود Register & Login Forms

• زمینه تأیید اعتبار Auth Context

• استراتژی JWT ما توضیح داده شد Our JWT Strategy Explained

• استراتژی JWT ما توضیح داده شد Our JWT Strategy Explained

• وارد شوید و JWT را دریافت کنید Login & Get JWT

• ذخیره JWT در سرور HttpOnly Cookie Store JWT In Server HttpOnly Cookie

• ذخیره JWT در سرور HttpOnly Cookie Store JWT In Server HttpOnly Cookie

• ادامه کاربر وارد شده Persist Logged In User

• ادامه کاربر وارد شده Persist Logged In User

• خروج و نابود کردن کوکی Logout & Destroy Cookie

• ثبت نام کاربر Register User

کوکی‌های احراز هویت، JWT و HttpOnly Authentication, JWT & HttpOnly Cookies

• فرم های ثبت نام و ورود Register & Login Forms

• زمینه تأیید اعتبار Auth Context

• وارد شوید و JWT را دریافت کنید Login & Get JWT

• خروج و نابود کردن کوکی Logout & Destroy Cookie

• ثبت نام کاربر Register User

مجوز و دسترسی Authorization & Access

• رویدادهای کاربر سفارشی نقطه پایانی Custom User Events Endpoint

• رویدادهای کاربر سفارشی نقطه پایانی Custom User Events Endpoint

• دریافت رویدادهای کاربر برای داشبورد Gettting User Events For Dashboard

• نمایش رویدادهای داشبورد Display Dashboard Events

• ایجاد خط مشی مالک است برای رویدادها Create Is Owner Policy For Events

• ایجاد خط مشی مالک است برای رویدادها Create Is Owner Policy For Events

• مرتبط کردن رویدادها با کاربران Associating Events With Users

• ویرایش، حذف و آپلود تصویر تأیید شده Authenticated Edit, Delete & Image Upload

مجوز و دسترسی Authorization & Access

• دریافت رویدادهای کاربر برای داشبورد Gettting User Events For Dashboard

• نمایش رویدادهای داشبورد Display Dashboard Events

• مرتبط کردن رویدادها با کاربران Associating Events With Users

• ویرایش، حذف و آپلود تصویر تأیید شده Authenticated Edit, Delete & Image Upload

موارد اضافی و استقرار Extras & Deployment

• نقشه را به صفحات رویداد اضافه کنید Add Map to Event Pages

• نقشه را به صفحات رویداد اضافه کنید Add Map to Event Pages

• Strapi Backend Deploy - Heroku Strapi Backend Deploy - Heroku

• Next.js Deploy - Vercel Next.js Deploy - Vercel

• Next.js Deploy - Vercel Next.js Deploy - Vercel

موارد اضافی و استقرار Extras & Deployment

• Strapi Backend Deploy - Heroku Strapi Backend Deploy - Heroku

پروژه 2 - وبلاگ DevSpace Static Markdown Project 2 - DevSpace Static Markdown Blog

• معرفی پروژه Project Intro

• مارک داون - چه و چرا؟ Markdown - What & Why?

• مارک داون - چه و چرا؟ Markdown - What & Why?

• دوره سقوط Markdown Markdown Crash Course

• دوره سقوط Markdown Markdown Crash Course

• لینک Repo پروژه Project Repo Link

• لینک Repo پروژه Project Repo Link

• راه اندازی Next.js و TailwindCSS Next.js & TailwindCSS Setup

• راه اندازی Next.js و TailwindCSS Next.js & TailwindCSS Setup

• مولفه طرح Layout Component

• مولفه طرح Layout Component

• سبک سرصفحه و دم باد Header & Tailwind Styling

• صفحه درباره و 404 About & 404 Page

پروژه 2 - وبلاگ DevSpace Static Markdown Project 2 - DevSpace Static Markdown Blog

• معرفی پروژه Project Intro

• سبک سرصفحه و دم باد Header & Tailwind Styling

• صفحه درباره و 404 About & 404 Page

واکشی، تجزیه و نمایش پست‌های نشانه‌گذاری Fetch, Parse & Display Markdown Posts

• فایل های علامت گذاری پست وبلاگ Blog Post Markdown Files

• دریافت پست ها و تجزیه و تحلیل Frontmatter Get Posts & Parse Frontmatter

• دریافت پست ها و تجزیه و تحلیل Frontmatter Get Posts & Parse Frontmatter

• نمایش پست ها Display Posts

• نمایش پست ها Display Posts

• مرتب سازی پست ها بر اساس تاریخ Sort Posts By Date

• مرتب سازی پست ها بر اساس تاریخ Sort Posts By Date

• جزء برچسب دسته Category Label Component

• ایجاد مسیرهای ثابت و داده های تک پستی Generate Static Paths & Single Post Data

• نمایش پست وبلاگ منفرد Display Single Blog Post

• نمایش پست وبلاگ منفرد Display Single Blog Post

واکشی، تجزیه و نمایش پست‌های نشانه‌گذاری Fetch, Parse & Display Markdown Posts

• فایل های علامت گذاری پست وبلاگ Blog Post Markdown Files

• جزء برچسب دسته Category Label Component

• ایجاد مسیرهای ثابت و داده های تک پستی Generate Static Paths & Single Post Data

صفحه بندی و دسته بندی صفحات Pagination & Category Pages

• شروع صفحه بندی - ایجاد مسیرها Start Pagination - Generate Paths

• واکشی پست های صفحه بندی شده Fetch Paginated Posts

• مؤلفه پیوندهای صفحه بندی Pagination Links Component

• صفحات دسته بندی Category Pages

• پاک کردن دریافت پست ها Clean Up Get Posts

• پاک کردن دریافت پست ها Clean Up Get Posts

• نوار کناری دسته Category Sidebar

• نوار کناری دسته Category Sidebar

• صادرات و محدودیت های بعدی Next Export & Limitations

• صادرات و محدودیت های بعدی Next Export & Limitations

صفحه بندی و دسته بندی صفحات Pagination & Category Pages

• شروع صفحه بندی - ایجاد مسیرها Start Pagination - Generate Paths

• واکشی پست های صفحه بندی شده Fetch Paginated Posts

• مؤلفه پیوندهای صفحه بندی Pagination Links Component

• صفحات دسته بندی Category Pages

جستجو، ذخیره پست ها و استقرار Search, Caching Posts & Deployment

• جستجو چگونه کار خواهد کرد How Search Will Work

• جستجو چگونه کار خواهد کرد How Search Will Work

• کامپوننت جستجو Search Component

• کامپوننت جستجو Search Component

• جستجوی مسیر API Search API Route

• جستجوی مسیر API Search API Route

• اجزای نتایج جستجو Search Results Components

• اجزای نتایج جستجو Search Results Components

• اولین استقرار First Deployment

• پست های کش Cache Posts

• Pre-Commit Hook With Husky Pre-Commit Hook With Husky

• Pre-Commit Hook With Husky Pre-Commit Hook With Husky

• بسته شدن Wrap Up

جستجو، ذخیره پست ها و استقرار Search, Caching Posts & Deployment

• کامپوننت جستجو Search Component

• اولین استقرار First Deployment

• پست های کش Cache Posts

• بسته شدن Wrap Up