آموزش دوره سمت سرور با NEXT.JS و REACT 19 - آخرین آپدیت

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

مقدمه Introduction

• مقدمه Introduction

• نصب NODE JS Installing NODE JS

• نصب Node JS Installing Node JS

• IDE IDE

• ریپازیتوری‌ها و سورس کد Repositories and Source code

• بررسی اجمالی پروژه Project overviews

• بعدی چیه ؟ What is Next ?

• نکست جی‌اس (Next JS) چیست؟ What is Next JS ?

مبانی Basics

• ایجاد یک پروژه جدید Creating a new project

• مسیرهای ایستا و تو در تو Static and nested routes

• مسیرهای پویا Dynamic routes

• همه را بگیر Catch all

• جهت یابی Navigation

• اجزاء Components

• سبک ها Styles

• The Head Comp The Head comp

• سند The _document

• فایل های استاتیک Static files

مبانی The basics

• ایجاد یک اپ Creating an App

• نحوه کارکرد روت‌ها How Routes work

• روت‌های استاتیک Static Routes

• روت‌های تودرتو Nested Routes

• روت‌های داینامیک Dynamic Routes

• پارامز (Params) و سرچ پارامز (SearchParams) Params and SearchParams

• سگمنت‌های "Catch All" Catch All segments

• لی‌اوت‌ها (Layouts) Layouts

• لینک‌دهی و ناوبری Linking and Navigation

• کامپوننت‌های استاندارد Standard Components

• استایل‌ها و ماژول‌ها Styles and Modules

• روت‌های موازی Parallel Routes

• گروه‌های روت Route Groups

پیش رندر Pre-Rendering

• معرفی Introduction

• تولید استاتیک Static generation

• لوازم ثابت را دریافت کنید Get static props

• ISR ISR

• یافت نشد و تغییر مسیر دهید Not found and Redirect

• مسیرهای ثابت را دریافت کنید Get static paths

• لوازم جانبی سرور را دریافت کنید Get server side props

• واکشی سمت مشتری Client side fetching

رندرینگ – کامپوننت‌های سرور و کلاینت Rendering - Server & Client components

• مقدمه Introduction

• بازخوانی SSR SSR Refresher

• راه‌اندازی JSON Server Setting up JSON Server

• واکشی کارمندان Fetching Employees

• چرا نمی‌توانم از هوک‌ها (Hooks) استفاده کنم؟ Why can't I use Hooks ?

• سرور در مقابل کلاینت Server vs Client

• مقدمه‌ای بر فرم‌های سرور Introduction to server forms

• فرم سرور – بدون JS Server form - No JS

• هوک useActionState useActionState hook

• Loading UI Loading UI

• گرفتن کارمند بر اساس ID Getting employee by ID

• Error UI Error UI

• Not Found UI Not Found UI

• صفحه ویرایش کارمند Edit Employee page

• فرم‌ها با Formik و Yup Forms with Formik and Yup

• ویرایش اکشن کارمند بخش یک Edit employee action part one

• ویرایش اکشن کارمند بخش دو Edit employee action part two

• حذف کارمندان Deleting employees

• استریمینگ Streaming

پروژه تمرین: هوکوسای Practice project: Hokusai

• نصب و راه اندازی Installation

• چیدمان اصلی Main Layout

• چرخ فلک Carousel

• کارت های خانه Home cards

• مقالات Articles

• بیو پیج Bio page

کشینگ Next JS Next JS Caching

• بیلد و استارت Build and Start

• داینامیک یا استاتیک Dynamic or Static

• گزینه‌های کانفیگ سگمنت Segment config options

• Revalidate Path Revalidate Path

• استفاده از گزینه‌های Fetch Using Fetch options

• هدرها و کوکی‌ها Headers and Cookies

• Generate static Params Generate static Params

API API

• معرفی Introduction

• ایجاد یک مسیر API Creating an API route

• ایجاد یک درخواست POST Making a POST request

• مسیرهای پویا API Dynamic API routes

• اتصال به Mongo DB Connecting to Mongo DB

• در مورد Mongoose چه خبر؟ What about Mongoose

• با استفاده از زمینه Using the context

• با استفاده از Redux Using Redux

کار با API Routes Working with API Routes

• مقدمه Introduction

• ایجاد یک API Route Creating an API Route

• مبانی Endpoint Endpoint Basics

• GET کارمندان GET Employees

• POST کارمندان POST Employees

• PATCH کارمندان PATCH Employees

• DELETE کارمندان DELETE Employees

استقرار Deploying

• معرفی Introduction

• چک کردن سر Checking Head

• فایل کانفیگ The config file

• ساختمان Building

• در حال استقرار در Vercel Deploying to Vercel

اضافات و امکانات Next JS NEXT JS Extras & Goodies

• مقدمه Introduction

• Tailwind چیست؟ What is Tailwind ?

• نصب Sass Installing Sass

• معرفی NEXT UI NEXT UI Introduction

• NEXT UI nav (تمرین) NEXT UI nav ( practice )

• Import Alias Import Alias

• کامپوننت Image Image Component

دانشگاه AUTH AUTH

• ایجاد فرم Creating the Form

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

• هش رمز عبور Hashing password

• اعتبار سنجی Validation

• کاربران منحصر به فرد Unique Users

• ورود کاربران Sign in users

• بررسی جلسه و خروج Check session and logout

• نگهبان مسیر Route guard

• امنیت API API Securiity

احراز هویت Authentication

• مقدمه Introduction

• ایجاد یک Nav Creating a Nav

• فونت‌های سفارشی Custom Fonts

• فایل Auth Config Auth Config File

• Auth Secret The Auth Secret

• Auth Middleware Auth Middleware

• Use Server Session Use Server Session

• Client Server Session Client Server Session

• GitHub Sign In GitHub Sign In

• فرم ثبت نام سفارشی بخش یک Custom register form part one

• فرم ثبت نام سفارشی بخش دو Custom register form part two

• ایجاد یک Mongo DB Cluster Creating a Mongo DB Cluster

• DB Config DB Config

• مسیر Register The Register Route

• Register Users Register Users

• Sign in User Sign in User

• Sign out User Sign out User

پروژه تمرین: SmellyCat Practice Project: SmellyCat

• نصب و راه اندازی Installation

• سر و پا Head and Footer

• برجسته و طرح را نشان می دهد Featured and shows layout

• طرح بندی خبرنامه Newsletter layout

• ایجاد علامت در فرم Creating the sign in form

• افزودن Redux Adding Redux

• مدل کاربر The user Model

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

• اطلاعات کاربر در فروشگاه User data on the store

• جلسه بعدی تاییدیه Next-Auth session

• اطلاعیه ها قسمت 1 Notifications part 1

• اطلاعیه ها قسمت 2 Notifications part 2

• ورود کاربران 1 Sign in Users 1

• ورود کاربران 2 Sign in Users 2

• ورود خودکار Auto sign in

• خروج از سیستم و هدر Sign out and header

• چیدمان نگهبان و مدیر Guard and admin layout

• فرم نمایش ایجاد کنید The create show form

• مدل نشان می دهد و API The shows model and API

• نقش ها و ارسال را بررسی کنید Check roles and posting

• اعتبار سنجی سرور اضافی Extra server validation

• آپلود تصویر قسمت 1 Uploading image part 1

• آپلود تصویر قسمت 2 Uploading image part 2

• پاک کردن تصویر با Refs Clearing image with Refs

• داده‌های نمایش‌های مدیریت را نشان می‌دهد Shows data for admin shows

• مدیر جدول صفحه را نشان می دهد Admin shows Pag table

• صفحه بندی مدیریت را تمام کنید Finish admin pagination

• قسمت 1 معین را حذف کنید Remove modal part 1

• قسمت 2 معین را حذف کنید Remove modal part 2

• ویرایش قسمت 1 نمایش Edit show part 1

• ویرایش قسمت 2 نمایش Edit show part 2

• نمایش های خانگی Home shows

• مسیر را نشان می دهد Shows route

• بارگذاری بیشتر Load more

• صفحه را نشان می دهد Shows page

• آخرین نمایش ها Latest shows

• خبرنامه Newsletter

• فرم تماس Contact form

• ارسال ایمیل Sending emails

• به روز رسانی قسمت 1 کاربر Update user part 1

• به روز رسانی قسمت 2 کاربر Update user part 2

Event0 - اپ تمرینی Event0 - Practice App

• اضافه کردن لینک‌ها به Nav Adding links to the Nav

• مدل Venue The Venue Model

• فرم Add Venue Add Venue Form

• Posting Venues Posting Venues

• اعتبارسنجی Venue Schema Venue Schema validation

• Add Venue handling errors Add Venue handling errors

• مدل و صفحه Event Event Model and Page

• فرم Add Event Add Event form

• Add Event datepicker Add Event datepicker

• Posting Events Posting Events

• نمایش toasts Displaying toasts

• Getting Home Events Getting Home Events

• Home Event Cards part one Home Event Cards part one

• Home Event Cards part two Home Event Cards part two

• Home Load More Home Load More

• صفحه Event by Slug The Event by Slug page

• Event Card Event Card

• دیپلوی Deployment

مقدمه [Legacy React 17 Next 10] Introduction [Legacy React 17 Next 10 ]

• معرفی Introduction

• از چه IDE باید استفاده کنید What IDE should you use

• نصب Node JS Node JS installation

• نحوه دریافت کد هر بخش How to get the code of each section

روتینگ [Legacy NEXT 14] Routing [ Legacy NEXT 14 ]

• نکست جی‌اس (Next JS) چیست؟ What is Next JS ?

• نصب یک اپ NEXT Installing a NEXT App

• نحوه کارکرد روت‌ها How Routes Work

• ایجاد یک روت ساده Creating a simple route

• روت‌های تودرتو Nested routes

• روت‌های داینامیک Dynamic Routes

• پارامز (Params) و سرچ پارامز (SearchParams) Params and SearchParams

• Catch ALL Catch ALL

• لی‌اوت‌ها (Layouts) Layouts

• ناوبری Navigation

• کد استاندارد React Standard React code

• استایل‌ها Styles

• روت‌های موازی Parallel Routes

• گروه‌های روت Route Groups

اصول [Legacy React 17 Next 10] The Basics [Legacy React 17 Next 10 ]

• NEXT js چیست What is NEXT js

• نحوه کار مسیرها و ایجاد یک پروژه How routes work and creating a project

• مسیرهای استاتیک و مسیرهای تودرتو Static routes and Nested routes

• مسیرهای پویا Dynamic routes

• همه مسیرها را بگیرید Catch all routes

• جهت یابی Navigation

• اجزاء یا غیر اجزاء Components or not components

• سبک ها Styles

• متا تگ ها و Head Meta tags and Head

• سند The document

• تصاویر و فایل های ثابت Images and static files

سرور و کلاینت [Legacy NEXT 14] Server and Client [ Legacy NEXT 14 ]

• ایجاد یک تمپلیت کوچک Creating a tiny template

• هدر و لینک‌ها Header and links

• استراتژی‌ها Strategies

• JSON Server JSON Server

• نمایش کارمندان Showing employees

• استفاده از هوک‌ها (Hooks) Using Hooks

• توضیحات بیشتر در مورد سرور و کلاینت More on Server and Client

• فایل سرور اکشن Server action file

• Posting کارمندان Posting employees

• بازسازی به فایل اکشن Re-Factor to actions file

• UseFormState UseFormState

• UseFormState بخش 2 UseFormState part 2

• کارمند بر اساس ID Employee by ID

• Loading UI Loading UI

• Error UI Error UI

• Not found UI Not found UI

• کامپوننت Edit user Server Edit user Server component

• اعتبارسنجی سمت کلاینت Client side validation

• Edit server action Edit server action

• Edit server action part 2 Edit server action part 2

• حذف کارمندان Deleting employees

PRE-Rendering [Legacy React 17 Next 10] PRE-Rendering [Legacy React 17 Next 10 ]

• معرفی Introduction

• تولید استاتیک Static generation

• لوازم ثابت را دریافت کنید Get static props

• بازسازی استاتیکی افزایشی (ISR) Incremental static regeneration ( ISR )

• یافت نشد و تغییر مسیر داد Not found and Redirects

• مسیر ایستا را دریافت کنید Get static path

• لوازم جانبی سرور را دریافت کنید Get server side props

• واکشی سمت مشتری Client side fetching

کشینگ [Legacy NEXT 14] Caching [ Legacy NEXT 14 ]

• بیلد و استارت Build and start

• داینامیک یا استاتیک؟ Dynamic or Static ?

• گزینه‌های کانفیگ سگمنت Segment config options

• Revalidating paths Revalidating paths

• گزینه‌های Fetch API Fetch API options

• هدر و کوکی‌ها Header and Cookies

• استفاده از تابع "generateStaticParams" Using the "generateStaticParams" function

پروژه اول را تمرین کنید: هوکوسای [Legacy React 17 Next 10] Practice project one: Hokusai [Legacy React 17 Next 10 ]

• تاسیسات Installations

• طرح و هدر Layout and header

• در حال بارگیری json و نوار لغزنده Loading json and slider

• کارت های خانه Home cards

• ایجاد صفحه مقاله Creating the article page

• صفحه بیو The bio page

• پایان Finish

اپ تمرینی: هوکوسائی [Legacy NEXT 14] Practice app: Hokusai [ Legacy NEXT 14 ]

• نصب Installation

• ایجاد یک Nav Creating a Nav

• Home Carousel Home Carousel

• واکشی مقالات Fetching articles

• Home articles Home articles

• مقاله بر اساس ID Article by ID

• صفحه Bio Bio page

• بیلدینگ Building

مسیرهای API [Legacy React 17 بعدی 10] API Routes [Legacy React 17 Next 10 ]

• معرفی Introduction

• ایجاد و مسیر API Creating and API route

• ایجاد یک درخواست POST Making a POST request

• مسیرهای پویا API Dynamic API routes

• اتصال به Mongo DB - قسمت اول Connecting to Mongo DB - part one

• اتصال به Mongo DB - قسمت دوم Connecting to Mongo DB - part two

• در مورد مونگوس چطور What about mongoose

• کار با زمینه واکنش Working with the react context

• کار با redux - قسمت اول Working with redux - part one

• کار با redux - قسمت دوم Working with redux - part two

دیپلویینگ [Legacy NEXT 14] Deploying [ Legacy NEXT 14 ]

• معرفی Vercel و دیپلوی ساده Intro to Vercel and simple deploy

• دیپلویینگ JSON Server Deploying JSON Server

• دیپلویینگ پروژه هوکوسائی Deploying Hokusai project

در حال استقرار [Legacy React 17 بعدی 10] Deploying [Legacy React 17 Next 10 ]

• معرفی Introduction

• بررسی موارد برای بهینه سازی Checking things to optimize

• فایل کانفیگ The config file

• ساختمان Building

• استقرار Deploying

API Routes [Legacy NEXT 14] API Routes [ Legacy NEXT 14 ]

• API routes چیست؟ What are API routes ?

• Route handlers در مقابل API Routes Route handlers VS API Routes

• Routes Handlers Routes Handlers

• Routes Handlers - Posting Routes Handlers - Posting

• Routes Handlers - Params Routes Handlers - Params

• API Router API Router

• API Router params API Router params

احراز هویت [Legacy React 17 بعدی 10] Authentication [Legacy React 17 Next 10 ]

• ایجاد علامت در فرم Creating the sign in form

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

• هش کردن پسوردها Hashing passwords

• اعتبار سنجی Validation

• کاربران تکراری Duplicated users

• فایل auth بعدی The next auth file

• جلسه بررسی Checking session

• نگهبان مسیر Route guard

• امنیت API API security

ابزارهای بیشتر NEXT [Legacy NEXT 14] More NEXT tools [ Legacy NEXT 14 ]

• شروع یک پروژه جدید Starting a new project

• Tailwind CSS Tailwind CSS

• SASS SASS

• Next UI Next UI

• Next UI navbar Next UI navbar

• Absolute import و Module aliases Absolute import and Module aliases

• کامپوننت image The image component

• Mongo DB Mongo DB

• تست Mongo DB Testing Mongo DB

• در مورد Mongoose چطور؟ What about Mongoose ?

• در مورد React Context چطور؟ What about React Context ?

• در مورد React Redux چطور؟ What about React Redux ?

پروژه دوم را تمرین کنید: گربه‌های بدبو [Legacy React 17 Next 10] Practice project two: The smelly cats [Legacy React 17 Next 10 ]

• نصب و راه اندازی Installation

• سربرگ و پاورقی Header and footer

• اتصال به redux Connecting to redux

• ویژه Featured

• صفحه اصلی طرح بندی را نشان می دهد Home shows layout

• ایجاد علامت در فرم Creating the sign in form

• تایید فرم ورود به سیستم Sign in form validation

• رفع مشکل MUI Fixing MUI issue

• اتصال به Mongo DB Connecting to Mongo DB

• ایجاد مدل کاربر Creating the user model

• ثبت نام کاربر - قسمت اول Register user - part one

• ثبت نام کاربر - قسمت دوم Register user - part two

• ورود کاربران Sign in users

• اطلاع رسانی قسمت 1 Notification part 1

• اطلاع رسانی قسمت 2 Notification part 2

• افزودن کاربر به فروشگاه Adding a user to the store

• ایجاد مسیر API کاربران Creating a users API route

• هنگام ثبت نام وارد شوید Sign in when register

• ورود خودکار Auto sign in

• کاربران را از سیستم خارج کنید Sign out users

• نگهبانان مسیر Route guards

• طرح ادمین Admin Layout

• ایجاد مدل نمایش Creating the show model

• ایجاد فرم مدل نمایش Creating the show model form

• ارسال نمایش ها به DB Posting shows to the DB

• اعتبار سنجی سرور سفارشی Custom server validation

• بررسی نقش ها Checking roles

• آپلود تصویر - قسمت اول Uploading image - part one

• آپلود تصویر - قسمت دوم Uploading image - part two

• در حال اتمام صفحه نمایش افزودن Finishing the add show page

• نصب افزونه صفحه بندی Installing the pagination plugin

• کار با صفحه بندی قسمت 1 Working with pagination part 1

• کار با صفحه بندی قسمت 2 Working with pagination part 2

• حذف پست ها Removing posts

• اتمام حذف پست ها Finishing the remove posts

• ویرایش پست ها قسمت اول Editing posts part one

• ویرایش پست ها قسمت دوم Editing posts part two

• رفع شلاق Slug fix

• دریافت خانه نشان می دهد Getting home shows

• ایجاد نمایه نمایش ها Creating the index of shows

• ایجاد API شاخص نشان می دهد Creating the API of index shows

• نمایش نمایش ها Displaying shows

• ایجاد ایمیل خبرنامه Creating the newsletter mail

• خبرنامه را تمام کنید Finish the newsletter

• ایجاد صفحه تماس Creating the contact page

• ارسال ایمیل قسمت اول Sending emails part one

• ارسال ایمیل قسمت دوم Sending emails part two

• به روز رسانی نمایه کاربر قسمت اول Updating user profile part one

• به روز رسانی نمایه کاربر قسمت دوم Updating user profile part two

• ایمیل مرحله اول قسمت اول Email stepper part one

• مرحله دوم ایمیل Email stepper part two

• ایمیل مرحله سوم قسمت سوم Email stepper part three

احراز هویت [Legacy NEXT 14] Authentication [ Legacy NEXT 14 ]

• نصب Installing

• ایجاد یک NAV Creating a NAV

• نصب FONTS Installing FONTS

• اعتبارسنجی NEXT AUTH NEXT AUTH credentials

• راز NEXT AUTH NEXT AUTH secret

• میان‌افزار NEXT AUTH NEXT AUTH middleware

• جلسه کاربر سرور User Server Session

• جلسه سرور کلاینت Client Server session

• ورود به GITHUB GITHUB sign in

• فرم ثبت‌نام Register Form

• فرم ثبت‌نام قسمت 2 Register Form part 2

• ثبت‌نام کاربران Register users

• ثبت‌نام کاربران قسمت 2 Register users part 2

• ثبت‌نام کاربران قسمت 3 Register users part 3

• رفع "Authorize" Fixing the "Authorize"

• خروج کاربران Sign Out users

دوره کوتاه واکنش نشان می دهد. React mini course.

• در حال آپلود!!! Uploading !!!

• اصول اولیه: گرفتن دیگ بخار BASICS: Getting the boilerplate

• مبانی: بسته نرم افزاری BASICS: The bundle

• مبانی: از ابتدا به بالا BASICS: From the grund up

• مبانی: پشت صحنه BASICS: Behind the scenes

• مبانی: ساختار پروژه BASICS: Project structure

• مبانی: انواع اجزاء BASICS: Types of components

• مبانی: اضافه کردن سبک BASICS: Adding some style

• مبانی: رویدادها BASICS: Events

• مبانی: ایالت BASICS: State

• مبانی: لوازم بخش اول BASICS: Props part one

• مبانی: لوازم بخش 2 BASICS: Props part 2

• مبانی: لوازم قسمت 3 BASICS: Props part 3

• مبانی: کودکان واکنش نشان دهید BASICS: React children

• مبانی: بیشتر در مورد یک ظاهر طراحی شده BASICS: More on styling

• مبانی: اخبار را فیلتر کنید BASICS: Filter the news

• مبانی: چرخه های زندگی قسمت 1 BASICS: Lifecycles part 1

• مبانی: چرخه های زندگی قسمت 2 BASICS: Lifecycles part 2

• مبانی: معرفی قلاب های React BASICS: React hooks intro

• مبانی: قلاب UseState BASICS: UseState hook

• مبانی: UseState hook قسمت 2 BASICS: UseState hook part 2

• مبانی: از افکت استفاده کنید BASICS: Use effect

• مبانی: از پاسخ به تماس استفاده کنید BASICS: Use callback

• مبانی: UserRef BASICS: UseRef

• مبانی: زمینه BASICS: Context

• مبانی: بخش زمینه 2 BASICS: Context part 2

• تمرین: نصب کنید PRACTICE: Install

• تمرین: زمینه PRACTICE: the context

• تمرین: مرجع و اعتبار PRACTICE: Ref and validation

• تمرین: اضافه کردن بازیکنان PRACTICE: Adding players

• تمرین: نشان دادن بازیکنان PRACTICE: showing players

• تمرین: بعد نان تست کنید PRACTICE: Next and toastify

• تمرين: گرفتن بازي PRACTICE: Getting the looser

• مسیرها: مقدمه ROUTES: INTRO

• مسیرها: فرآیند مسیر ROUTES: The route process

• ROUTES: فایل مسیر اصلی ROUTES: The main route file

• مسیرها: راه اندازی مسیرها ROUTES: setting up routes

• مسیرها: پیوند ROUTES: Linking

• مسیرها: چیدمان بهتر ROUTES: Better layout

• مسیرها: Params ROUTES: Params

• مسیرها: اطلاعات بیشتر در مورد روتر واکنش ROUTES: More on react router

• مسیرها: سوئیچ ROUTES: Switch

• مسیرها: تغییر مسیرها ROUTES: Redirections

• مسیرها: 404 ROUTES: 404

• مبانی 2: مقدمه BASICS 2: intro

• مبانی 2: اجزای خالص BASICS 2: Pure components

• مبانی 2: عناصر مجاور BASICS 2: Adjacent elements

• مبانی 2: بخش اول HOC BASICS 2: HOC's part one

• مبانی 2: بخش دوم HOC BASICS 2: HOC's part two

• مبانی 2: انتقال یک BASICS 2: Transitions one

• مبانی 2: انتقال دو BASICS 2: Transitions two

• مبانی 2: انتقال CSS BASICS 2: CSS transitions

• مبانی 2: گروه انتقال BASICS 2: Transitions group

• مبانی 2: تذکرات ارجمند BASICS 2: Honorable mentions

• تمرین: نصب PRACTICE: Installation

• تمرین: راه اندازی redux PRACTICE: setting up redux

• تمرین: سربرگ و طرح اصلی PRACTICE: Header and main layout

• تمرین: سرور API PRACTICE: API server

• تمرین: واکشی پست های خانه قسمت اول PRACTICE: Fetching home posts part one

• تمرین: واکشی پست های خانه قسمت دوم PRACTICE: Fetching home posts part two

• تمرین: سنگ تراشی PRACTICE: Masonry

• تمرین: ایجاد خبرنامه افزودن PRACTICE: Creating the add newsletter

• تمرین: پایان خبرنامه PRACTICE: Finishing the newsletter

• تمرین: تعمیر خبرنامه و ایجاد صفحه پست PRACTICE: Newsletter fix and creating post page

• تمرین: پاکسازی صفحه پست و 404 PRACTICE: Post page cleanup and 404

• REDUX: مقدمه REDUX: Intro

• REDUX: اتصال REDUX: Connecting

• REDUX: خالقان و کاهش دهنده های اکشن REDUX: Action creators and reducers

• REDUX: کاهنده ها را ترکیب کنید REDUX: Combine reducers

• REDUX: ایجاد یک کاهنده معتبر REDUX: Creating a valid reducer

• REDUX: ابزارهای توسعه Redux REDUX: Redux devtools

• REDUX: عملیات اعزام REDUX: Dispatching actions

• REDUX: نقشه وضعیت به غرفه ها REDUX: Map state to props

• REDUX: قلاب های Redux REDUX: Redux hooks

• REDUX: انواع REDUX: Types

• REDUX: درخواست REDUX: Making request

برنامه تمرینی: Event0 [Legacy NEXT 14] Practice app: Event0 [ Legacy NEXT 14 ]

• اضافه کردن صفحات به Nav Add pages to Nav

• اضافه کردن فرم محل Add venue form

• اضافه کردن اقدام سرور محل Add venue Server Action

• تست فرم‌های محل Testing Venues form

• اضافه کردن رویداد - فرم Add Event - Form

• اضافه کردن رویداد - انتخاب‌کننده تاریخ Add Event - Datepicker

• اضافه کردن رویداد - اقدام Add Event - Action

• ارسال رویدادها Posting events

• نمایش نان‌های تست موفقیت Showing success toasts

• دریافت رویدادهای اصلی Getting Home events

• نصب سنگ‌کاری Installing Masonry

• کارت رویداد Event Card

• کارت رویداد قسمت 2 Event Card part 2

• "remotePatterns" "remotePatterns"

• یافتن رویداد بر اساس اسلاگ Find event by slug

• نمایش اطلاعات رویداد Showing event info

• نمایش اطلاعات محل Showing venue info

• دریافت رویدادهای صفحه‌بندی شده Getting paginated events

• جدول صفحه‌بندی شده Paginated table

دوره مینی ری‌اکت. React mini course.

• آپلود!!! Uploading !!!

• مبانی: دریافت کد آماده BASICS: Getting the boilerplate

• مبانی: بسته BASICS: The bundle

• مبانی: از ابتدا BASICS: From the grund up

• مبانی: پشت صحنه BASICS: Behind the scenes

• مبانی: ساختار پروژه BASICS: Project structure

• مبانی: انواع کامپوننت ها BASICS: Types of components

• مبانی: اضافه کردن کمی استایل BASICS: Adding some style

• مبانی: رویدادها BASICS: Events

• مبانی: حالت BASICS: State

• مبانی: ویژگی ها قسمت یک BASICS: Props part one

• مبانی: ویژگی ها قسمت 2 BASICS: Props part 2

• مبانی: ویژگی ها قسمت 3 BASICS: Props part 3

• مبانی: React children BASICS: React children

• مبانی: بیشتر در مورد استایلینگ BASICS: More on styling

• مبانی: فیلتر کردن اخبار BASICS: Filter the news

• مبانی: چرخه های زندگی قسمت 1 BASICS: Lifecycles part 1

• مبانی: چرخه های زندگی قسمت 2 BASICS: Lifecycles part 2

• مبانی: معرفی React hooks BASICS: React hooks intro

• مبانی: هوک UseState BASICS: UseState hook

• مبانی: هوک UseState قسمت 2 BASICS: UseState hook part 2

• مبانی: اثر Use BASICS: Use effect

• مبانی: استفاده از CallBack BASICS: Use callback

• مبانی: UseRef BASICS: UseRef

• مبانی: زمینه BASICS: Context

• مبانی: زمینه قسمت 2 BASICS: Context part 2

• تمرین: نصب PRACTICE: Install

• تمرین: زمینه PRACTICE: the context

• تمرین: Ref و اعتبار سنجی PRACTICE: Ref and validation

• تمرین: اضافه کردن بازیکنان PRACTICE: Adding players

• تمرین: نمایش بازیکنان PRACTICE: showing players

• تمرین: Next و Toastify PRACTICE: Next and toastify

• تمرین: گرفتن بازنده PRACTICE: Getting the looser

• مسیرها: معرفی ROUTES: INTRO

• مسیرها: فرآیند مسیر ROUTES: The route process

• مسیرها: فایل اصلی مسیر ROUTES: The main route file

• مسیرها: تنظیم مسیرها ROUTES: setting up routes

• مسیرها: پیوند دادن ROUTES: Linking

• مسیرها: طرح بندی بهتر ROUTES: Better layout

• مسیرها: پارامترها ROUTES: Params

• مسیرها: اطلاعات بیشتر در مورد روتر react ROUTES: More on react router

• مسیرها: سوئیچ ROUTES: Switch

• مسیرها: تغییر مسیرها ROUTES: Redirections

• مسیرها: 404 ROUTES: 404

• مبانی 2: مقدمه BASICS 2: intro

• مبانی 2: کامپوننت های خالص BASICS 2: Pure components

• مبانی 2: عناصر مجاور BASICS 2: Adjacent elements

• مبانی 2: قسمت اول HOC BASICS 2: HOC's part one

• مبانی 2: قسمت دوم HOC BASICS 2: HOC's part two

• مبانی 2: انتقال یک BASICS 2: Transitions one

• مبانی 2: انتقال دو BASICS 2: Transitions two

• مبانی 2: انتقال های CSS BASICS 2: CSS transitions

• مبانی 2: گروه انتقال BASICS 2: Transitions group

• مبانی 2: ذکر افتخاری BASICS 2: Honorable mentions

• تمرین: نصب PRACTICE: Installation

• تمرین: راه اندازی Redux PRACTICE: setting up redux

• تمرین: هدر و طرح بندی اصلی PRACTICE: Header and main layout

• تمرین: سرور API PRACTICE: API server

• تمرین: واکشی پست های صفحه اصلی قسمت یک PRACTICE: Fetching home posts part one

• تمرین: واکشی پست های صفحه اصلی قسمت دو PRACTICE: Fetching home posts part two

• تمرین: سنگ تراشی PRACTICE: Masonry

• تمرین: ایجاد خبرنامه اضافی PRACTICE: Creating the add newsletter

• تمرین: تکمیل خبرنامه PRACTICE: Finishing the newsletter

• تمرین: رفع خبرنامه و ایجاد صفحه پست PRACTICE: Newsletter fix and creating post page

• تمرین: تمیز کردن صفحه پست و 404 PRACTICE: Post page cleanup and 404

• REDUX: معرفی REDUX: Intro

• REDUX: اتصال REDUX: Connecting

• REDUX: سازندگان اکشن و کاهنده ها REDUX: Action creators and reducers

• REDUX: ترکیب کاهنده ها REDUX: Combine reducers

• REDUX: ایجاد یک کاهنده معتبر REDUX: Creating a valid reducer

• REDUX: ابزار Redux dev REDUX: Redux devtools

• REDUX: اعزام اکشن ها REDUX: Dispatching actions

• REDUX: Map state to props REDUX: Map state to props

• REDUX: هوک های Redux REDUX: Redux hooks

• REDUX: انواع REDUX: Types

• REDUX: ایجاد درخواست REDUX: Making request