-
-
dailyHabt logo
-
page view of dailyHabt with information
Inspiration
When given the theme “health” less than two weeks into the new year, we were reminded of all the healthy resolutions we had already broken. So we created this app to help us get back on track. Healthy habits can start at any time, so the streak feature can help us celebrate small wins to work towards our goals.
What it does
dailyHabt allows a user to create a new habit to track. Once created, the user can click on the grid-style habit display to toggle a grid tile and mark the habit as "completed" for the day. Once complete, the grid tile turns green. As the user begins to track more habits, the grid display will fill up with green, completed tiles. Additionally, the streak counting feature shows the user their current habit streak. Both of these features encourage users to maintain their habits by not breaking their streak and by filling the grid with green tiles.
How we built it
We coded dailyHabt using JavaScript. The technologies used include React, MongoDB, and Express.js
Challenges we ran into
We encountered some challenges while bringing dailyHabt to life. One common challenge was running React/Node/MongoDB. These tools were incredibly helpful but we often encountered small bugs when trying to run our app locally on our own computers.
Another challenge was the streak tracker. It was undoubtedly the most difficult feature to implement, but we all learned a lot from working on it together.
Finally, we were hesitant to commit to too much at first when planning our method of approach for this hackathon. When the theme was released, we tried to be realistic in what we could accomplish in the allotted time. Each member reflected on the skills they could contribute to the project, and, though challenging, we feel we were able to meet all the goals we set for ourselves during this hackathon.
Accomplishments that we're proud of
We are proud of the final product we have created. The backend and frontend components were successfully integrated and our largest goals were accomplished. We have each contributed something from our strengths, whether that be code, logic, design, organization, or write-ups. Finally, we're proud to have completed our web app and had a lot of fun working on it!
What we learned
We learned many things throughout this process. We learned to work with a team and strengthened our communication skills. On a related note, we learned a great deal about using version control to work together through Git/GitHub. It was everyone's first time participating in a hackathon, so we did not know what to expect and learned a lot in the process. We learned to split responsibilities, share resources, help each other debug issues in code, and communicate progress to facilitate productivity. We also improved our skills in JavaScript, React, CSS/HTML, Express, and MongoDB.
What's next for dailyHabt
The future improvements for dailyHabt are endless! We think two additional "Views" for the page would be helpful: Daily View and Habit View. Daily View would allow a user to view all the habits associated with a specific day. Habit View would let users view all tracked data for a certain habit (ie. complete, incomplete) for a certain habit, including all dates associated with the habit. Both views would open these additional details in a popup window or a separate browser window.
The most exciting improvement we thought of was a "Connect" or social aspect to dailyHabt. In this feature, users would be able to add friends, post their habit behaviors and streaks to their profile feed, and like or comment on their friends' posts. Friends could even send a push notification or message to each other to encourage each other to keep up their streaks and maintain their daily habits. We think this would be an enticing way to encourage users to keep up with their goals and continue improving their lives.
Log in or sign up for Devpost to join the conversation.