Synergy Pulse
By
@SMD
- 6 Devlogs
- 5 Total hours
im gonna fetch all nasa's data mwahaha...
Ship #1
Pending review
I have made a pulse website, named “Synergy Pulse”, with the following features:
- Title and Logo
- Local Date and Time
- Search bar (which takes you to Google)
- 4 quick search icons (Github, LinkedIn, Instagram, Youtube)
- NASA APOD background (Using custom API key stored inside config.js folder, which’ll be gitignored)
- Footer showing the name of the NASA “image of the day”
- Live news which changes every 10-15 seconds. By clicking on its link, you can access the official news article.
- A weather widget (showing temperature in Celsius, Atmospheric conditions and co-ordinates)
- A command tasks widget to add in your to-do list
What I found most difficult, was integrating the NASA background, weather forecast and the news widgets.
I really worked hard on this project and I hope you like it! :)
31m 20s logged
As promised, I’ve managed to align all my widgets properly. The weather widget asks permission to access your location. If accepted, it shows your local temperature. If denied, it defaults to NYC weather.
Why NYC?
Well, I love NYC, the Big Apple, The City That Never Sleeps!!! Don’t ya?
Okayy ppl, so this is my last devlog before shipping! Hope you like my project! :)
57m 14s logged
Features I’ve added:
- A weather widget (showing temperature in Celsius, Atmospheric conditions and co-ordinates)
- A command tasks widget to add in your to-do list
I know my website alignment is a bit messy, I promise I’ll work on it more before shipping!
NOTE: I haven’t been able to fetch local weather data for my widget. Instead, it is set to default NYC weather. Once I figure out how to do it, I shall ship my project.
54m 48s logged
Features I’ve added:
- Title and Logo
- Local Date and Time
- Search bar (which takes you to Google)
- 4 quick search icons (Github, LinkedIn, Instagram, Youtube)
- NASA APOD background (Using custom API key stored inside config.js folder, which’ll be gitignored)
- Footer showing the name of the NASA “image of the day”
- Live news which changes every 10-15 seconds. By clicking on its link, you can access the official news article.
NOTE: I had some difficulties setting up Vite. Therefore, I decided to store my API key in a separate config.js file (.gitignore) and my pulse.html will directly access that API key and tell my JS logic () to open it and display the NASA Image of the Day.
29m 22s logged
Finished coding the html part
Now all that’s left is to put in NASA’s APOD background and code the JS logic to make my website actually work.
57m 1s logged
I finished styling my pulse website by creating grids and containers where all the buttons have to go. Once I’m done with the rest of my html coding, you’ll be able to see my website. As of now, it’s just a black screen.
52m 42s logged
For this mission, I’m building a “Pulse” website called “Synergy Pulse”. So far I haven’t made much progress with designing my webpage. I’ve had difficulties with Vite and NASA API key. So my plan is to just use NASA’s DEMO_KEY on a plain HTML+CSS+JS script. Hope that’s ok!
