advfe-unified-workspace

Advanced Front End: Creating a new React app in an existing DRF workspace

This process will allow you to create and configure a new React project within an existing Django Rest Framework workspace.


The benefits of this include:

  1. CORS will no longer be an issue as requests and responses will come from a shared base URL, both in your development and production environments.

  2. You will be able to see the terminal logs for your API while interacting with the React side of your project in development, making debugging significantly easier.

  3. You will be able to work on the development versions of both the API and the React project simultaneously.

  4. With the front and back end applications on the same domain, Cookies (containing the JSONWebToken) required for authentication will not be blocked from being set on browsers that currently have cross-site tracking protection enabled by default. This change will allow authentication and authorisation to run in these browsers without errors

When you have finished these steps, you will have a working development environment, built on the existing workspace for your DRF API, which will include a folder containing your starting React code. You will be able to run both sections of this project in separate terminals.

There are further steps for combining the two projects under one terminal for final deployment, these are in a separate document.

Up Next

We show you how to create a React app within your existing DRF project.