آموزش ساختن یک وب سایت تجارت الکترونیکی تمام پشته

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

مقدمه Introduction

• مقدمه Introduction

• نمای کلی داشبورد مدیر Admin Dashboard Overview

• تنظیم پروژه Project Setup

• CSS Tailwind را نصب کنید Install Tailwind CSS

• پروژه خود را سفارشی کنید Customize your project

• تنظیم REACT ROUTER DOM Setup React Router Dom

• یک مؤلفه NAVBAR ایجاد کنید Create a Navbar Component

• آزمون مسابقه سریع Quick Quiz Test

صفحه اصلی Home Page

• بخش پرچم قهرمان Hero Banner section

• دسته های خانگی Home Categories

• بخش دوم قهرمان Second Hero Section

• محصولات گرایش Trending Products

• بخش معاملات Deals Section

• بنر تبلیغاتی Promotional Banner

• بخش وبلاگ های خانگی Home Blogs Section

• قسمت Footer Section

صفحه خرید ، عملکرد سبد خرید ، دسته ها و ویژگی های جستجو Shop Page, Cart Functionality, Categories, and Search Features

• صفحه رده Category Page

• عملکرد صفحه جستجو Search Page Functionality

• صفحه مغازه Shop Page

• صفحه یک محصول Single Product page

• ابزار Redux را نصب کنید و برش چرخ دستی ایجاد کنید Install Redux Toolkit and Create Cart Slice

• نشان دادن مدال سبد خرید Show Cart Modal

• خلاصه سفارش Order Summary

• کمیت را به روز کنید ، از سبد خرید حذف کنید ، عملکرد سبد را پاک کنید Update Quantity, Remove From Cart, Clear Cart functionality

راه اندازی ، ورود به سیستم و ثبت نام (احراز هویت با استفاده از JWT) Backend Setup, Login and Register (Authentication using JWT)

• ایجاد صفحه ورود به سیستم Create Login Page

• صفحه ثبت نام Register Page

• Setup Basic Express Server JS Setup Basic Express Js Server

• MongoDB و Mongoose را نصب کنید Install Mongodb and Mongoose

• بسته های Dotenv ، Cors ، Cookie Parser و Body را نصب کنید Install dotenv, cors, cookie parser and body parser packages

• یک طرح و مدل کاربر ایجاد کنید Create a User Schema and Model

• مسیرهای کاربر را ایجاد کنید Create User Routes

• چگونه رمز عبور How to hash password

• مسیرهای ورود به سیستم را ایجاد کنید Create Login Routes

• توکن JWT (Json Web Token) تولید کنید Generate JWT (JSON Web Token) token

• میانی نرم افزار را تأیید کنید Verify Token Middleware

• ورود به سیستم ، حذف کاربر و دریافت همه مسیرهای کاربران Logout, Delete User and Get all Users Routes

• نقش کاربر را به روز کنید Update User Role

• مشخصات کاربر را به روز کنید Update User Profile

• authapi با استفاده از پرس و جو rtk authApi using RTK Query

• Authslice برای ورود به سیستم در کاربر authSlice for Logged in user

• ورود ، حذف ، به روزرسانی نقش و پروفایل Logout, Delete, Update Role and Profile auth

• منوهای کشویی Navbar Navbar Dropdown Menus

محصولات و مسیرهای مرور Products and Review Routes

• طرح و مدل محصول را ایجاد کنید Create Product Schema and Model

• بررسی shcema و مدل ایجاد کنید Create Reviews Shcema and Model

• یک مسیر محصول ایجاد کنید Create a Product route

• تمام مسیرهای محصولات را دریافت کنید Get all Products routes

• یک محصول واحد را با مسیرهای شناسه دریافت کنید Get a Single Product by Id routes

• مسیر به روزرسانی ، حذف و محصولات مرتبط Update, Delete and Related Products route

• میانی Admin را تأیید کنید Verify Admin middleware

• با استفاده از پرس و جو RTK API محصول ایجاد کنید Create Product Api using RTK Query

• صفحه فروشگاه را به روز کنید و صفحه بندی را نشان دهید Update Shop Page and Show Pagination

• جزئیات محصول واحد را نشان دهید Show Single Product Details

• یک مسیرهای بررسی پست ایجاد کنید Create a Post Review Routes

• کل بررسی ها توسط شناسه کاربر بررسی می شود و بررسی می شود Total Reviews count and Get Reviews by User id

• با استفاده از پرس و جو RTK ، ReviewAPI را ایجاد کنید Create ReviewApi using RTK Query

• نمایش بررسی در صفحه جزئیات محصول Show reviews on Product Details Page

• یک بررسی جدید ارسال کنید Post A New Review

سفارشات و ادغام دروازه پرداخت در وب سایت خود Orders and Integrate Payment Gateway into Your Website

• طرح و مدل سفارش ایجاد کنید Create Order Schema and Model

• یک جلسه پرداخت راه راه ایجاد کنید Create a Stripe Checkout Session

• ایجاد راه راه را تأیید کنید مسیر پرداخت Create Stripe Confirm Payment route

• با استفاده از کارت راه راه پرداخت کنید Make a payment using Stripe card

• صفحه موفقیت پرداخت Payment Success page

• سفارشات دریافت کنید ، مسیر سفارشات را به روز کنید و حذف کنید Get orders, update and delete orders route

• آمار داشبورد کاربر User Dashboard Stats

• آمار داشبورد مدیر Admin Dashboard Stats

داشبورد کاربر User Dashboard

• مسیرهای داشبورد تنظیم Setup Dashboard Routes

• مسیر خصوصی ایجاد کنید Create Private Route

• طرح داشبورد Dashboard Layout

• داشبورد کاربر User Dashboard

• داشبورد سرپرست Admin Dashboard

• API Stats با استفاده از پرس و جو RTK Stats Api using RTK Query

• اصلی داشبورد کاربر User Dashboard Main

• سفارشات کاربر User Orders

• سیستم ردیابی سفارش Order Tracking System

• صفحه پرداخت کاربر User Payement page

• بخش بررسی کاربر User Reviews section

• نحوه به روزرسانی نمایه کاربر How to Update User profile

داشبورد سرپرست Admin Dashboard

• طراحی داشبورد مدیر Admin Dashboard Design

• نمودارهای پای و خط برای ارائه داده ها Pie and Line Charts to Present data

• طراحی صفحه محصول را اضافه کنید Add Product Page Design

• تصویر را با استفاده از Cloudinary بارگذاری کرده و یک محصول جدید ارسال کنید Upload Image using Cloudinary and Post a New Product

• محصولات را مدیریت یا حذف کنید Manage or Delete Products

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

• مدیریت نقش کاربر User Role Management

• مدیریت سفارش Order Management

نحوه استقرار این پروژه How to Deploy this Project

• کد منبع و چرا استفاده از آن Source Code and Why to Use

• چگونه پروژه خود را در Vercel مستقر کنیم How to Deploy Your Project on Vercel

• آزمون نهایی Final Test