MENU

Fun & Interesting

Django and React Full Stack Project 2025

Code With Clinton 4,216 2 months ago
Video Not Working? Fix It Now

In this 6-hour fullstack tutorial, you'll learn how to build and deploy a modern web app using Django and React with JWT authentication, React Query, Tailwind CSS, and Shadcn UI. We'll cover everything from setting up the project to secure authentication, pagination, protected routes, and full deployment. What You'll Learn: ✅ Setting up React, Tailwind, and Shadcn UI ✅ Dynamic page routing and dark mode toggle ✅ Fetching and displaying blogs with React Query ✅ Building authentication (signup, login, JWT) ✅ Creating and protecting routes ✅ Deploying both frontend and backend Source Code: https://github.com/CodeWithClinton/devscribe Here is the Backend Tutorial: https://youtu.be/Mj3dGdBdiO4 Here is source code to the backend: https://github.com/CodeWithClinton/yt_devfolio_api Here are the links to the remaining parts of the video: 👇 1. Managing User Authentication, Login and Logout: https://youtu.be/74ErEphuOmc 2. Creating New Blog Posts: https://youtu.be/7lxANGfqqY0 3. Updating Blog Posts using Modals: https://youtu.be/mkLCnkO7FIo 4. Deleting Blog Posts: https://youtu.be/6Hvms2MASI8 5. Building Dynamic User Profiles: https://youtu.be/oy8Of-roEEg 6. Updating User Profiles: https://youtu.be/fpn1IPJgKYk Timestamps 00:00:00 - Introduction 00:06:41 - Setting up the React project 00:14:34 - Configuring Tailwind CSS 00:20:28 - Setting up Shadcn UI 00:29:50 - Building reusable components 00:54:10 - Adding a custom title and favicon 00:56:12 - Structuring the pages 01:07:16 - Implementing page routing in React 01:19:36 - Highlighting the active navigation link 01:23:35 - Adding a light mode & dark mode toggle 01:44:52 - Connecting Django with React 01:56:17 - Fetching and displaying blogs with React Query 02:29:22 - Implementing pagination in Django & React 03:01:06 - Building the blog detail page 03:18:32 - Creating the signup page 03:25:33 - Validating forms with React Hook Form 03:42:02 - Handling user registration 04:03:45 - Understanding JWT authentication flow 04:05:40 - Building the create post page 04:15:01 - Developing the login page 04:17:02 - Setting up protected routes 04:38:15 - Validating login forms with React Hook Form 04:45:47 - Implementing user login 04:58:47 - Redirecting users after successful login 05:04:25 - Preparing for deployment 05:04:54 - Creating a custom 404 Not Found page 05:05:56 - Deploying the Django backend 05:19:57 - Deploying the React frontend 05:36:03 - Fixing "Not Found" errors after page reload on Render 05:38:32 - Conclusion

Comment