Build a Fullstack Ecommerce Website - Django with React

Set up a Django and React e-commerce project by creating front-end and back-end folders, installing Python, Django, Django Rest Framework, and React, and initializing a virtual environment.

Configure and customize the Django Jazzmin package to modernize the admin, including migrations, creating a superuser, and applying ui tweaks via Django Jasmine settings and the ui builder.

Configure static and media files in a Django React e-commerce project to manage assets and uploads, set up static and media roots, and wire URL routing.

Explore how React builds dynamic, responsive user interfaces with a component-based approach and virtual DOM. Discover why pairing React with Django enables clean separation of concerns.

Set up a modern react project with vite, install node.js and yarn, and add essential dependencies like axios, jwt decode, js-cookie, react-router-dom, and zustand.

Learn to build a custom Django user and profile model for an ecommerce app, including email-based login, auto-generated usernames and profile IDs with short UUIDs, and profile creation via signals.

Use django signals to automatically create and save a user profile on user creation, and integrate profile management with the admin.

Enhance the Django admin by registering user and profile models, configuring list display (full name, email, phone), and enabling search and date filters for efficient management.

Create and customize user and profile serializers in Django REST framework, learn how serialization converts models to JSON and back, and implement a to_representation method for nested user data.

Discover how JWT authentication works in a Django REST framework app, including token generation, storage, validation, and the benefits of stateless, self-contained security.

Learn to customize a login serializer with jwt in Django, adding full name, email, username, and vendor id to the token for a Django React eCommerce app.

Create a Django register serializer to accept full name, email, phone, and password fields, validate password matching, and securely save the user with set_password.

Implement the token obtain pair login view with Django REST framework simple jwt, and configure urls and settings to generate refresh and access tokens.

Create a register API view in a Django rest framework backend for an e-commerce app, enabling new user creation with full name, email, phone, and password validation.

Create interactive API documentation for a Django REST framework backend in an e-commerce course using drf-yasg, configure swagger UI with OpenAPI info, and test endpoints directly in the browser.

Learn to implement login authentication on the front end with React using Zustand. Build a centralized user store to manage login state, user data, and loading indicators.

Create a reusable axios api client in react by building an api instance with a base url, five-second timeout, and json headers, then implement login, register, and logout for authentication.

Learn to implement a complete authentication workflow in React for a Django and React e-commerce app: login, register, logout, token storage in cookies, and automatic token refresh with JWTs.

Extend Axios lifecycle by creating a custom Axios instance with interceptors to refresh access tokens via a refresh token stored in cookies for private API calls.

Build a React project wrapper and a private route to guard app content until the setUser action completes, using useEffect and useState with a loading state.

Create a private route in React that restricts access to the dashboard by checking authentication with a store. Redirect unauthenticated users to the login page using react-router-dom navigate.

Learn to build a login component in a Django and React e-commerce app, including routes, a login form with email and password, and redirect on success using react-router-dom and zustand.

Create a register feature in react by building a register component with full name, email, phone, and password fields, including confirm password, handling state and async submission to register users.

Master a React logout flow in a Django and React e-commerce app by building a logout component, wiring routes, and clearing cookies and tokens with useEffect on mount.

Build a password reset API view in Django REST framework that retrieves a user by email, generates an OTP, and creates a reset link for the frontend.

Create a forgot password React component that collects the user email, sends it to the backend via an API endpoint, and handles responses and errors to enable password resets.

Build a Django rest framework password change API view that validates OTP and reset token to securely reset a user’s password, returning 201 on success.

Finalize the password reset with a React create password component that validates new passwords, reads otp and uid from the URL, and posts form data to the DRF API.