Django ReactJS web app Icons and Images Inside Public Folder Not Showing

Question

I'm trying to deploy a small Django/ReactJS web app to heroku. I'm having an issue with the static images used as background and icons (the images folder is inside the public folder). The images do not show. However, when I deploy only the frontend part as a static app, the images show correctly. All the Django/ReactJS project I've been able to access so far have images imported inside App.js, it's not what I want to do. I want to use the urls to the images as for example:

    background: "url(/images/somemage.png)"

Website without backend: https://base-apparel-coming-soon-react.herokuapp.com/

Website with backend: https://base-apparel-coming-soon-dr.herokuapp.com/

Git repository: https://github.com/.../base-apparel-coming-soon-DRF.../

Answer 1

I figured out the solution incase it might help anyone, since I didn't find anything on the web.

In wsgi.py Instead of writing:

    application = WhiteNoise(application, root=os.path.join(BASE_DIR, 'build/static'))

write

    application = WhiteNoise(application, root=os.path.join(BASE_DIR, 'build'))