Space Pulse 1st & Final Devlog

Space Pulse is my personal browser dashboard made with HTML, CSS, and JS. All the cool links I have on my bookmarks, my notes, the awesome NASA APOD, and my mini-game are all mashed into one neat dashboard.

On the first commit, it was too busy and generic, so I changed some stuff up. In the second iteration, I made it my way: minimalistic, no quick-checks, and only what I need on a daily basis. Added light/dark mode, persistent notes and links, and made it responsive.

I added NASA APOD API as a cool feature and made it a server-side request so nobody can steal my NASA token. The big thing I added was the Hyperion Space Defender game. I gave it a nice Play Game screen, made it have instructions for the WASD keys and arrow keys to move, the window is draggable and resizable, and even a first-time tutorial that gets saved with localStorage.

In order to hook the game up to the dashboard, I used postMessage() to get the score, the high score, the number of sessions, the last time the game was played, and the total playtime. The hard parts about this project were getting the iframe game to communicate with the parent window, keeping the stats persistent, not letting the game count playtime if it was closed accidentally, securing the NASA API request, and figuring out what features are needed and what’s not.

This was a big project for me because I learned the importance of state, persistence, APIs, security, debugging, responsiveness, and some neat little UX features in a website. Space Pulse is the final product of all the lessons I’ve learned while making it.