Refactor spa prototype

[asherlloyd]

Since we've chosen the React SPA approach, let's clean up the prototype some.

• Rename Prototype directory
• Switch to Yarn, here's why
• Integrate Django templates with the build process
• Implement basic API interactions

[asherlloyd]

Integrated with Django project. @Soyokaze-42 I suspect the way I have incorporated the React app into the Django site will need to change at some point. Feel free to contest any of the changes I've made here.

[Soyokaze-42]

@asherlloyd There were a few urls for the django project that were being overwritten. We can still use the admin pages and the in-built authentication. It sounds like we are going to eventually replace the auth pages, but the admin is here to stay and will need the /admin url. Current urls used by Django: debug/, api-auth/, admin/, accounts/, and api/.

[Soyokaze-42]

Would it be possible to move main.html to prayerapp/templates/prayerapp instead of static/app in yarn build? Django templating can get into trouble with naming things the same as modules that we might install, so we have to be careful here. That is why this directory is named oddly. If that is possible, we should:

• load prayerapp/main.html as the template in the index view
• delete prayerapp/templates/prayerapp/index.html
• remove the setting TEMPLATES DIRS BASE_DIR / "prayerapp/static/app"

[asherlloyd]

@Soyokaze-42 yes, it can be done. I'll modify the React build to account for these changes.

[asherlloyd]

@Soyokaze-42 slightly different approach taken:

• prayerapp/index.html for the index view template, as before, rather than main.html
• removed the TEMPLATES.BASE_DIR option that referenced the static folder, removing that dependency.

[Soyokaze-42]

I haven't built out a test deployment yet, but I felt like there was something up with the static files and Django. Static files and templates work similarly to avoid name collisions, so I updated this to follow the best practices in the Django docs: https://docs.djangoproject.com/en/5.0/howto/static-files/

Now we won't have to worry about name collisions and we can host all out static assets with the rest of the Django apps we have installed.

There is a little templating in there that might mess with React. Django likes to host static content separately (as it should). It stores the location of all the static assets in the config and then the urls are rendered with the template. This way we can move the static assets wherever we want and only have to change one line in the config. I will feel comfortable with that once I see the static content in NGINX and the pages without unbroken links.

[asherlloyd]

@Soyokaze-42 if there's nothing else, think we can merge this?

[Soyokaze-42]

Yeah. It is going to take me some time to set up a test deployment. I don't want to hold you guys up anymore while I'm unsure of the deployment.