Puzzlrs allows people who love puzzles to trade amongst each other. As puzzlrs ourselves, we identified a shared experience: who wants to do a puzzle more than once? We all related to having multiple 'gently used' puzzles gathering dust in our homes while we were out buying new every time. We set out to provide an alternative, more sustainable solution. We envisioned a circuit of puzzles being sent around amongst a community of puzzle lovers. It's a win-win: everyone gets to enjoy doing new puzzles and there is less waste. And we all have emptier cabinets.
With puzzlrs, users can log in and upload their own puzzles available for trade. They can view the full list and filter by metrics like category, piece count, and quality. By clicking any given puzzle, they can request a trade. Whoever's puzzle is being requested then receives an email. Via their user profile, they can see all puzzles they've listed, any requests they've sent, and they can accept or deny any requests they've received.
This application was created in just 2 weeks by a team of 3 front-end and 2 back-end students for our capstone project at Turing School of Software & Design.
To view in browser:
- Visit the deployment link above
To run locally:
- Clone this repo down to your local machine: here
- On the command line, type:
npm install
- On the command line, type:
npm start
- Visit
http://localhost:3000/
Scroll down for screenshots:
- Home Page
- View Puzzles Page
- Add Puzzle Form
- User Profile
- Received Emails
- Error Handling
- Responsive Design
- A requirement for this project was that we self-teach and use a technology we had not used before. We decided to implement TypeScript. One key win was our ability to learn TypeScript in a very short period of time and use it within a complex web application.
- We also used React' Context API and this made for a fairly streamlined data model.
- It was a great experience using React's MUI library for beautiful, standardized components.
- Being able to give the user the ability to upload photos with Cloudinary API was another win that made this project successful.
- As stated above, we challenged ourselves to implement TypeScript. This came with a healthy dose of challenges. Certain processes and features took longer than originally planned. Because we were learning as we went, we feel we would have planned differently from the beginning in terms of data flow and structure had we been more familiar with the intricacies of typed JavaScript.
- Implement ability to create an account and use authuntication to log in as a user. Currently this application is set up more as a prototype with preset users, populated from a dropdown.
- Refine functionality so that a user cannot request their own puzzle.
- Add more user-user communication features:
- Build out request mechanic so that requestor can include a puzzle they are suggesting as a trade
- Add messaging between users once request is accepted
Carly Collums GH | Kyra Bergsund GH | Ricardo Tovar GH |