Weathered Clock

Bored of regular old clocks? Try the weathered clock! A new, interactive clock to give you all the information you need at a glance, including weather, air quality, temperature, and of course, time!

Comment

Inspiration

I was thinking of how every morning, I want to check the time, but also want weather and temperature information, to know what to wear. What if everything could be given in a single screen, all at once? That's where I thought to combine weather and clock into a single screen, for easy reading.

What it does

Currently, I could only manage to get the clock working, but I had planned to incorporate the weatherapi to get weather data, and add icons to show the weather and a temperature gauge too.

How I built it

Built on replit.com using a PHP web server, using javascript and php to work the clock.

Challenges I ran into

Initially, I wanted to use ElectronJS to create the app, so that the app could store the user's location on their pc, instead of having to have an open web browser to access a website. Unfortunately, I couldn't understand how to get ElectronJS to work, and had to resort to using replit.com to host a PHP web server.

Accomplishments that I'm proud of

Even though I didn't get everything to work, I'm still proud that I managed to make something in a hackathon by myself for the first time.

What I learned

It's important to understand the platform you're using before starting a hackathon, learning ElectronJS as I went was not a great experience haha. But nonetheless, I learnt a lot about ElectronJS in addition to more about NodeJS, which I'm grateful for.

What's next for Weathered Clock

Learn more about ElectronJS to port the web app over. Then incorporate the weatherapi to access weather data from cities all over the world. Additionally, would love to freshen up the styling and make it look pretty :)

Share this project:

Updates