- When the user is at the homepage, they can choose to play the quote trivia game or go to the study hall to look up a specific character's quotes from the films.
- On the Game page, a random quote is populated and the user must select which LOTR character they think said the quote.
- The user will be notified whether their guess was correct or not, then a new quote will appear with new choices.
- In the Study Hall, the user can scroll through a list of quotable characters from the films.
- The user can click on any of these characters and that character's quotes will be populated.
- The user can click on any of the characters quotes to save them to their favorites.
- The favorites section is accessible through the Study Hall via the Favorites button.
- On the Favorites Page, the user will see their favorited quotes and can unfavorite them by clicking on them while on the favorites page.
Check out the app here
or
Copy and Paste this into your terminal
git clone [email protected]:NickLiggett/WhoSaidThat-LOTR.git
cd WhoSaidThat-LOTR
npm i
npm start
- CAUTION! If you choose the local setup, you will need to visit this website and request an API key. Once you have it, visit this website to find out how to hide you're API key if you want to push it to GitHub.
- React
- XML
- CSS
- VSCode
- Router
- Cypress
- This project, I particularly wanted to make a mobile compatable app.
- The API used for this pro app only allows 100 network requests per 10 minutes. I could've made all my network requests in some main component and pass them down as props but I wanted to prioritize being able to maintain data on a page refresh (hence the fetch calls in App, Library, and Game components). I could not figure out a good solution to this besides using a custom made API without network request limits.
- The API used for this project has an end point for all characters (including the LOTR books) and an end point for all quotes from the films.
- This became a problem when populating the characters in the library because the API was giving me over 200 characters, only about 40 of which had quotes.
- I count my cleanup function that returns only characters with lines as a win.
- Add character images to the Library/Study Hall
- Have green text for favorited quotes persist through page navigation