DEV Community

Discussion on: How to connect Django to ReactJs

Collapse
 
nagatodev profile image
Faruq Abdulsalam

Hello xuwenjing. Yes you can use the folder structure in your attached picture. However, note that you will need to make few changes to your settings.py file.

1) You have to use a 'path' that would point to the build directory in your frontend directory. You can find the code for that here: dev-to-uploads.s3.amazonaws.com/up...

2) Next, under the templates and static files sections., you have to change the variable BASE_DIR to the new variable REAL_BASE_DIR created in 1 above.

Templates: 'DIRS': [os.path.join(REAL_BASE_DIR, 'frontend', 'build')]
Staticfiles: STATICFILES_DIRS = [os.path.join(REAL_BASE_DIR, 'frontend', 'build', 'static')]

This ensures that Django searches for templates and static files in your frontend folder which is outside the Django directory

Collapse
 
xyzsuria profile image
xuwenjing

Thanks!
I followed the steps, but I only got a blank page: dev-to-uploads.s3.amazonaws.com/up...

The message when running : dev-to-uploads.s3.amazonaws.com/up...

Could you please have a look? Thanks for your help~

Thread Thread
 
nagatodev profile image
Faruq Abdulsalam • Edited

Hello xuwenjing,

The message displayed when running is okay. It shows that there is no issue with your code.

Regarding the blank page. Did you remember to run npm run build in your frontend directory?

Can i see your frontend directory?