By
@AidenHammy
can't believe the universe has a REST API and considering i already pay for internet, using ALL of it only felt right. i yearn for the cosmos so the masculine urge to fetch the observable universe was less of a choice and more of a foregone conclusion.. aha- you get me right...?
a NASA APOD (Astronomy Picture of the Day) viewer, built plain HTML/CSS/JS + Vite because I like typing npm run dev and feeling official. Now, you might be asking, what does it do? pick any date since June 1995 and see the actual picture NASA published that day plus the write-up! You can flip day by day, jump to today, hit random and get flung somewhere in the archive or browse a full month at once instead of clicking next-day forever. There’s an “on this day” strip that pulls the same date across past years too which turned out cooler than I expected when I first sketched it. And a logbook so you can save entries you like, persisted in local storage. No account, no backend, just sitting quietly in your browser! not perfect yet, still stuff I’d like to poke at but it works, atleast it does what it says it does!
30m 3s logged
There’s not much coming to my mind on where to go from here so instead I went in to style.css to fix text truncation. Well.. I accidentally ended up tweaking basically everything. I added new easing functions, cleaned up button styling and fixed a stupid transition typo. While I was at it I gave the media box a custom cursor and added some hover/scale/rotation animations. I also polished the logbook, lightbox and gave the archive cards a little more life! Also fixed a few tiny compatibility and sizing things while I was there. DIdn’t do much but that’s something. Probably my final devlog before shipping
6h 31m 12s logged
Okay so update from the last one where I was basically just doing CSS and hoping for the best. Turns out trusting the process was, in fact, the move because somehow I went from “vague brass and navy colors on a div” to an entire working site. I genuinely didn’t expect to get here especially with college still eating my whole week.
The NASA API stuff is finally hooked up and actually works now not just “works in theory” but actually pulling real pictures for real dates. Prev/next day, jumping to today, random date, all of it fetches properly. There’s a whole archive view now too where you can browse a full month at once instead of clicking one day at a time forever and an “on this day” strip that shows the same date from past years which honestly turned out way cooler than I expected!
Also added a logbook thing so you can save entries you like and they stick around in localStorage. No backend, no login, just quietly sitting in your browser. Feels good having something that persists without having to build a whole account system for a side project. ALso uh, I spent an embarrassing amount of time on tiny details that probably nobody will consciously notice but me.. a little reticle cursor over the image instead of the default pointer, a custom loading animation instead of a plain spinner, a weird little rotated stamp on the corner of each plate that just says “field log” because I thought it was cute. None of it needed to exist BUT all of it exists anyway.
Still caught a genuinely embarrassing amount of bugs going through it though. Had a straight up syntax error sitting in my object literal for who knows how long, had the archive endpoint pointed at a fetch() call instead of an actual url string and had a whole render function that hid the plate right after trying to show it so nothing ever displayed and I could not figure out why for a long time. Felt very smart once I found each one and very stupid for how long it took.
Still following the “learn it from a tutorial not from AI” thing I keep telling myself and it’s actually paying off! I can explain almost every part of this now instead of just going “uh, it works, don’t ask me why” Not fully done yet, still want to poke at a couple things. That’s it for this one. Back to pretending I don’t have an assignment due tomorrow (I actually have 3).
Also, quick note on why this is one giant entry instead of three; most of this stretch was JS work and the CSS barely moved while I was doing it. Didn’t feel like there was a real “here’s a visual update” moment to split off on its own so instead of forcing three thin entries out of what was really one continuous push on the JS side, I just let it be one entry that covers all of it, hope that makes sense!
1h 19m 10s logged
College has been eating up most of my time lately so I haven’t been able to work on Asterism as much as I’d like. Still, I’ve been squeezing in about 5–10 minutes whenever I can. It doesn’t sound like much but I keep telling myself that something is better than nothing. Hopefully that’s true in my case too. Most of the progress has been on the CSS. Nothing groundbreaking yet but it’s taking shape, I think..? It’s still very much a work in progress and honestly… I’m kind of figuring things out as I go. I’m not entirely sure where this project is heading aesthetically but I’m trusting the process. Sometimes you just have to keep building until everything starts clicking into place. That’s pretty much it for this devlog. I wish I had more exciting things to share but college has completely drained me. I’m absolutely exhausted and my brain has officially stopped producing coherent thoughts. Hopefully the next update will have more than just CSS tweaks and maybe even some NASA API magic (hopefully x2)
2h 20m 13s logged
Renamed the project to Asterism mostly because I didn’t want to keep looking at “apod-site” in my file tree. I spent way longer than I expected just laying out the HTML. I kept going back and forth on whether to build the archive/logbook or wait until I actually need them and ended up just doing all of it upfront so I’m not restructuring divs later while also trying to debug JS. Not sure that was the right call, it means I have a full page of markup and literally none of it does anything YET
The JS side was easy actually. I wanted to just check the NASA API actually returns what I think it returns before touching the real page so I hacked together a quick fetch on a totally separate.
#datepicker/#app that isn’t even in my real HTML. I mean it previously did. And It worked, sort of. Proved the concept but now I have to go rip it out and rewire it to the actual elements. Also just noticed I left a require("jspdf") at the top of the file that I don’t even use. I must’ve grabbed it off some snippet while I was googling something else and forgot to delete it. That’s not going to work anyway since this is Vite/ES modules and not Node. I didn’t get to do styling at all beyond the reset so right now it’s just there. Black text on white, nothing scoped, no theme variables defined just yet
