Overview
PottyPal is a full-stack web application built with the MERN stack that aims to help users locate the best toilet in the area.
It has a number of features that can be easily accessed from a UI to generate a list of toilets in a particular location. The app displays the 'Potty Pal' logo, as a pins on a map with easy to read pop-ups offering information about specific toilets, including facilities, pricing and ratings.
PottyPal was built by a team of five developers who utilize Agile methodologies and a Git workflow to collaborate efficiently and deliver high-quality code on time. This is the final project of Makers coding bootcamp.
Tech stacks
ReactJS, MongoDB, ExpressJS, TailwindCSS, Cypress, Jest, Agile methodology
Other Links
Task
Without any code base, we have to decide which tech stack we will use in this project and complete the application with a presentation in 9 days.
User stories
- User should be able to view toilets on a map
- User should be able to add reviews to each toilet
- User should be able to add new toilets with name, price, features and address
- User should be able to log in, sign up, log out
- User should be able to upload photos of the toilet
Challenge
All decisions were made by our own We had to make all the technical and design decisions without external guidance or supervision. This required us to rely on their own knowledge and expertise to make decisions that would affect the success of the project. This challenged us to think critically and work collaboratively to ensure that the project was successful.
Extremely tight schedule We had only 9 days to complete the entire project, from ideation to deployment. This meant that us had to work quickly and efficiently to meet the deadline. To achieve this, us had to be highly organized and communicate effectively to ensure that everyone was working towards the same goal.
Presentation is part of the project We faced a challenging project with a limited timeframe of only 9 days to complete the app. In addition, we had to allocate extra time to prepare a presentation that showcased the features and functionality of the app. The presentation was an important component of the project, as it helped us to demonstrate the value of the app to potential users or employers. However, the tight schedule made it difficult for us to manage our time efficiently, and the need to prepare a high-quality presentation added an extra layer of complexity to the project.
Approach
MVP first approach We followed a minimum viable product (MVP) approach, where they focused on building the core features of the app first and then gradually added additional features. This approach allowed us to prioritize the most important features and ensure that the app was functional and user-friendly. us worked collaboratively to identify the core features and create a roadmap for the development process.
Test, test and test We prioritized testing throughout the development process to ensure high test coverage and reduce the likelihood of bugs or errors in the final product. This approach helped us to identify and resolve issues early in the development process, which saved time and ensured that the app was of high quality. We utilized automated testing tools like Cypress and Jest, as well as manual testing, to thoroughly test the app.
Agile team with agreed working practices We utilized Agile methodologies, such as daily stand-up meetings, sprint planning and retrospectives, to ensure efficient collaboration and timely delivery of high-quality code. This approach helped us to work together effectively and stay on track towards achieving the project's goals. us worked collaboratively and communicated frequently to ensure that everyone was aligned with the project's vision and goals.
Result
We successfully finished this full-stack app in 9 days with high test coverage. We are proud of what we have achived in this short period of time. And the app has also been deployed online so that we can demonstrate it to our friends, families and potential employers.
What I've learnt
Feature-first methodology We learned the importance of prioritizing core features and building the application incrementally. This approach helped us to focus on the most important features and ensure that the app was functional and user-friendly. us worked collaboratively to identify the core features and create a roadmap for the development process.
MVP is the key We realized that focusing on the MVP first and adding additional features gradually is an effective way to build a functional and robust application. This approach allowed us to ensure that the app was of high quality and met the needs of its users. us were able to build a strong foundation for the app and gradually add new features based on user feedback.
Diagram helps communication We found that visual diagrams, such as flowcharts and wireframes, were helpful in communicating design decisions and ensuring everyone was on the same page. This approach helped us to ensure that everyone had a clear understanding of the project's goals and vision. us were able to collaborate effectively and ensure that the app was of high quality and met the needs of its users.
