Using Browser Router in react-router-dom with Django backend

Question

I'm building an application that uses React as front-end and Django Rest as back-end. From front-end, I'm using react-router-dom for declarative routing and Django only serves API

So when user enters an URL like this https://myapp.com/something/something-else, it's actually handle by Django and it will return an error since Django doesn't know which page to lead to with this URL. It should be handled by React instead.

One of the workaround I have is to use a Hash Router, so the URL will look like this (with the hash symbol): https://myapp.com/#/something/something-else

But there have been cases where user will just key the URL without the hash sign (as they didn't know).

Is there away to handle this without using Hash Router?

What is the reason behind Django serving URLs that are in react scope — iklinac
– iklinac, Commented Apr 17, 2020 at 5:20

Matthias · Accepted Answer · 2020-04-17 07:31:04Z

1

I can't say exactly because you haven't provided code, or an explanation of your project structure.

How are you doing a hash-router? If you have Django serving a single HTML file, then you should be able to edit your urls.py to pass any URLs that don't match the api to the same page.

As an example, I have a Django website with a Preact frontend, and I have Preact files that are built into static .js files, which are then served by Apache. Django does all URL routing and serves HTML files, which then request the Preact JS files from Apache.

answered Apr 17, 2020 at 7:31

Matthias

7377 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using Browser Router in react-router-dom with Django backend

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related