Inspiration
We were inspired by everyday students who are constantly studying and forgetting to plan around their work-life balance, and have come up with a web application to help students become more aware of their energy usage during a day. The goal is to help students lead more balanced lives through awarness and tracking.
What it does
RE:charge allows for users to allocate their limited energy to various tasks in their life.
- Users start with 100% battery to represent their "energy".
- Users can add categories to represent different areas in their lives, such as studying, fitness and finances.
- A user can distribute their daily energy reserve across their different areas so that they can see what's taking up their energy during a day.
- The home page shows the user their total battery, allowing one to quickly see how "drained" their battery is on that day.
- The categories overview screen gives a visual representation of their energy distribution, allowing users to see how balanced their energy use has been in that day.
How we built it
We've built the application by splitting into two teams:
- Design and Frontend
- Working with JSX and Tailwind to build, style and connect our interfaces to our backend so that users can interact with the application
- Ideating, sketching and designing screens to create a positive user experience
- Databases and Backend
- Setting up user authentication to allow for persistent storage of user data
- Implementing Express.js routes and app configuration to render pages to users
Challenges we ran into
Learning tech stacks we've never learned before was definitely a challenge we had to face. The members of our team have different skills so we had to find a way to make a cohesive project. With this being our first hackathon we did not know what to expect going in. This made it a bit more challenging to plan our project and gauge what we can get done in a short amount of time.
Accomplishments that we're proud of
Despite this is the first Hackathon for all of us, we managed to quickly learn to work with our teammates and remained focused throughout the limited time we were given, showing each of our capabilities to work as a team. We were able to persevere through the lack of knowledge and time, follow instructions, and ended up finishing creating our MVP for our application, something we should definitely be proud of accomplishing. We collaborated well as a team to create something that can help students lead balanced lives.
What we learned
We learned to work together through our different skillsets. With our different abllities we are able to combine our thoughts and knowledge of computing and test it in a real-world web app.
What's next for RE:charge
Other features that we would hope to add to RE:charge includes an onboarding page/pop-up that gives new users a small tour of the app's core features as well as an introduction to the battery-use theory that our team has developed to help students balance their school, work, and personal lives.
- Onboarding/Intro to the application and the "energy" system so users can more easily understand the purpose of the app
- Stats and tracking of your daily, weekly or monthly energy use so you can see how your energy balance is improving
- In app notifications or pop ups when a user's main "battery" is low so they can be aware they might need to step back and recharge.
Built With
- bcrypt
- express.js
- github
- htmx
- render
- sqlite
- tailwind
- tsx
- typescript
Log in or sign up for Devpost to join the conversation.