A checklist app created using React and Firebase to help with packing for camping trips.
As a camping lover, I wanted to create an app which my camping crew can use to to view, edit, and check off items as we prepare for camping. I learned and utilized Firebase to store the data which everyone can access together. It was also a great opportunity to follow best practices in organizing React components to keep the codes clean and reuseable.
- HTML5
- CSS3
- Sass
- ES6
- React
- JSX
- Firebase
- Modern, minimalist, and responsive design
- Fully accessible using only keyboards
- Semantic elements used with appropriate aria-hidden, and sr-only styling to accomodate a wide range of users
- Accessing and modiyfing database stored in Firebase
- Utilizing useEffect and useState hooks to efficiently store states and update DOM based on their updates
- React components organized following best practices
- Sass used to keep styling files organized and separated into generic styling, partials, and component-specific styling
- Automatically sort the retrieved items by their categories and names in an alphabetical order.
Clone down this repository. You will need node
and npm
installed globally on your machine.
Installation:
npm install
To Run Test Suite:
npm test
To Start Server:
npm start
To Visit App:
localhost:3000/