See GitHub Repository
See Live Preview

This project is the final part of my first module with Code Academy Berlin. The goal is to learn to use React with React Router, Hooks, and Context. We learned to implement user login using Firebase Auth and document storage functionality with Firestore.

I used the D&D 5e SRD API which holds information about various aspects of the Dungeons and Dragons tabletop game to create an "explore" menu, which can be treated like a Dungeons & Dragons wiki.

If a user creates an account, they can then save items from the explore pages and view them in a favourites list. I've also attempted to create a character build function. The result is a very basic character, built using a combination of user input and API fetch results.

Users can also delete items from their characters or favourites lists, or delete their account and all linked collections entirely.

I intended the view to be "mobile-first", which explains the stretched view. It looks best in a narrow viewport. Changes to the API data schema has broken some functionality. D&D character generation is an idea I would like to revisit for a larger-scale project in the future, so I will not fix this code for now.

This project taught me about authentication and related security concerns, database design and document schemas, and very much emphasised the importance of code reusability.