I have a React App with a Django rest framework backend. I ran the build command and merged the react app. The react app had an images folder inside the public folder that had some logos and photos that I used during the frontend development. Now after running the build and rendering the site from Django it is unable to render the images. The folder images is present inside the build folder that react gives. Below are my configurations and settings.
project structure
┣ build
┃ ┣ images
┃ ┃ ┣ footer-logo.svg
┃ ┃ ┣ hero_illustration_student_register.svg
┃ ┃ ┣ logo_favicon.svg
┃ ┃ ┣ logo_name_header.svg
┃ ┃ ┣ only-logo.svg
┃ ┃ ┣ quote-left-solid.svg
┃ ┃ ┣ quote-right-solid.svg
┃ ┃ ┣ service_student_teacher.svg
┃ ┃ ┣ student.svg
┃ ┃ ┗ Teacher.svg
┃ ┣ static
┃ ┃ ┣ css
┃ ┃ ┃ ┣ main.701fe633.css
┃ ┃ ┃ ┗ main.701fe633.css.map
┃ ┃ ┗ js
┃ ┃ ┃ ┣ main.492ffbea.js
┃ ┃ ┃ ┣ main.492ffbea.js.LICENSE.txt
┃ ┃ ┃ ┗ main.492ffbea.js.map
┃ ┣ asset-manifest.json
┃ ┣ index.html
┃ ┣ manifest.json
┃ ┗ robots.txt
┣ schoolies
┃ ┣ __pycache__
┃ ┃ ┣ settings.cpython-39.pyc
┃ ┃ ┣ urls.cpython-39.pyc
┃ ┃ ┣ wsgi.cpython-39.pyc
┃ ┃ ┗ __init__.cpython-39.pyc
┃ ┣ asgi.py
┃ ┣ settings.py
┃ ┣ urls.py
┃ ┣ wsgi.py
┃ ┗ __init__.py
template settings
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [
os.path.join(BASE_DIR, 'build'),
],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
static and media files settings
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'build/static'),
]
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
urls.py
urlpatterns = [
path('admin/', admin.site.urls),
path('account/', include("account.urls")),
path('teacher/', include("teacher.urls")),
path('search/', include("search.urls")),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
# This is will cath the routes in the frontend and 404 errors
urlpatterns += [re_path(r'^.*', TemplateView.as_view(template_name='index.html'))]
cmd lines after the page loads
[25/Apr/2022 17:00:27] "GET /static/css/main.701fe633.css.map HTTP/1.1" 200 38691
[25/Apr/2022 17:00:27] "GET /static/js/main.82ff440d.js.map HTTP/1.1" 200 2170125
[25/Apr/2022 17:00:27] "GET /images/hero_illustration_student_register.svg HTTP/1.1" 200 833
[25/Apr/2022 17:00:27] "GET /images/logo_name_header.svg HTTP/1.1" 200 833
[25/Apr/2022 17:00:27] "GET /images/footer-logo.svg HTTP/1.1" 200 833
[25/Apr/2022 17:00:27] "GET /manifest.json HTTP/1.1" 200 833
[25/Apr/2022 17:00:27] "GET /logo_favicon.svg HTTP/1.1" 200 833
Please suggest to me what should I do