Topic(s): HTML, CSS, Javascript, Hackathons
A web applciation that tracks water intake and much more.
This was a web application that I created during Liquid Hacks (a hackathon hosted by the esports organization: Team Liquid) to promote mental health. This web application tracks water intake, sends reminders, provides inspirational League of Legends Quotes, and plays Animal Crossing music.
This project was fun, especially because I made it during a hackathon. This was my first hackathon and I definitely recommend that people attend a hackathon if possible. You get to meet like minded people and can challenge yourself to build a project within a short time frame. There's also the opportunity to connect with future employers and learn from workshop panels. Unfortunately I didn't win the hackathon, but I did win the rapping mini-event.
The project is essentially a web app that tracks water intake with a few other added goodies such as: reminders, inspirational League of Legends quotes, and Animal Crossing background music. It was built using HTML, CSS, and javascript. I had used these technologies before, but it had been a while since I've used them for a project. Luckily there was a workshop panel hosted by Hack Club which served as a nice refresher for my HTML and CSS.
The main challenges that I had to deal with was re-learning javascript and learning how to use API calls. A specific issue that I ran into was that Google Chrome does not auto playing music. I was never able to find a solution to that issue, but let me tell you that it was a night filled with Googling and a lot of milk tea.
As a result of this project, I learned how to use an API with javascript. This was my first time using an API and first time attending a hackathon, so I would say this was a successful project.
Hopefully in the future I can turn this into a Google Chrome extension and maybe have the music auto play to a specific time zone like in the Animal Crossing games.