Django & React Web App Tutorial - Authentication, Databases, Deployment & More...

In this video, you will learn how to use Python and JavaScript to create a full-stack web application. We will be using Django for the backend & React for the frontend as well as implementing authentication using JWT tokens. And as a bonus, I am going to show you how to deploy this application for free.

🎞 Video Resources 🎞

⏳ Timestamps ⏳
00:00:00 | Video Overview
00:00:39 | Project Demo
00:03:03 | Win a Cybertruck or $100,000
00:04:32 | Backend Setup/Installation
00:10:11 | Django Settings
00:14:39 | Understanding JWT Tokens
00:18:00 | Making The Registration View
00:25:40 | Connecting Our Auth Routes
00:32:58 | Creating Custom Models
00:38:57 | Writing Create, Read & Delete Views
00:50:38 | Frontend Installation/Setup
00:52:20 | Frontend Organization & Axios Setup
00:59:32 | Writing Protected Routes
01:08:57 | Navigation & Pages
01:16:35 | 404 Page
01:17:30 | Making A Generic Form
01:26:15 | Adding Form Styles
01:27:06 | Connecting The Login/Register Form
01:31:42 | Building The Home Page
01:44:10 | Building The Note Component
01:48:41 | Frontend Finishing Touches
01:52:20 | Database Deployment
02:00:03 | Deployment Configuration
02:05:02 | Choreo Project Setup
02:07:39 | Backend Deployment
02:14:30 | Frontend Deployment
02:16:23 | Connecting The Fronted To The Backend | 02:16:23

Hashtags
#techwithtim #djangoproject #djangorestframework #javascript

[StanWukong]

This couldn't have come at a more perfect time, I'm really grateful to whatever made you release this now

[pycat]

Haven't even started watching, but want to thank you for the video in advance. You're effort in raising generations of young (or junior, rather) developers is underestimated. One love, man.

[niranjan]

bro, you are a life saver. keep on doing the great work . We want more backend videos like this. Especially Django

[thesnedit]

You won't believe me but this is exactly what i was looking for. Thank you, tech with tim!

[_zEuS_]

I'm also learning React at the moment. I recently found that there's a shortcut for creating these components in VS Code. You just need to type 'rfce' (function) or 'rafce' (arrow function). This saves a lot of time.

[itzAustin-qrzx]

Thank TIm.
this is exactly what i've been looking for, I'm tired of build admin user functionality with Flask. (which i also learned from your Flask x React video)

[barscantayiz]

I liked how effective you use the components and react structure as well as starter template for django and simplisticly explain the concepts. This is a great video and I hope see more of them, django&react different kind of applications.👏🙌.

[PyGpt_insight]

sir thank u so much for the heat you are my inspiration why i learnt programming and because of u i am doing it at the age of 14

[marktaylor]

Oooh, been hyper focused on this channel for 3 weeks and now this. Nice.

[abhisheksharma]

This is the best explanation for django and using it with Reactjs. Thank you so much. Please make more videos using the django backend and react frontend. Thank you so much ❤

[bloodelfs]

For those getting the error 404 axios error. I solved it by first make sure the api.js and the .env are in the same directory. I didnt. To make sure that the error really is about not reading the .env you can replace the import in "baseURL: import.meta.env.VITE_API_URL ? import.meta.env.VITE_API_URL : apiUrl" to the env variable and it should work

[yerneroneroipas]

Hey Tim, I struggle to follow your tutorials but I made it through this one. It would be nice if you broke your github code into branches based on chapters in the video or break the video up and associate the code at each stage as a different branch.

[Complexo_escolar_privado]

I really like your videos, I learn a lot from them. My dream is to belong in one of your classes but first I need to improve my English because I speak Portuguese, I live in Angola Africa and some things here are a bit limited, but I love programming, please don't stop, your channel is one of the schools I attend.

[shahabjami]

barely started and already a great update to the previous django + react tutorial. thanks!

[mohammeddrgh]

really really good vid, the only thing i can add is that i would have loved if you do not import all the dependencies at once and rather import each one each time you need it, because it kinda creates some ambiguities but other than that everything was perfect

[basura]

Hey Tim, I was just wondering if you had any plans in the near future (few months or so) to make and release an updated flutter tutorial. I've loved all of your tutorials so far and I'm really interested in learning flutter and I'm sure other people would be too.

[vicky-mc]

This is what i was exactly looking for the past week... Thank you so much buddy... Im really, ... REALLY GLAD that i follow ur channel

[Michelle-mesg]

should we be hashing the user passwords we are saving? I am getting error "{
"detail": "No active account found with the given credentials"
}"

[b-ball]

Was really enjoying the tutorial until I ran into an error when doing the make migrations where it states "connection to server on socket "/tmp/.s.PGSQL.5432" failed: Socket operation on non-socket
Is the server running locally and accepting connections on that socket?" Cannot get past this :(

[samarthsaxena]

I wanted to thank you for creating so many interesting videos. I was wondering if you could do more Django projects, such as how to set up google authentication.