Project Labyrinth - https://project-labyrinth-jhs.netlify.app/

🏁 Goals:

In this week's project, we were tasked with building a project which allows a user to navigate a maze, in the form of a text-based adventure, provided by a backend in React and Redux and we have successfully completed what we set out to do.

The goal for this week was to use the API specified to build a frontend that gives the user control over what to do next. We focused on using thunks and redux to build the communication with the backend.

Overall, we found this project to be a great opportunity to practice the use of thunks, bring together different parts of React and working with fetching and posting to an API. We are very pleased with the outcome and looking forward to using the skills and knowledge we gained from this project in future endeavors.

Must-have requirements:

✅ Build a responsive page.

✅ Use Redux to store the current state of the game.

✅ Focus on the UX design and handle response delay.

✅ Use thunks to wrap the API calls.

🚧 The problem:

We started by going through the design and sketching the different components out along with the design, deciding on how to structure the app. We used a mob-programming approach, starting off by fetching from the API using thunks. Then we moved on to build the base of the code structure and building the LoadingIndicator.js using a Lottie. Then we put time and effort into styling the page and making sure everything works as it should.

If we had more time, we would have added arrows that point the player into the direction displayed. We would also have added a background song where the player is able to toggle the sound on and off.

💻 Tech stack:

React Redux CSS HTML Figma

View it live https://project-labyrinth-jhs.netlify.app/