Development

Full Stack Web Development with Django and React

This comprehensive 5-month course is designed for aspiring web developers to master full stack development using Django for the backend and React for the frontend. Students will gain hands-on experience in building dynamic, database-driven web applications, integrating APIs, and deploying projects to production.

Full Stack Web Development with Django and React
Duration5 months
Lessons200
LevelBeginner
ModeLive Online

What you will learn

  • Django Basics
  • RESTful API Development with Django Rest Framework
  • Frontend Development with React
  • State Management with Redux
  • Integrating React with Django Backend
  • Authentication and Authorization
  • Building and Deploying Full Stack Applications

Corporate training outcomes

  • Completion certificate
  • Practical assignments and project work
  • Mentor support and progress tracking
  • Custom batch options for teams
  • Yes

Requirements

  • Laptop with good internet
  • Passionate about learning web development
  • No prior experience needed
  • Willing to dedicate time
  • Curious about building modern web applications

Curriculum

Introduction to the Course
  • Course Overview Don't Skip this Lecture!
  • FAQ - Frequently Asked Questions
  • Course Set-Up and Installation
  • Notes on Updates Versions of Django
What is the Web?
  • Definition and Overview of the Web
  • Understanding the Internet vs. the Web
  • Components of the Web (Web Servers, Web Browsers, and Web Pages)
  • The Role of HTTP and HTTPS
  • How Websites and Web Applications Work
  • Understanding Web Protocols (TCP/IP, DNS, etc.)
  • The Evolution of the Web (Web 1.0, Web 2.0, Web 3.0)
HTML Level One
  • HTML Level One Introduction
  • HTML Part One Basics
  • HTML Level One - Part Two - Basic Tagging
  • HTML Level One - Part Three - Lists
  • HTML Level One - Part Four - Divs and Spans
  • HTML Level One - Part Five - Attributes
  • HTML Level One Assessment - Overview
  • HTML Level One Assessment Solutions
HTML Level Two
  • HTML Level Two Introduction
  • HTML Level Two - Part One - Tables
  • HTML Level Two - Part Two - Tables Quiz
  • HTML Level Two - Part Three - Table Quiz Solutions
  • HTML Level Two - Part Four - Forms Basics
  • HTML Level Two - Part Five - Forms and Labels
  • HTML Level Two - Part Six - Forms and Selections
  • HTML Level Two - Assessment
  • HTML Level Two - Assessment Solutions
CSS Level One
  • CSS Level One Intro
  • CSS Level One Part One
  • CSS Level One Part Two
CSS Level Two
  • CSS Level One Part Three
  • CSS Level One Part Four
  • CSS Level One Part Five
  • CSS Level One Assessment
  • CSS Level One Assessment Solutions
  • CSS Level Two
  • CSS Level Two Introduction
  • CSS Level Two - Part One - Fonts
  • CSS Level Two - Part One (Fonts) Continued
  • CSS Level Two - Part Two - Box Model
  • CSS Level Two Spectrum Project Overview
  • CSS Level Two Spectrum Project Solutions
Capstone Project One
  • Capstone Project One Overview
  • Capstone Project One Solutions
Bootstrap
  • Bootstrap Introduction
  • Bootstrap Part One - Buttons
  • Bootstrap Part Two - Forms
  • Bootstrap Part Three - Navbars
  • Bootstrap Part Four - Grids
  • Bootstrap Project
  • Bootstrap Project Solutions
JavaScript Level One
  • JS Level One Introduction
  • JS Level One - Part One - Basics
  • JS Level One - Part Two - Connecting Javascript
  • JS Level One - Part Three - Exercise
  • JS Level One - Part Three - Solutions
  • JS Level One - Part Four - Operators
  • JS Level One - Part Five - Control Flow
  • JS Level One - Part Six - While Loops
  • JS Level One - Part Seven - For Loops
  • JS Level One Part Eight - Loop Exercises
  • JS Level One - Part Eight - Solutions
  • JS Level One - Project Overview
  • JS Level One - Part Nine - Project Solutions
JavaScript Level Two
  • Introduction to JavaScript - Level Two
  • Functions in JavaScript - Part One
  • Exercises on JavaScript Functions
  • Solutions to Function Exercises
  • Understanding JavaScript Arrays
  • Exploring Array Exercises - Part One
  • Solutions to Array Exercises
  • Working with JavaScript Objects
  • Deep Dive into Objects in JavaScript
  • Object Exercises in JavaScript
  • Solutions to Object Exercises
jQuery
  • Introduction to jQuery
  • Basics of jQuery - Part One
  • Understanding jQuery Events - Part Two
  • Overview of jQuery Project
  • jQuery Project Solutions - Part One
  • jQuery Project Solutions - Part Two
  • Final Solutions for jQuery Project
Back-End Development Overview
  • Overview of Back-End Development
  • Introduction to Command Line and Terminal
Introduction to Python Level One
  • Getting Started with Python Level One
  • Python Setup and Installation
  • Working with Numbers in Python - Part One
  • Introduction to Strings in Python - Part Two
  • Exploring Lists in Python - Part Three
  • Understanding Dictionaries in Python - Part Four
  • Working with Tuples, Sets, and Booleans - Part Five
  • Overview of Python Exercises - Part Six
  • Solutions for Python Exercises - Part Six
  • Control Flow in Python - Part Seven
  • Introduction to Functions in Python - Part Eight
  • Function Exercises Overview - Part Nine
  • Function Exercises Solutions
  • Overview of Simple Game Project in Python - Part Ten
  • Solutions for Simple Game Project - Part Ten
Introduction to Python Level Two
  • Understanding Scope in Python
  • Introduction to Object-Oriented Programming - Part One
  • Exploring Object-Oriented Programming - Part Two
  • Advanced Object-Oriented Programming - Part Three
  • OOP Project Overview
  • OOP Project Solutions
  • Handling Errors and Exceptions in Python
  • Regular Expressions in Python
  • Working with Python Modules and Packages
  • Introduction to Python Decorators
  • Understanding the Name and Main Functionality
Django Project Setup
  • Setting Up a Django Project
  • Creating and Configuring a Django Application
  • Django Challenge Solutions - Level One
  • Understanding URL Mappings in Django
  • Introduction to Django Templates
  • Templates Challenge in Django
  • Solutions for Django Template Challenges
  • Working with Static Files in Django
Introduction to Django Level Two
  • Overview of Django Models
  • How to Create Models in Django
  • Writing Population Scripts in Django
  • Understanding the Models-Templates-Views (MTV) Paradigm
  • Django Level Two Project Exercise
  • Solutions for Django Level Two Project
Django Level Three
  • Introduction to Django Level Three
  • Understanding Django Forms
  • Basics of Form Coding in Django
  • Validating Forms in Django
  • Working with Model Forms
  • Model Forms Exercise
Introduction to Django Level Four
  • Introduction to Django Level Four
  • Working with Relative URLs in Templates
  • Coding Examples for Relative URLs
  • Understanding Template Inheritance
  • Template Inheritance Coding Examples
  • Introduction to Custom Template Filters
  • Creating and Using Template Filters
  • Coding Examples for Custom Template Filters
Introduction to Django Level Five
  • Introduction to Django Level Five
  • Understanding Django Password Management
  • Working with User Models
  • Introduction to Forms in Django
  • Coding User Models and Forms - Part One
  • Coding User Models and Forms - Part Two
  • Implementing Registration
  • Implementing Login
Introduction to Django Deployment
  • Introduction to Django Deployment
  • Full Deployment Walkthrough on PythonAnywhere
Introduction to CBVs (Class-Based Views)
  • Introduction to Class-Based Views (CBVs)
  • Hello World with CBVs
  • Template Views with CBVs
  • Detail View and List View Part One
  • Detail View and List View Part Two
  • CRUD Views
First Clone Project (Blog Clone)
  • Introduction to First Clone Project
  • Blog Clone Project Part One
  • Blog Clone Project Part Two
  • Blog Clone Project Part Three
  • Blog Clone Project Part Four
  • Blog Project Part Five
  • Blog Project Part Six
  • Blog Project Part Seven
  • Blog Post Project Part Eight
  • Blog Project Part Nine
  • Blog Project Part Ten
Social Media Clone Project
  • Introduction to Social Media Clone Project
  • Social Clone Part One
  • Social Clone Part Two
  • Social Clone Part Three
  • Social Clone Part Four
  • Social Clone Part Five
  • Social Clone Part Six
  • Social Clone Part Seven
  • Social Clone Part Eight
  • Social Clone Part Nine
  • Social Clone Part Ten
  • Social Clone Part Eleven
  • Social Clone Part Twelve
  • Social Clone Final Part
Project 3: E-commerce Website Clone
  • Setting up the project structure
  • Creating models for products, users, and orders
  • Implementing product listing and search functionality
  • User authentication and registration
  • Shopping cart functionality
  • Order management and checkout process
  • Implementing payment gateway
  • Order history and user dashboard
  • Admin panel setup for managing products and orders
Project 4: Task Management App
  • Setting up project structure
  • Creating models for tasks, categories, and users
  • User authentication and registration
  • Task creation, editing, and deletion
  • Categorizing tasks and filtering by status
  • Setting task due dates and notifications
  • User dashboard with task progress overview
  • Admin panel for task management
  • Task collaboration (assigning tasks to users)
Project 5: Chat Application
  • Setting up the chat application structure
  • User authentication and real-time user presence
  • Implementing one-to-one and group chat functionality
  • Setting up WebSockets for real-time communication
  • Storing messages and user details in the database
  • Sending notifications for new messages
  • Chat interface and user experience (UI/UX)
  • Admin panel for monitoring chats and users
  • Securing chat data and privacy
Project 6: Portfolio Website
  • Setting up project structure
  • Designing homepage with introduction and portfolio items
  • Creating a contact form and email integration
  • Showcasing projects with images, descriptions, and links
  • Adding a skills and experience section
  • Implementing a blog or articles section
  • Making the website responsive for mobile devices
  • SEO optimization for better visibility
  • Deploying the website
Introduction to Debug Toolbar
  • What is Debug Toolbar in Django?
  • Installing and configuring Debug Toolbar
  • Understanding Debug Toolbar panels
  • Analyzing SQL queries, cache, and request/response details
  • Using Debug Toolbar to debug template rendering
  • Debugging request lifecycle and middleware
  • Optimizing queries and improving performance
  • Best practices for using Debug Toolbar in development
Introduction to Admin
  • Overview of Django Admin interface
  • Customizing the Django Admin interface
  • Creating models and registering them in Admin
  • Adding filters, search, and ordering functionality
  • Managing users, groups, and permissions in Admin
  • Admin form customization and inline models
  • Creating custom actions and buttons in Admin
  • Setting up role-based access for Admin users
Introduction to Django Rest Framework (DRF)
  • What is DRF and why use it?
  • Installing and setting up DRF in Django project
  • Creating APIs using serializers and views
  • Setting up URL routing for APIs
  • Authentication and permissions in DRF
  • Implementing CRUD operations for models via API
  • Using pagination, filtering, and ordering in DRF APIs
  • Setting up DRF for complex data models (relationships)
  • Testing and documentation with DRF
React Introduction
  • Introduction to React and its ecosystem
  • Setting up React with Create React App
  • Understanding React components and JSX
  • State and props in React
  • Component lifecycle methods
  • Event handling in React
  • Conditional rendering and loops in React
  • Form handling in React
  • React Router for navigation between pages
  • React Project (Integrating with Django Back-End)
React Project (Integrating with Django Back-End)
  • Setting up Django backend with React frontend
  • Exposing APIs in Django for React to consume
  • Using Axios or Fetch to make HTTP requests from React
  • Handling form submissions and validations in React
  • Managing state in React using Context API or Redux
  • Authentication with JWT tokens
  • Error handling in React components
  • Handling responses and updating UI dynamically
  • Deploying Django and React together
  • React Deployment
React Deployment
  • Preparing the project for deployment
  • Setting up React for production build
  • Deploying React app to platforms like Netlify, Vercel, or Firebase
  • Configuring environment variables for production
  • Setting up the production environment in Django
  • Configuring static files and media for deployment
  • Deploying the combined Django + React app
  • Debugging and monitoring deployed applications
  • Post-deployment steps (e.g., database backups, scaling)
Introduction to Git & GitHub
  • Introduction to Git & GitHub
  • Setting up Git and GitHub
  • Version control basics
  • Branching and merging
  • Pull requests and code reviews
  • Resolving merge conflicts
  • Collaborating on open-source projects
Introduction to Databases (PostgreSQL/MongoDB)
  • Introduction to Databases (PostgreSQL/MongoDB)
  • Relational vs. NoSQL databases
  • Setting up PostgreSQL
  • CRUD operations in PostgreSQL
  • Introduction to MongoDB
  • Connecting databases with Django
  • Database migrations
APIs & Authentication (JWT/OAuth)
  • APIs & Authentication (JWT/OAuth)
  • What are APIs?
  • REST vs. GraphQL
  • Introduction to JWT (JSON Web Tokens)
  • Implementing authentication with Django REST Framework
  • OAuth basics
  • Securing APIs
Cloud Deployment (Heroku/AWS/Vercel)
  • Cloud Deployment (Heroku/AWS/Vercel)
  • Introduction to cloud deployment
  • Deploying Django apps on Heroku
  • Hosting React apps on Vercel
  • Environment variables and secrets management
  • CI/CD pipelines
  • Monitoring and scaling applications
Interview Preparation
  • Common interview questions for Django, React, and Full Stack development
  • How to present your projects in interviews
  • Coding challenges and problem-solving techniques
  • Best practices for technical interviews
  • Preparing for behavioral and HR interviews
  • Mock interview sessions and tips
  • Reviewing key concepts in Python, Django, React, and DRF
  • Interview follow-up best practices
  • Building a strong portfolio and resume
  • Resume Discussions
Resume Discussions
  • How to create an impressive developer resume
  • Highlighting relevant skills and technologies
  • Structuring your portfolio and project descriptions
  • Tailoring your resume for specific job roles
  • Showcasing your achievements and contributions
  • How to write an effective cover letter
  • Discussing your projects and experiences during interviews
  • Key skills to mention for a web developer role
  • Avoiding common mistakes in resumes