آموزش تجارت الکترونیک MERN از ابتدا

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

معرفی Introduction

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

• نسخه ی نمایشی پروژه ProShop ProShop Project Demo

• منابع و محیط زیست Resources & Environment

شروع فرانت اند Starting The Front End

• React Setup و Git Initialize React Setup & Git Initialize

• React-Bootstrap Setup، Header & Footer Components React-Bootstrap Setup, Header & Footer Components

• فهرست محصولات صفحه اصلی HomeScreen Product Listing

• جزء رتبه بندی Rating Component

• نکته در مورد روتر React Note on React Router

• پیاده سازی React Router Implementing React Router

• صفحه نمایش جزئیات محصول Product Details Screen

ارائه و واکشی داده ها از Express Serving & Fetching Data From Express

• Front End/Back End گردش کار و توضیح Front End / Back End Workflow & Explanation

• ارائه محصولات - مسیرهای برگشتی Serving Products - Back End Routes

• واکشی محصولات از React (useEffect) Fetching Products From React (useEffect)

• Nodemon & Concurrently Setup Nodemon & Concurrently Setup

• متغیرهای محیطی Environment Variables

• ماژول های ES در Node.js ES Modules In Node.js

شروع کار با MongoDB Getting Started With MongoDB

• تنظیم MongoDB Atlas & Compass MongoDB Atlas & Compass Setup

• اتصال به پایگاه داده Connecting To The Database

• افزودن رنگ به کنسول (اختیاری) Adding Colors To The Console (Optional)

• مدل سازی داده های ما Modeling Our Data

• آماده سازی داده های نمونه Preparing Sample Data

• اسکریپت Seeder Data Data Seeder Script

• واکشی محصولات از پایگاه داده Fetching Products From The Database

• شروع کار با پستچی Getting Started With Postman

• مدیریت خطای سفارشی Custom Error Handling

اجرای Redux برای مدیریت دولتی Implementing Redux For State Management

• مروری بر Redux An Overview Of Redux

• یک فروشگاه Redux ایجاد کنید Create a Redux Store

• فهرست محصولات کاهش دهنده و اقدام Product List Reducer & Action

• آوردن Redux State به HomeScreen - useDispatch & useSelector Bringing Redux State Into HomeScreen - useDispatch & useSelector

• اجزای پیام و لودر Message & Loader Components

• کاهش دهنده و اقدام جزئیات محصول Product Details Reducer & Action

اضافه کردن سبد خرید Adding The Shopping Cart

• تعداد دکمه انتخاب و افزودن به سبد خرید Qty Select & Add To Cart Button

• Cart Reducer & Add to Cart action Cart Reducer & Add To Cart Action

• قابلیت افزودن به سبد خرید Add To Cart Functionality

• صفحه نمایش سبد خرید Cart Screen

• حذف موارد از سبد خرید Remove Items From Cart

احراز هویت کاربر نهایی Back End User Authentication

• با استفاده از کنترلرها پاکسازی کنید Clean Up By Using Controllers

• نقطه پایانی احراز هویت کاربر User Authentication Endpoint

• توضیح مختصری درباره JWT (JSON Web Tokens) Brief Explanation of JWT (JSON Web Tokens)

• یک توکن وب JSON ایجاد کنید Generate a JSON Web Token

• میان افزار احراز هویت سفارشی Custom Authentication Middleware

• ذخیره رمز در پستچی Saving The Token In Postman

• ثبت نام کاربر و رمزگذاری رمز عبور User Registration & Password Encryption

احراز هویت و نمایه کاربر جلویی Front End User Authentication & Profile

• کاهش دهنده ورود کاربر و اقدام User Login Reducer & Action

• صفحه ورود کاربر و عملکرد User Login Screen & Functionality

• نمایش کاربر در نوار ناوبری و خروج Show User In Navbar & Logout

• کاهش دهنده، اکشن و صفحه ثبت نام کاربر User Register Reducer, Action & Screen

• نقطه پایانی نمایه را به روز کنید Update Profile Endpoint

• صفحه نمایه و دریافت جزئیات کاربر Profile Screen & Get User Details

• به روز رسانی پروفایل کاربری Update User Profile

• اشکال نام نوار ناوبری Navbar Name Bug

فرآیند پرداخت - قسمت 1 Checkout Process - Part 1

• صفحه نمایش حمل و نقل و آدرس ذخیره Shipping Screen & Save Address

• کامپوننت مراحل پرداخت Checkout Steps Component

• صفحه پرداخت و روش پرداخت ذخیره Payment Screen & Save Payment Method

• صفحه نمایش سفارش Place Order Screen

• کنترل کننده سفارش و مسیر Order Controller & Route

• ایجاد سفارش Create Order

فرآیند پرداخت - قسمت 2 Checkout Process - Part 2

• دریافت سفارش توسط ID Endpoint Get Order by ID Endpoint

• جزئیات سفارش کاهش دهنده و اقدام Order Details Reducer & Action

• صفحه سفارش Order Screen

• برای سفارش چک اضافه کنید Add check for order

• به روز رسانی به نقطه پایانی پولی Update To Paid Endpoint

• سفارش کاهش پرداخت و اقدام Order Pay Reducer & Action

• افزودن پرداخت های پی پال Adding PayPal Payments

• نمایش سفارشات در نمایه Show Orders On Profile

• بازنشانی جزئیات و سفارشات کاربر User Details & Orders Reset

صفحه های مدیریت - قسمت 1 Admin Screens - Part 1

• Admin Middleware & Get Users Endpoint Admin Middleware & Get Users Endpoint

• لیست کاربران ادمین Admin User List

• امنیت دسترسی به صفحه مدیریت Admin Screen Access Security

• حذف کاربر ادمین Admin User Delete

• دریافت کاربر با شناسه و به‌روزرسانی نقاط پایانی کاربر Get User By ID & Update User Endpoints

• کاربر صفحه را ویرایش کنید و جزئیات کاربر را دریافت کنید User Edit Screen & Get User Details

• به روز رسانی عملکرد کاربر Update User Functionality

صفحه های مدیریت - قسمت 2 Admin Screens - Part 2

• لیست محصولات مدیریت Admin Product List

• ادمین حذف محصولات Admin Delete Products

• ایجاد و به‌روزرسانی نقاط پایانی محصول Create & Update Product Endpoints

• مدیر ایجاد محصول Admin Create Product

• ویرایش صفحه نمایش محصول Edit Product Screen

• محصول به روز رسانی مدیر Admin Update Product

• پیکربندی و نقطه پایانی آپلود تصویر Image Upload Config & Endpoint

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

• لیست سفارش ادمین Admin Order List

• علامت گذاری سفارش به عنوان تحویل Mark Order As Delivered

بررسی محصول، جستجو و موارد دیگر Product Reviews, Search & More

• Morgan & Create Review Endpoint Morgan & Create Review Endpoint

• نظرات محصول Front End Front End Product Reviews

• جستجوی محصول Product Search

• صفحه بندی محصول Product Pagination

• چرخ فلک محصولات برتر Top Products Carousel

• عنوان صفحه سفارشی و متا Custom Page Titles & Meta

استقرار برنامه App Deployment

• آماده شدن برای استقرار Prepare For Deployment

• اعزام به Heroku Deploy To Heroku

رفع اشکال Bug Fixes

• رفع اشکال: نام نوار نوار را به روز کنید Bug Fix: Update Navbar Name