CivicTechJobs will be a platform to help prospective volunteers find interdisciplinary projects that will be useful for their career development while contributing to positive civic impact, and also a CMS (Content Mgmt System) for Hack for LA projects to be able to list their open roles.
Navigating to http://localhost:8000/credits returns a django error. The expected behavior is for the browser to show the credits page.
This is happening because react-router is not correctly integrated with the django backend
Django + vite static build files were not well organized
This PR does two things:
Make sure django urls are configured to route wildcard paths through react-router
Take small steps to prepare django + vite static build for eventual production deployment, by moving the static assets folder to a more conventional place (backend/frontend/static/vite_assets_dist)
Changes
Backend
Moved vite static build outputdir to backend/frontend/static/vite_assets_dist
.gitignore ignores new build folder
Adjusted settings.py to reflect move to the new static build folder
Added catch-all path to urls.py to direct non-server paths to the frontend
Added a catch-all 404 path to /api to differentiate the frontend and backend
Frontend
Fixed broken react-router links in the <FooterNav /> component
Moved <NotFound /> element to an errorElement in the Router.tsx. This is better practice than using a catch all * route.
changed the static build folder path to the new one in the vite config
Fixes # Issues:
http://localhost:8000/creditsreturns a django error. The expected behavior is for the browser to show the credits page.react-routeris not correctly integrated with the django backendThis PR does two things:
react-routerbackend/frontend/static/vite_assets_dist)Changes
Backend
backend/frontend/static/vite_assets_dist.gitignoreignores new build foldersettings.pyto reflect move to the new static build folderurls.pyto direct non-server paths to the frontend404path to/apito differentiate the frontend and backendFrontend
react-routerlinks in the<FooterNav />component<NotFound />element to anerrorElementin theRouter.tsx. This is better practice than using a catch all*route.