You are browsing as a guest. Sign up (or log in) to start making projects!

Ship #1

I built SpaceView, an interactive web dashboard with NASA Astronomy Picture of the Day (APOD) alongside a live, 3D tracker of the International Space Station (ISS) orbiting a 3D Earth built in ’ three.js’ . Originally, I planned to cram four different grid sections packed with various NASA APIs into the app. But after building the first two, I realized it felt way too cluttered for a V1.

The UI and styling was a wild ride. For the first few days, I was going crazy with CSS grid properties. I completely scrapped my base UI to try pure CSS, but eventually realized I needed to scale up and rebuilt the whole thing using Tailwind CSS. Beyond that, figuring out the ISS orbit calculations using just latitude and longitude from the API involved a surprising amount of math.

To test it out, just hit the live demo link! The layout is fully responsive, so try it out on desktop or mobile. Make sure to play around with the 3D Earth…

Try project → See source code →
Open comments for this post

2h 24m 34s logged

Devlog #4 – Slowly Coming Together

Today’s APOD was way too good… .
Spent most of the time redesigning the ISS object and figuring out the orbit calculations using the latitude and longitude from the API. There was a surprising amount of math involved, but it’s finally working. Still need to add proper error handling though—right now it just assumes everything goes perfectly (which APIs never do ).

Originally, I wanted this dashboard to have four different grid sections packed with various NASA APIs. But after building the first two rows, I realized it already feels pretty packed for a first release.
So… I’ve decided to ship with the current layout instead of cramming in more features.That doesn’t mean the other APIs are getting dropped though. Once this version is out, I’ll keep expanding the dashboard and fill those extra grid spots with more APIs.
For now… ship first, build more later

0
0
56
Open comments for this post

4h 20m 4s logged

Devlog #3 – Got an Idea
For the past three days, I was going crazy with CSS and all its properties. Now I’ve decided to shift to Tailwind CSS.
I’ve also decided to scale this project beyond the original guide after discovering some really interesting NASA APIs that I want to integrate.

To kick off the implementation, I replaced the existing layout with display: grid and built the first grid for today using Three.js. I learned the beginner-level concepts first, then spent some time with the documentation before building this from scratch.
The feature is about halfway complete and currently involves a revolving Earth using the texture from NASA’s famous Blue Marble image.

1
0
102
Open comments for this post

1h 43m 41s logged

Devlog -2

I have heard styling is hard, but today I actually felt it.
Manually styled the entire webpage using raw CSS. No Tailwind, no Bootstrap—just pure CSS. Seeing the elements render all colourful on hot reload is such an awesome feeling.
The temptation (and addiction 😭) to keep styling forever is actually real…
Next devlog might be on styling again ig 😅

0
0
68
Open comments for this post

1h 20m 20s logged

The viteee!!!

Setting up the project and learning how vite works took a lot of time but Worth it!!
70% of the total time went into history ,development and working of vite and other bundlers like webpack ,Rollup etc… Rest I spent in scripting part of the project
That’s it for today. Learned a lot more than I coded…

0
0
21

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…