React + Django Integration Tutorial | Hello World App

[@DennisIvy]

Don't forget to check out my Complete Django course! dub.sh/NvGboTI

[@mb-sy7mt]

genius that you made a very short tutorial to just show of the technical part. the other tutorials are hours long i just need to understand the basic connection thanks

[@devendraingale2870]

Bro Can I make a full stack website using React + Django ??And is it easy to integrate all things properly?

[@soroushsalari2310]

@@devendraingale2870 if you know react and django with this you can make everything you need to do work properly

[@rubeushagrid4208]

I been done watched hours... hours!! of Django/React integration tutorials sending me around the bend installing babel and writing a hundred things in settings.py and my man has us set up in 2 min flat. Bing. Bang. Bosh. What a champ.

[@abelmurua6980]

Dennis this is awesome thank you. Straight to the point of what was needed. I follow you. More context on react + django is always appreciated

[@samtech6181]

This is very fast and a bullet to the heart explanation of what I searched for, Thank you!

[@ShashankSingh8956]

Your videos are very clear and "to the point". Massive respect man. Thanks a lot. Subscribed!

[@isaacb5814]

I never knew that. You made it so easy. Absolute gold and thank you for the tutorial

[@SakosTechSpot]

Short and to the point. Amazing! It's everything I wanted.

[@dennyage4791]

Thanks a lot ❤❤ After wasting 2 days ..finally found your video . If anyone facing problem on reloading url in app plz use re_path instead of just path and place it at last in urlpatterns. re_path(r"^.*", TemplateView.as_view(template_name = "index.html"))

[@pankulrathi663]

I am searching this from one month. Probably the simplest way to combine django and react.

[@malex5041]

Took me a whole day... then I found this video. Thank you !!

[@rayganmudberry375]

Dennis. please start new series with project from scratch react + django tutorials. happy to following your tutorials . thank you

[@DennisIvy]

I'm gonna release a django + react ToDo app based off this video but once I'm done with my series and a few other projects I'll probably put together a full course on this topic, or atleast some practical apps that with react + django. Thank you for your support :)

[@eltequilero_]

Dennis Ivy thank you so much for all your videos they are great! Will you also include how to deploy the app to Heroku? That would be an amazing addition!

[@sarankumar892]

@@DennisIvy iam egerrly waiting

[@codingforever3196]

@@DennisIvy plze pu

[@thecodespace]

Sir i'm a cse student and have been Working with django from last 2 years . More pumped after seeing your Videos.

[@TheAremoh]

My new go-to channel. Waiting for a Django-react app with payment integration. Don't say I asked for too much. Weldone and good job.

[@DennisIvy]

I'm honored :) thank you for your input. I love hearing what content you guys would like to see from me.

[@djangodo7015]

i did that with Paypal ! easy peasy, the only issue you'll face is integrating the request body for paypal.

[@TheAremoh]

@@djangodo7015 the most widely used in my country (Nigeria) is paystack. I still find it difficult to integrate it with Django.

[@elijahonduso]

Dude I started watching your tutorials today but your my number one so far.

[@dnogitsune9286]

Thank you so much. This was the part that was messing me up so much. I prefer tutorials that go straight to the point.

[@julianamaya974]

Hi Dennis, I'm Julián, from Colombia, South America. I like your content. This is video is short but so important. Thanks a lot for share it.

[@yashasvibajpai4702]

You are the best!! I was searching for the latest version videos and your channel popped up!!!! Thanks man... Ciao bella :)

[@jayesh_15]

I am starting to like the way you explain in shortest time possible.

[@PythonCareerCoach]

Thanks for to-do app series and this integration ! Looking forward to see real app clone using react-django (If it's paid one also I am ready blindly!). Finally I can say , I found someone to follow for many years to come. Thanks !

[@astagisladottir4850]

This tutorial was a lifesaver!

[@animeshsingh4290]

How did it actually save your life ?

[@astagisladottir4850]

@@animeshsingh4290 This was 9 months ago but I imagine I was moments away from wading into the sea and disappearing forever.

[@astagisladottir4850]

but in all seriousness, I was struggling with connecting Django to React and this tutorial saved the day

[@meherbyar]

one of the best teacher i love the way you explain

[@LiaAdzumi]

Hi, Thanks for this short video but it is a great one :) Can't wait for the next ones ... Please upload them asap .. BR, I am Nyoman, from Bali, Indonesia

[@DennisIvy]

Hi Nyoman and Thank you :) Putting together the next React + Django video soon!

[@aghileslounis]

Short and good video thanks ! but i have a question: in reality we should build a REST API with django for exemple and a react APP than we can fetch the api from React right ? like i don't understand the purpose of integrating React app inside django app like that, like we could simply build all the app with django at this point no ? because we don't really have a separate backend and front-end because we are running everything from Django ! i'm new so maybe i'm completely wrong but i want to understand if you can help

[@lenasnd]

You are awesome! i was searching and searching for an easy explanation and i found this video, easy and fast integration.

[@adityanjsg99]

Dennis is the Best!

[@akramamin5432]

quick simple and clear show on how it work. thanks

[@terraptr1448]

Absolutely lovely! :) Thanks a lot man. Short straight to business video.

[@amanvyas9480]

Really Thanks Dennis for that video just in 11 minutes you showed that big confusing thing....

[@shahidullahmiazi]

Why not you had born before! I tried hard another option and that is not good except yours. Many many thanks for share an easy tutorial.

[@DennisIvy]

Your very welcome :)

[@DILEEP-ls9pg]

A video on how to dockerize this application will be really helpful

[@fikrimusic2234]

congrats for your 100k subs🔥🔥🔥 i think you should make another tutorial about django and react. and make some practical app from scratch. im waiting dennis 🤘🤘

[@Muratmenzilci]

This is the tutorial that i want ! Really thank you so much

[@namesare4fools]

it drove me nuts when figuring out how the heck do we deploy django + react since both, during development, are running on different server. I finally understood react & now I understand that Django are the real main thing we actually deploy !

[@GGlessGo]

soo both are running on different server you know why? :o How can you deploy both then in an android apk for example, do you know?

[@DroidTsuenik9]

What about the template engine? Do you just include the {{ variable_name }} in the react components?

[@elysetombojara3183]

Thank you so much Dennis for this tutorial ! It helps me more.

[@Nomanqureshi2204]

Thanks .. pls upload more videos on django + react

[@DennisIvy]

Will do :) gonna do a full course on react in the near future.

[@ryan_0337]

@@DennisIvy Thanks Dennis, but is the django tutorial finished ? Are you going to continue him or make a pause ?

[@shahidullahmiazi]

@@DennisIvy We just follow you everything for skill up web dev.

[@antonioacevedomontoya2537]

It's a good practice to run build every time I do a change something in the React app? Thx for the tutorial!

[@abdulwaqar1707]

you are awesome Dennis

[@studioteque]

This is exactly what I needed. Thank you!

[@techease839]

Thanks Dennis this video helped me alot to integrate django with reactjs Thankyou very much 🔥

[@renzyndrome]

Hi Dennis, I just want to ask if you are also planning on doing some Vue-Django content? Thanks!

[@okkkk88612]

thank you sir this is genius

[@fullstackspiderman]

@Dennis Ivy: I was using jQuery/Javascript in Django/Flask for Server side template rendering. But since I learnt React, I deploy React (to fetch API and manage UI) and Flask/Django (only using as backend API) in seperate containers. I see people using React (like jQuery) like traditional Sever side template rendering (Not sure why they don't use Next.js for that purpose?). Please advise if I'm right and share your suggestions. It will be much appreciated and helpful. :)

[@anonimo-xz2tg]

I don't understand why react should be even used as the view layer in MVC architecture. Isn't that an overkill regardless of the size of the project? Pls enlighten. TIA!!

[@maxvinella941]

this is what I was waiting for!

[@DennisIvy]

Perfect :)

[@david2358]

Thank you for the video, just subscribed!!

[@sekiro_19]

I really like the way to explain things, smooth. I struggle with making db queries (filters and joins) in django, i always go to gpt to start. Do you have any videos that can help me build and structure my queries. (I have no problems with sql)

[@Gugmi]

Thanks for making this- what if you are using AWS for hosting static files? And heroku for hosting the entire app?

[@DennisIvy]

Good question :) When you run "Run build" these are technically static files. Its a bit complex and I might address it in a separate video but basically you would host your react app in aws s3 buckets.

[@AyushVerma-yr9mi]

Short and to the point, very noice. Just a small doubt, how to configure the STATIC_ROOT setting for production mode?

[@wolfisraging]

Plz make a tutorial how to deploy a django + react website on heroku

[@rameshdahal7339]

Can you please make a video on Vue + Django Integration, Thank you in advance!

[@manavchawla7433]

Hi Denis awesome video, just wanted to ask that can same be done with Angular and Django?

[@MichielDeSnuyter]

Thank you so much for your sweet content, I'm learning a ton :)

[@naumaniftikharsatti5721]

Won't it get frustrating when everytime you write a piece of code and to view you want to run build?

[@roar3850]

bro did you find better integration?

[@TdadadT9]

@@roar3850 why do you need this integration? :) You can use react and django simultaneously without that

[@cutipets8706]

I followed this tutorial works fine but when i integrate a template with react app (creating a folder calld assets in public directory) and in index.html i load the bootstrap and jquery, when executing the code gives me this error : Refused to apply style from '127.0.0.1:8000/assets/css/bootstrap.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled. also for others. please can you help?

[@ishantiwarimusic]

I found this approach and worked hard on my app but the major query. I have is that can we print a Django template language with react

[@pasan6209]

Thanks Dennis !!

[@shivamkumar-qp1jm]

thank you sir superb now i can make complete django and react app using axios

[@codelery414]

I am right to say that this process of integrating React to Django is solely for static website as there is no way React can get context from Django? If am right, I would like to know if learning mongodb, express and node is better than learning django rest framework for building backend for React

[@learnsupreme8282]

Nice content bro. Keep it up.

[@10KRotator]

thanks a ton Dennis!

[@amoghyermalkar5502]

Guys I need help.! Okay so I have a react app inside the django project folder. What i want to do is, give the url to my django app in main app. And then the django app would display the template view. But when i do the template view its only visible through the root url Help

[@femibolaji4338]

in order to fix this, use from django.urls import path, include, re_path re_path('.*', TemplateView.as_view(template_name='index.html')) instead of path(' ', TemplateView.as_view(template_name='index.html'))

[@dipusarker8072]

Please bring a tutorial with react and django rest framework

[@DennisIvy]

Coming soon :)

[@DevBishwasBh]

Please do authentication in Next Js with Django Rest Framework.

[@lalaniwerake881]

great tutorial, thank you!

[@martapfahl940]

I don't know Pyhton/Django but with this set up is it possible to make also API calls to a pyhton server which serves data from a SQL Database?

[@sanjaygaire5207]

not getting the static files when using react with vite, any suggestions: with vite its /dist/assets

[@coderaiders-yt]

Excellent video

[@murtazarizvi706]

just asking whats the difference between this short best video and some other 1hr videos ?

[@mohammedyousef2074]

Can we only use react with django in Class-based-views ?

[@patriotlightning7791]

Well done!

[@sskdev5116]

Would django not render if we are starting fresh and not building the react app and for the time being select the public folder for the index.html?

[@cornelius600]

Thanks, it worked! But it overwrote an existing index.html of my django project.. Any tips how to add react as a separate address?

[@nikhilgupta04]

Awesome !

[@supersonic6734]

Wow dude... dunno how to thank you🤩🤩🤩🤩

[@TheLegendOfNiko]

Is it possible to show templates from Django and Templates from React? Or must it be strictly Django templates or strictly React templates?

[@desk6173]

is possible install styled-components for react on django?

[@edchelstephens]

Wow! Thanks a lot man! I have a question. Is there a way that to automate the build process? Like if I make changes to my react source, it will auto build on save and django will pick it up and reload with my component updates?

[@seemoominator1633]

Maybe search for a react hotreload pulgin.

[@shubhamphadte7844]

Thanks Dennis , just what i was looking for. You explained it concisely and to the point. I have a doubt regarding making changes to the react app. How did you manage .gitignore to ignore node_modules and other files ?

[@freesxsoccer]

Shubham Phadte think you could just add node_modules/* to the gitignore

[@baijaw1299]

Thank you so much Dennis

[@tabmax22]

should we create an api project too within the root?

[@kostyaokylich4270]

How to setup with Hot reloading? All time build react? It's some sort of crap

[@finne.7726]

I think that you still could view your Frontend changes with npm start.

[@johndaniel523]

I created a full webpage using django, i would like to now build the mobile application. Should i create the mobile app in a different file(new repo) or it can work altogether in one file?

[@chrisowuor605]

thanks so much this really helped 🥳

[@AnthonyPaulT]

So everytime, you make a change to your REact app, you need to do npm run build?

[@sagargahatraj5196]

Yes coz we are using files from production build so we cant have hot moduling for quick solution i found open your react project only in vs code or other editor and run your code live 👍

[@AnthonyPaulT]

@@sagargahatraj5196 You are better off using Next,js or just use Django as a RESTFUL API. It doesn't amke sense coupling your projects together

[@valentinfigueiredo]

it might be the same for vue and svelt?

[@tannerbarcelos6880]

Truly just love how we see almost no JS yet can do all what JS does. I just cannot stand JS. Although I do like it here and there and really like node, something about Django and flask and python make web dev so much “easier” I’m literally going to watch your Django series and then the portfolio project! Last year in my CS degree, time for some projects and a portfolio! Keep up the great work. Maybe a clone of a web app like Facebook or twitter? 👀

[@ryan_0337]

Hi Dennis, Do you know how to integrate angular with django for the front end ? Thank's in advance

[@DennisIvy]

Sorry I don't have enough experience with Angular yet :/ I plan on learning soon though.

[@kostyaokylich4270]

Create ang-proj in django with ang-cli. Build ang-proj with 'ng build' . Add path to django 'your-ang-proj-name/dist/your-ang-proj-name' . Static files - assets folder in ang. If problems with Cors - use django as api server (example: kzbin.info/www/bejne/sJCrXqKuhrumhtk ). That's it.

[@tabmax22]

how do you then deploy the whole fullstack website onto the web?

[@simonm17]

Hey Dennis! Thanks so much for the video. I'm trying to add some bootstrap social font awesome buttons to my site. So far it's only showing up in my npm start and not appearing in python manage.py runserver. Do you know a way I can have it rendered into the django server? Thank you!

[@clashgamers4072]

npm run build

[@mohammedkaifmirza7585]

Very much helpful video, it would be great if you had added some Django logic to the app in the same video so that it will be more clear to us.

[@tejasmandre3212]

You're God :) I thought now that I have learned react my Django skills are a waste! Thank you soooooo much!

[@hamzanasirr]

How about I create Django as a separate project and use it as APIs for a separate react project?

[@HariKrishna-mu7ku]

How to integrate screens with Django ? Screens designed to be joined with frontend.. please help me with some information or material this can be helpful in completing my task

[@DevBishwasBh]

Thanks but please do NextAuth with Django Rest Framework for Authentication, with email and password. Also, adding OAuth (Django-based) on the same tutorial will be great. I am desperetely waiting for your response.

[@Sahilblogs536]

In my system manifest.json file not found error is coming

[@TripleIsaac]

I have the same problem, do you have any idea how this can be solved ?

[@Sahilblogs536]

@@TripleIsaac no still not found any solution

[@bafian]

same problem

[@abhishekyadav2247]

Same issue... Please give a solution

[@cedriclim7153]

The guy in the vid also gets the error, but doesn't address it

[@hansalexander1051]

should I activate virtual env before using react?

[@AabidKhan-bv7qk]

Bro u r just fab.... Need a big project such as blogging or e-commerce on react plus Django.... Love from India

[@TimBrowning-k2o]

Will you be able to run this in AWS Amplify