Fullstack App with Session-Based Auth in Django & React.js (Vite) #django #react #vite

🚀 Welcome to the latest YouTube tutorial on django-react auth system!
Learn how to build a secure Django session-based authentication system with Django, and React via Vite! 🔒💻

In this comprehensive tutorial, we'll cover everything you need to know about session-based authentication and why it's essential for securing your web applications. We'll also dive into critical security topics like XSS and CSRF, ensuring you have a solid understanding of web security best practices.

🍪 In the first 10 minutes, we'll break down the differences between token-based authentication and cookie 🍪 session-based authentication. You'll gain insights into the strengths and weaknesses of each approach, helping you make informed decisions for your projects.

🛡️ We'll also explore security threats like Cross-Site Scripting (XSS) and Cross-Site Request Forgery (CSRF) and discuss how session-based authentication mitigates these risks.

Here's what you can expect in the tutorial:
1️⃣ Creating a Django Backend:
We'll start by setting up the Django backend, writing the necessary code to handle user authentication.

2️⃣ Scaffolding React with Vite:
Next, we'll show you how to scaffold a React application using the lightning-fast Vite tool. This will be the foundation of our frontend.

3️⃣ Styling with Bootstrap:
We'll enhance the user interface of our application by incorporating Bootstrap for sleek and responsive styling.

4️⃣ Testing the Authentication System:
Finally, we'll put our session-based authentication system to the test.
You'll see how CSRF tokens and session IDs work, and we'll demonstrate how the authentication behavior changes when users log in and log out.

⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰
⏰Timestamps:
⏰ 00:00 - Introduction
⏰ 00:48 - Session Based Auth Vs Token Based Auth
⏰ 02:29 - What is a Token ?
⏰ 03:22 - Security / XSS / CSRF
⏰ 05:47 - Build Django backend
⏰ 19:13 - Server Migration
⏰ 19:31 - Create Superuser for Admin Board
⏰ 20:18 - Django security settings
⏰ 22:17 - End of Django code
⏰ 22:29 - Subscribers Recognition
⏰ 22:46 - Scaffolding React using Vite
⏰41:00 - Debugging in process!
⏰44:32 - Where is Bootstrap link ?
⏰44:42 - Setting up bootstrap
⏰46:40 - End of React code
⏰46:50 - Static settings in React
⏰47:10 - App Building with npm run build
⏰47:56 - Static settings in Django
⏰50:33 - Place Frontend folder in Django folder
⏰51:08 - Testing
⏰51:24 - Debugging
⏰52:13 - More Debugging
⏰52:28 - App Running / Demonstration
⏰54:14 - Outro
⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰⏰

⚠️ It’s very easy to help the channel! ⚠️
➊ Like 👍 or 👎 the video
➋ Write a comment 💬 under the video (I answer almost everyone)
➌ Send video ✉️ to friends via social networks
➍ Watch the rest of the videos 🎥 on the channel.
✔️ Every completed item makes the channel better!
Thanks friends! 🤝 🤗 👐

📱 Follow us on Social Media:

Whether you're a seasoned developer or just starting with web development, this tutorial is packed with valuable insights and hands-on coding experience. By the end, you'll have a robust authentication system in place, fortified against common security threats.

Don't miss out on this exciting tutorial! Hit the 'Subscribe' button, turn on notifications 🔔, and let's dive into the world of secure web authentication with Django, React, and Vite! 💪🔐💻

#Django #React #Vite #Authentication #WebSecurity #Tutorial #Development #Coding #WebDev #SessionAuth #Bootstrap #CSRF #XSS #SubscribeNow
Join this channel to get access to perks:

[keshavvyas]

Amazing, was looking everywhere regarding how to integrate react (vite) wit django, you made it so simple. The main part was including base: '/static/' in vite file, that made the difference which I was not able to find anywhere else.... Thanks

[Tussu]

Which one is more convenient to create django form, CreateView or forms.ModelForm? When to use which one? Please help!

[solday]

Thank you very much, kind person, I definitely like and subscribe, it helped me a lot with the Vita assembly

[svetlana]

Thanks Bek! Your tutorials are useful as always

[MPAXEL]

Thank you so much for this great tutorial !!

[ahcenebelhadi]

what's the thing that shows the details of the render method at 19:14 ? thanks for the video.

[JasonNgai-zkfp]

I encounter a problem, the response of .js in the index.html type is text/plain, how can I solve this problem?

[georgesamuel]

Great Job as usual !!!! Thanks a a lot Bek !

[mkbrothers]

Sir my frontend content is not visible in django local host

[gregoryweb]

Sir please make a course about django full stack, your teaching is straightforward than other youtubers

[navaneeth]

how to test out api integrations while in development

[juliangrajales]

BRO I DID ALL, I HAVE PASSED FOUR DAYS TRIUNG TO FIX IT. BUT, NOT FIND THE main.jsx in src, i tryed all. can you help me. i aprecciate it so much, great job, thanks.

[juanpedroreyesornelas]

I'm amazed by the fact that at minute 10:10 you wrote "passowrd" instead of "password" and it worked the same way

[reilwaystation]

how is react now still better for classbased views?

[SebastianTapiaqweasd]

52:03 I felt that! One of the worst feeling, correct something and still not working!

[farzadmf]

Question: what's the thing showing auto-complete menu for the terminal command history?

[betadeveloper]

Thank you for the video, i followed it and about to launch my project, however, my images are not being served from my dist. it shows 404 page. is there a separate config for images?

[gsmtechzambia]

Could you also show how you access the cookie when httponly is set to true for both csrf and session?

[vzzstkn]

why did you use class based component instead of function based component in react?

[codedjango]

Nice....first time seeing a react tutorial using a class based component in React....phew!! Good to know how simple it is using class based components, but not sure why the whole world is running after functional based components...thanks anyways 👍 ....also please share the correct github repo link ...its not accessible to me....thank you