ZeroWaste-Q

• 

  Landing Page

• 

  Sign up page

• 

  Login page

• 

  Daily progress log

• 

  Firebase database

• 

  Leaderboard showing top three players

• 

  List of user's challenges

• 

  Progress chart

Inspiration

We were inspired by wanting to help the environment. Seeing a lot of waste and pollution, we thought about making something that could guide people to live in a way that's better for the environment.

What it does

Our website, ZeroWaste-Q, when completed, has challenges to help people reduce waste. You can try things like using less plastic, saving energy, or buying local. The website gives you clear steps and a place to share your progress with others.

How we built it

We made ZeroWaste-Q using Nextjs, Typescript, tailwindcss. The information you share is kept safe using Firestore database.

Challenges we ran into

Figuring out how to use "useContext" was a bit tricky. We're still having some problems with it, but we're working hard to make it better. Also, we're trying to track users' progress and make a way for them to show proof when they finish a task. We hope to fix these things soon to make the experience smoother for everyone.

Accomplishments that we're proud of

We're happy that we were able to get some major features work. Maybe not all, but some. Making the website look good and work well was a big achievement for us.

What we learned

While making ZeroWaste-Q, we learned how important it is to make things simple for everyone. We also learned about keeping data safe can make a big difference.

What's next for ZeroWaste-Q

We want to add more fun challenges and make the website even better. We're thinking about making it more like a game, and we want to work with groups that care about the environment. We hope more people join and make a positive impact.

Built With

• firebase
• firestore
• nextjs
• shadcn
• typescript