آموزش دوره پیشرفته React و توسعه Full Stack - آخرین آپدیت

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

سیستم مدیریت محتوای Strapi Headless برای محتوا – توسعه پروژه Friendly Dev Strapi Headless CMS for Content – Extending Friendly Dev Project

• توضیح Headless CMS Headless CMS Explained

• ساختار پوشه‌بندی فول استک Full Stack Folder Structure

• ایجاد پروژه Strapi Create Strapi Project

• راه‌اندازی پایگاه داده و پنل مدیریت Strapi Database & Strapi Admin Setup

• نوع محتوای پروژه (Project Content Type) Project Content Type

• دسترسی به API Accessing The API

• دریافت پروژه‌ها از Strapi Fetch Projects From Strapi

• نوع پروژه در Strapi Strapi Project Type

• دریافت جزئیات هر پروژه از Strapi Fetch Individual Project From Strapi

• پروژه‌های ویژه صفحه اصلی Home Featured Projects

• نوع محتوای پست (Post Content Type) Post Content Type

• دریافت پست‌ها از Strapi Fetch Posts From Strapi

• دریافت جزئیات پست از Strapi Fetch Post Details From Strapi

• نمایش پست‌های صفحه اصلی از Strapi Homepage Posts From Strapi

تصاویر Cloudinary، فرم تماس و استقرار فول استک Cloudinary Images, Contact Form & Full Stack Deployment

• آپلود تصاویر در Cloudinary Upload Images To Cloudinary

• ساخت فرم تماس با Formspree.io Formspree.io Contact Form

• استقرار Strapi روی Render.com Deploy Strapi To Render.com

• استقرار فرانت‌اند روی Vercel Frontend Vercel Deployment

پروژه GitHub Finder با TanStack Query TanStack Query – GitHub Finder Project

• مقدمه بخش و معرفی پروژه Section Intro & Project Intro

• TanStack Query چیست؟ What Is TanStack Query?

• راه‌اندازی پروژه و Query Client Project Setup & Query Client

• یکپارچه‌سازی با API گیت‌هاب GitHub API Integration

• اجرای کوئری‌ها با هوک useQuery Making Queries With useQuery Hook

• بهینه‌سازی و پاک‌سازی کد Clean Up Code

• نصب React Query Devtools React Query Devtools Install

• قابلیت جستجوهای اخیر Recent Searches Feature

• بحث در مورد مدیریت وضعیت (State) Let's Chat About State

• پیش‌خوانی داده‌ها (Prefetching) با TanStack Query Prefetching Data With TanStack Query

• ذخیره کاربران اخیر در Local Storage Save Recent Users To Local Storage

• نمایش پیشنهادات کاربر Show User Suggestions

• کامپوننت دراپ‌داون پیشنهادات Suggestions Dropdown Component

• توکن API و اطلاعات مهم امنیتی API Token & Important Security Information

• بررسی وضعیت فالو بودن کاربر Check If User Is Following

• عملیات Mutation – فالو کردن کاربر Mutations – Follow User

• عملیات Mutation – آنفالو کردن کاربر Mutations – Unfollow User

• اعلان‌های Toast Toast Notifications

پروژه IdeaDrop با TanStack Router TanStack Router – IdeaDrop Project

• مقدمه بخش و پروژه Section & Project Intro

• آشنایی با TanStack Router Intro To TanStack Router

• راه‌اندازی پروژه Project Setup

• ایجاد مسیرها (Routes) Creating Routes

• مدیریت Head و Meta Head & Meta

• استفاده از Mock REST API Mock REST API

• دریافت داده‌ها با Loaderهای TanStack Router Fetch Data With TanStack Router Loaders

• پراکسی Vite و رفع خطاهای پیکربندی Vite Proxy & Fix Config Errors

• راه‌اندازی TanStack Query و QueryClient TanStack Query & QueryClient Setup

• استفاده از TanStack Query برای دریافت ایده‌ها Use TanStack Query To Fetch Idea

• نصب و استفاده از Axios Install & Use Axios

• دریافت و نمایش ایده‌ها Fetch & Display Ideas

• طراحی هدر و لایوت اصلی Header & Main Layout

• صفحه Not Found Not Found Page

• چالش صفحه اصلی Homepage Challenge

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

• فرم ایجاد ایده Create Idea Form

• عملیات Mutation برای ایجاد ایده Create Idea Mutation

• حذف ایده‌ها Delete Ideas

• فرم ویرایش ایده Idea Edit Form

• عملیات Mutation برای به‌روزرسانی ایده Update Idea Mutation

پشته MERN – بک‌اند Express API و پایگاه داده MongoDB MERN Stack – Backend Express API & MongoDB Database

• مقدمه بخش Section Intro

• پشته MERN چیست؟ What Is The MERN Stack?

• مقایسه Monorepo و مخازن مجزا Monorepo vs Separate Repos

• راه‌اندازی اولیه سرور Express Basic Express Server Setup

• ایجاد نقاط اتصال سرور (Endpoints) Creating Server Endpoints

• مدیریت فایل‌های مسیریابی (Route Files) Route Files

• ساخت مدیریت خطای سفارشی (Custom Error Handler) Custom Error Handler

• راه‌اندازی MongoDB Atlas (پایگاه داده ابری) MongoDB Atlas Setup (Cloud Database)

• راه‌اندازی MongoDB Compass و وارد کردن داده‌ها MongoDB Compass Setup & Data Import

• اتصال به پایگاه داده با استفاده از Mongoose Connect To Database Using Mongoose

• مدل‌سازی و دریافت ایده‌ها Model & Fetch Ideas

• ایجاد ایده جدید Create New Idea

• حذف و به‌روزرسانی ایده‌ها Delete & Update Ideas

• یکپارچه‌سازی فرانت‌اند و بک‌اند Integrating The Frontend & Backend

• محدود کردن و مرتب‌سازی در سطح API Limit & Sort At API Level

احراز هویت API با JWT و Refresh Tokenها API Authentication With JWT & Refresh Tokens

• JWT چیست؟ What Are JWTs?

• توضیح استراتژی Access و Refresh Token Access & Refresh Token Strategy Explained

• مدل کاربر و هش کردن رمز عبور User Model & Password Hashing

• نقطه اتصال ثبت‌نام کاربر User Register Endpoint

• تولید Access و Refresh Tokenها Generate Access & Refresh Tokens

• نقطه اتصال خروج و پاک‌سازی کوکی Logout Endpoint & Clear Cookie

• نقطه اتصال ورود Login Endpoint

• استفاده از Refresh Token Use Refresh Token

• محافظت از مسیرها (Protecting Routes) Protecting Routes

• احراز صلاحیت کاربر و کنترل دسترسی User Authorization & Access Control

احراز هویت فول استک Full Stack Authentication

• توضیح جریان احراز هویت فول استک Full Stack Auth Flow Explained

• صفحات و لایوت احراز هویت Auth Pages & Layout

• ایجاد Auth Context Auth Context

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

• ورود کاربر Login User

• لینک‌های ناوبری شرطی Conditional Nav Links

• خروج کاربر Logout User

• بروزرسانی توکن هنگام رفرش صفحه Refresh Token On Page Refresh

• ارسال توکن در درخواست‌ها با Axios Interceptor Send Token With Request Using Axios Interceptor

• بروزرسانی توکن پس از انقضا Refresh Token When It Expires

• مخفی‌سازی کنترل‌ها Hide Controls

استقرار اپلیکیشن MERN MERN App Deployment

• آماده‌سازی برای استقرار Prepare For Deployment

• استقرار API بک‌اند Backend API Deployment

• استقرار فرانت‌اند Frontend Deployment