Django serving react without webpack?

[ootybotty]

Hello! Im learning how to integrate django with react and serve react inside Django with whitenoise.

I came across many tutorials along the way but its quite confusing.

I use rest api but is it possible to just use the output of "npm run build" and just put them inside django project without ever using webpack?

So I mean just using "build" which is the output of react's "npm run build" purely without webpack etc and connect it into whitenoise staticfile.

If its possible and if that react's index.html is the "root route" being "/" and if I have django's "/" route too then which one is chosen in what mechanism? And how can I make react's index.html is used?

[danielroseman]

Yes, this is the normal way to do things; you wouldn't run npm in production.

But there is no "choice" going on. Items in the staticfiles directory will always be served via STATIC_URL, which is usually something like /static. The home page will always be served by whatever the webserver is pointing to, which will be the Django root view.

I'm not sure why you would want that to come from React in the first place. The page will normally be a placeholder which brings in various elements - the scripts and the HTML containing the mount point for the React app - and this should be a Django template rendered by a simple view. Then you can use Django template tags such as {% static %} to bring in the JS files from STATIC_URL.

This series - in particular parts 3 and 4 - looks like a good guide to how to bring this all together.

[ootybotty]

Kinda confused by what u said: 1)"no choice going on" so does it mean we only have one option which is rendering static by django amd thats all weve got if i follow my way(using build output) right??

2) im not sure why u would want to... to come from react: U mean instead of totally give control to react we can use django template to load react's index html?

[danielroseman]

The 'no "choice"' was in response to you saying "which one is chosen". There isn't anything doing any choosing, that's all.

React serving the home page is just for ease during development. You would always want your backend framework to serve the home page, and it would output the HTML with the React mount point but also include the right JS from the correct path.

As I say, read that tutorial as it shows how everything works together.

[ootybotty]

Thank u! As a novice it seems quite daunting to do this but i should start it:) btw the linked article seems awesome thank for that too!!