CODEWITHSUNDEEP
djangoreactjswebpack
Xceptions
Xceptions

Reputation: 353

Django and Reactjs

I'm new to react js and I've seen a lot of write-ups on using react and Django using django-webpack-loader and webpack-bundle-tracker and I must say that I've followed them but no success. First of all, I'm confused. Which server do I run? 

py manage.py runserver

Or

webpack --config webpack-config.js -watch

What does django-webpack-loader do?

I don't even know if I've asked all the questions I should ask. All I know is that I've not been successful in linking them

Upvotes: 1

Views: 828

Answers (1)

Vinit Raj
Vinit Raj

Reputation: 1910

I was in the same situation months back, As much I concluded from Your problem, I guess you are struggling to setup Django with React. I would like to share my implementation(it is a standard one everyone recommends to use it.)

Follow These Steps accordingly:-

  1. Separate your Frontend with your Backend, What this means is You need to prepare the REST API as your backend Do not use Django templates just make a Restful API which returns some JSON data in every method of your views.py.You can Use DJANGO REST FRAMEWORK for making rest-API,it provides lots of functionalities,You will also need to install CORS-HEADERS by doing pip install django-cors-headers and update your INSTALLED_APPS in settings.py by:-

    INSTALLED_APPS = [
.......,
.......
'corsheaders', 
]

    The whole purpose of cors headers is to allow to make a request which is not running on the same origin. Since your frontend is on a different port from your backend.

  2. As soon you finish with your API, Now make your frontend with React to call the API whenever you need.

  3. The api server will be running on something like http://localhost:8000 and frontend server will run http://localhost:8080.

  4. So You have to visit the port no. 8080 to view the app.and to see the endpoints of the API you need to visit port no. 8000

  5. You can see one of my project Django React Blog that how to maintain react with Django, that can also help you.

Please Raise your doubts if any, though I will suggest to follow this architecture because this will remains the same whether you switch your backend framework or frontend framework, Do let me know if something is wrong in it

Upvotes: 2

Related Questions