Routing with Django and React

Question

I'm very new to working with Django and I've been relying on some tutorials to link this one to React, but the problem is that initially (when I open 127.0.0.1:8000) React loads the routes perfectly, then when I reload the page Django tries to interpret the path from urls.py and obviously can't find it.

The error is:

Page not found (404) Using the URLconf defined in memberstack.urls, Django tried these URL patterns, in this order:

admin/
api/token-auth/
core/

I hope you can help me, thanks in advance

my_project/urls.py

from django.contrib import admin
from django.urls import path, include
from rest_framework_jwt.views import obtain_jwt_token
from frontend.views import index

urlpatterns = [
    path('', include('frontend.urls')),
    path('admin/', admin.site.urls),
    path('api/token-auth/', obtain_jwt_token),
    path('core/', include('core.urls')),
]

frontend/urls.py

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index),
]

frontend/views.py

from django.shortcuts import render

def index(request):
    return render(request, 'frontend/index.html')

Harben · Accepted Answer · 2020-07-18 15:27:54Z

2

For this, you'll have to use a catch-all in order for React to handle all the routing instead of django there.

from django.urls import path, re_path
from . import views

urlpatterns = [
    path('', include('frontend.urls')),
    path('admin/', admin.site.urls),
    path('api/token-auth/', obtain_jwt_token),
    path('core/', include('core.urls')),
    re_path(r'^(?:.*)/?$', include('frontend.urls')),
]

Or

urlpatterns = [
    path('', views.index),
    re_path(r'^(?:.*)/?$', views.index)
]

I think the better practice would be to implement Django-Rest-Framework and build them separately.

answered Jul 18, 2020 at 15:27

Harben

1,8561 gold badge12 silver badges17 bronze badges

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

2 Comments

user12207614 Over a year ago

Yeah, that's what I'm thinking, I'm noticing the code is getting a little complex to handle. I'll take the advice to do it separately, anyway thank you very much (your advice worked)

Harben Over a year ago

Glad to hear it, you're very welcome. Setting up your backend with API support will just be less of a headache in the future if you want to change your frontend at some point!

Collectives™ on Stack Overflow

Routing with Django and React

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related