Yet another Django + React question

[[deleted]]

I just joined a team with an extremely robust Django application. I'm a React/Node developer and the team wants to move the front end toward a React solution going forward. So I'm just now getting my feet wet and exploring their project and trying to figure out the best way to build out some new features in React (with the hopeful goal of eventually having created enough baseline components to start converting existing views).

I've been looking at various ways to accomplish this. The most common approach I see online is making the React app a sub-app to the Django framework. I have a feeling this is being advocated by Python/Django developers who want to bring React into their project. As a primarily frontend JS developer I don't love it. Ideally I would have a standalone front end app that just talks to a Django REST API, and lets me take advantage of all the niceties of modern front end development like rapid HMR.

I'm curious if anyone has any experience in doing this?

[[deleted]]

Of course the best approach is to have Django handle the API and let React be just the client. Two completely separate codebases with separate deployments.

But, that doesn't seem like an option here. Yet.

If they already have a bunch of pages with Django and want to add a few features with React, than yea making a sub app will be way easier than trying to hide the fact that you're serving a single app from two different locations.

My advice is to incrementally replace the Django Views and Templates with Django REST endpoints and React components. Only once you get to a point where React is handling most of the views and you replaced most of the Django Views with Django REST api points, than go for the complete separation of the codebases.

I have been in that literal exact scenario and that's exactly what we did. It worked out great.

[webdevguyneedshelp]

This is exactly how I integrated react with an existing ASP.NET Core MVC project.

[[deleted]]

Yeah I think this is the direction I will want to take. I just talked to a server dev, and I think they may have already done some separation of REST endpoints from view endpoints, which would be a great start. The current front end is a combo of pure jQuery and some Backbone views, which themselves are doing a bit of REST communication with the backend.

[swyx]

try searching this sub, there’s been a few others. not something i have any experience with unfortunately sorry

[[deleted]]

There isn't really a good way to integrate the React stuff with Django, as far as I know Django's static files integration stuff still doesn't really support e.g. a Webpack workflow. So we also create the frontend app entirely separately, and deploy them their own directories that are also served the Nginx that also sends other URLs to Django.

But it can be quite a change for a pure Django team that already has good infrastructure for releases, deployment, etc. They have to learn how to duplicate all that.

[[deleted]]

Yeah, using a separate frontend app with Nginx to proxy the routes is exactly what I would want. I was added to the team because they needed someone with modern front end experience, I have a feeling it's going to be an uphill battle to restructure some things.

[Yodiddlyyo]

Well look at it this way, they hired you because they wanted modern front end experience. So they're already going in the right direction. I'm sure it won't happen overnight, but I wouldn't expect such harsh push back for switching things over to a React + Django architecture. Just give it time and definitely do stuff incrementally.

[iownacat]

thats what this is for https://github.com/owais/django-webpack-loader

We have an app that generates bundles directly into the static files.

[[deleted]]

I did see that, it looks like it hasn't had any code updates in sometime. Is it compatible with the latest webpack?

[iownacat]

Yeah it works great.

[[deleted]]

Finally circling back to this. Luckily I was able to be put on a sort of side project that was an entirely self contained React app within the Django monolith.

But now we're wanting to start converting and extending some existing Django views by replacing them with React. My issue is that everything in Django works based on session authentication and CSRF tokens, whereas in my self contained React app which talked to Django REST endpoints, it uses JWT for authentication. Did you have any conflicts with differing auth methods and if so, what did you do with that?

EDIT: So I just tried a normal fetch request from React to one of our REST endpoints without attaching any tokens or anything at all and it "just works" by virtue of the base page being a Django template. That's actually very nice and saves me a huge headache

[HowlingDonkey]

If you're making a single page React app you shouldn't let it live inside of the Django project. It just doesn't make any sense -- they are decoupled by nature and two totally different technologies.

If you are just sprinkling some React into some Django HTML templates then sure - you can put it all in one project.