Created a vercel cron job and ISR!

Added two things - first, added Vercel ISR to all the pages and a prerender states to all of the pages. The second things is, created a custom API for vercel cron job and added its config with the cron job! This cron job will check for new planets available and sync the database.

Tasks completed -

• Added prerender states to all pages (801041c)
• Added ISR to pages (86362de)
• Created a custom vercel cron job API (d520f25)
• Added vercel.json config file with cron job (d52403e)

Added footer and bookmarks!

Found out the favicon was from project astroDaily, therefore updates it to that of this project. Also designed the footer (similar to that from project astroDaily) and added the footer to base layout. I just love that footer, thus added to this project also! And fixed some HTML errors from previous commits and prettified it too. Worked on another feature - bookmarks! Now you can bookmark you favorite planet and comeback to collections page to see them! Designed a collections page and added it to navbar. Take a look at the new collections page and bookmarks -

Tasks completed -

• Updated favicon (35a16f5)
• Designed the footer (2b58e79)
• Added footer to base layout (2b58e79)
• Fixed HTML and prettify code (fe3f7ec)
• Added bookmarks to lib (265ae60)
• Designed the bookmarks (collection) page && Added bookmark button to planet page and collections page link to navbar(e22e9d3)

Added the similar planets section!

I worked on the planets similarity by factors such as planet type and habitibily percentage - and created a custom supabase function. And then created a section in planet passport page frontend by calling the similar planets in frontmatter and then mapping it inside HTML. Working on other features! Nothing much to day about. Take a look -

Tasks completd -

• Added get_similar_planets function (0660029)
• Added similar planets section (a38ea53)

Designed another page “systems”!

Worked on another page ‘systems’ which basically contains a network of exoplanet systems show beautifully on canvas - planets as nodes connected with their respective stars! And all those together create a network of systems. It was really tough and could have been possible to made without claude’s assistance. It took too much time just for a canvas! But the result is extremely good. There are three other boxes which show the no. of systems shown, planets shown and the nearest planet system. There are buttons to filter the planets based on their distance but I have to figure it out its working. The default distance is set to 2000 ly and 1000 planets are shown (supabse max rows returned limit).

Task completed -

• Design the systems page (2a5092d)

Designed the timeline page!

Yet another big devlog! Worked on the new timeline page and it has got some cool look! It consists of 2 sections - discoveries per year, where you can filter it by discovery method and view the year-wise discovery graph. Also, you can click any column to list the planets discovered in that particular year. Another section consists of planets disovered per discovery method shown in a bar chart. Take a look at newly added things -

Task completed -

• Updated project dependencies (a67ce01)
• Fixed tailwind css on several pages/components (51a7d93)
• Added the new timeline page (36036b8)

Added planet location map!

This is definitely the biggest devlog… Worked on a big thing not that big actually. Added the planet location section where you can see the planet’s location on the canvas like a map with co-ordinates. No words, just take a look at it. Also, updated the icons so that it can be color dynamic or change the color depending on the parent element and fixed the icon component where the icon path was not resolved. And added the icons to the index page and the atlas page!

Task completed -

• Updated icons with fill as current color (3fde803)
• Fix icon path in the icons.astro component (99cb0d1)
• Added icons to the index and planet page (e3974b7)
• Designed the sky map section for the planet page (0d34a67)

Added host star section!

Well completed the host star section but still there are bugs that need to be resolved. However UI is completed and here its is. It has the canvas which shows the host star with a different color with respect to its temperature! And also, it has information like spectral type, temperature, radius and name ofcourse. Also fixed some styling on the page! There are a lot of features in my mind that I just feel to add everthing together, but it will become a big devlog. Nvm, will devlog after every new feature!

Task completed -

• Add host star section && Change css to tailwind (dceee05)

Added orbit period comparision!

Added another section in the planet page, where you can see how much time 1 orbit takes, its speed compared to earth, and your age there, along with a canvas which shows comparision between the ornits of the earth and the planet by plotting them inside an orbit around the star. Also, deployed the website on vercel and fixed the padding on the base layout page. Worked on the a new section but it has errors, so showing only the working section. Will soon update about the another section in the next devlog.

Tasks completed -

• Deploy to vercel (c1a2d82)
• Fix padding on base layout (5d686a0)
• Add orbit section to planet page (7ba5746)

Designed the planet page!

Designed the planet page or the main page that will caontain all the details about the planet! I have added everything I could think of. It contains habitability, mass, distance, radius, ESI Score, and discovery year. It also has the size comparision between earth, neptune, jupiter and the exo-planet itself. And also, a light transit curve animations is there! And the bonus includes your weight calculator on the planet. The gravity is calculated from the mass and radius of the exo-planet and if not there it shows estimation. Also fixed the planet card, habitability percent width showing full and changed rocky plant type color. Take a look at the page -

Tasks completed -

• Change rocky planet type color && Fix habitability % width (b349ca7)
• Design the planet page (ae190d6)

Worked on Atlas!

Working on the atlas page showed me, where I stand. Got tired working on the Atlas page, moreover the search wasnt working on the atlas page, and I thought that I did something wrong. I tried to figure out the cause why was the atlas page not working. And after checking supabase, API, I got no clue. Therefore, I asked claude and I came to know that my API was static thats why it wasnt picking up the params from the URL. And thus, the search page also malfunctioned. However, I also came to know that there was some error on the ESI score due to which even unknown planets were shown with 100% scores. Thus fixed that so that only planets with known types get a proper ESI score.

Tasks completed -

• Fix API; add SSR to the planets API (f74b6f0)
• Design the Atlas page (a492e71)
• Changed planet type to any with highest habitability % (9cb9c4f)

Started with the UI!

I have started with main page page of the website, the index page. And I think looks cool. I am completly inspired by the vercel’s Geist design system and I think the page also looks cool. For now it consists of hero section with two buttons and another section consisting of three top planets (they are preview cards just like the preview APOD cards from my astroDaily project) as same as earth. And also, designed the navbar completely inspired from astroDaily project. Working on the atlas page now!

Tasks completed -

• Add vercel typography to css (c6c2ca2)
• Design the navbar (de41a1c)
• Added navbar and props for title and description to base layout (79797e5)
• Design the index page and hero section (fb9bbba)
• Design the planet card (f2de0ac)

Created supabase functions

I have much time today to work on the project, and I have started by creating 3 new supabase/sql functions - get_planet_by_slug, get_planets, and get_random_planet. Then I created a new API endpoint to search for the planets by using these supabase functions. And then I moved on to UI, work in progress and will be updating it soon! Found 1 typo inside astro config-astro.config.mjs and also updated the dependencies and upgraded to latest bun version.

Tasks completed -

• Create supabase functions (5464df5)
• Add search planets API (28cc457)
• Update dependencies && upgrade bun (b352585)
• Fix typo inside astro config file (229c205)

Add theme, assets, and layout

Today I configured the tailwindcss configuration file for the custom theme and also added the color, and font varaibles to the global css file. Also, added the Geist fonts - regular, monospace, and pixel using the new Astro v6 fonts API! All the font files are in the src/assets/fonts. And also added the Geist icon set along with that. All tge icon files are stored under the src/assets/icons directory, and created a custom astro components for using that icons. And also created the base astro layout.

Tasks completed -

• Add tailwind config and custom tailwind theme (d3e619c)
• Add geist fonts (d3e619c)
• Add geist icons and its astro component (bf105d6)
• Add astro base layout (e41c8b2)

Designed the logo banner and UI design system

I designed the logo/favicon for the website and the banner/og image in figma. Also worked on the UI design system putrely inspired by Vercel and my another project astroDaily. It consists of the same fonts as verecl - the Geist font and has the same color system as of vercel. Here is the newly UI design system.

Tasks completed -

• Designed the logo/favicon and banner/og image (27d4bbc)
• Decided the UI system and color palette

Started the project!

Started with the new project - exoplanet collection. It will be a webpage with the collection and information about various exoplanets. I have kept the tech stack simple and fast = Astro JS + Bun + Tailwind + Supabase. Started with creation of the project, then added typescript and tailwindcss. Afterwards, setup database in supabse, added supabase libraries, and created a re-usable supabase client (both public and admin). Then wrote a custom script for ingesting exoplanet data from the NASA exo-planet archive to the newly built supabase database, in which I found a typo in the database schema and fixed that. Also created a custom github workfow for remote access.

Tasks completed today -

• Initialize astro JS project (5c997a1)
• Add typescript + tailwindcss (0bdb92c)
• Create supabase table and schema && Add supabase && Create supabase client (6bd9824) (613ec3a)
• Create custom script for ingesting exoplanet data to supabase database (a8ce25f)
• Create a manual database ingestion workflow trigger on github actions (a516557)

Changed the library for globe!

After I deployed to vercel, when I opened the website in chromium based browsers, the 3D earth didn’t load up and after hours of trying I was unable to resolve the issue, however I have came with a different solution and switched the library to globe.gl from r3f-globe. Shipping the project!!! Check the new look-

Deployed the website!

Yes! Finally the site is hosted. There were errors on errors that I had to solve first, then the globe wasn’t rendering on the hosted site, and I kept on trying things until I had to resize the texture image into smaller size and less resolution. But now its time to enjoy! Also, I have added the README file. The website is live now and will be soon shipping the project!!

Added the sidebar

And there we go, almost completed the project ig, there were some UI changes and added another important thing the side bar which shows the live feed of ongoing events and volcanoes. You can click to visit that even and a detailed pop-up will appear! Also, you can search up the live feed from the search bar on the top. It also shows the total no. events present in the feed and gets updated based on what you search. Take a look at the newly added sidebar -

Added status bar and layer controls

Now you control the visible layers and also see the information about the events that are taking place, also the co-ordinates of ISS! The status bar shows up the no. earthquakes past 2.5 days, the maximum earthquake magnitude recorded, the number of active volcanoes, the ISS altitude, the ISS speed, and aurora Kp. Sidebar is almost complete which will have the ability to search up through the ongoin events and you can click the event to visit it! There will be an update soon!

First leak!

jk, completed a main breakthrough, the placement of points wasn’t working well until I turned on merge points option. There are a lot of bugs to be fixed and four errors too! Currently working on the statusbar, the sidebar and floating pills. I guess the decision of switching to react proved to be a huge success and has made my work a lot easier!!! I will soon update with the deployment and addition of new features. Just take a look at this-

Change in plan!

Uhm idk where to start, but when I was working on earthPulse, specifically the textures and shaders parts, I got so much tired of writing raw vanilla scripts that I decided to quit the project. But I got an idea instead to switch the project stack and keep it simple and less messy. I dont know why I chose astro JS before but now I am switching to react and make the project more fruitful and usable. I literally got headaches while using astro JS. I did a little research on re-implementation of the project inside react. And I got some nice results from which I specifically chose the react three fiber option as it will give me more flexibility. I will be updating soon about the new add-on!

There are resources worth mentioning here, check them out-

• Cesium JS
• Resium JS (react wrapper for cesium js)
• React Three Fiber (R3F)
• R3F Globe

Added the main thing!

Three.js is amazing as well as boring at the same time. Worked on the main thing, the globe - the heart of the project. I have started with a canvas, inside the globe component which is powered by three.js and rendered by WebGL. Currently, it consists of 3D earth which has grid lines (latitudes and longitudes), ISS position, and the aurora rings along with the star-field background. It currently features auto-rotation of earth + drag to rotate. Also, you can hover over the different natural activities point markers to know the about their information. I will continue this component by adding the earth texture to give it a real look

Tasks completed:

• Optimized dependencies (6a83a10)
• Build the globe.astro component (5e9d6e1)
• Add globe with grid lines
• Add star-field background
• Add auto-rotation, drag to rotate
• Hover the points to know info

Started with the project!

This project is going to be big one. It will have a 3D earth model which will show the live activities on earth like earthquakes, volcanic eruptions, meteor showers, ISS position, solar flares etc. all beautifully present on the 3D earth with the help three.js along with a modern dashboard of activities over time and information about them. I have researched on the APIs and information available on the internet and I have planned the following things-

• Earthquake - USGS Earthquake API
• Volcanic eruption - SGVP Program + USGS volcano
• ISS position - Open notify ISS
• Solar flares - NASA DONKI API
• Meteor shower - Predicted / calendar based
• Aurora - NOAA Space Weather API

Tasks completed:

• Create the project (1aa784a)
• Add libraries tailwind and three.js (b2b1afc)
• Design the favicon and banner (ffe4c73)
• Design the color palette
• Set up the tailwind theme (1a09158)
• Research on the available APIs
• Set up the project file structure (ed69f19)
• Write all the TS interface (ad49b59)
• Update the README (7ebdb6b)

rewrote the readme and fixed some small UI and bugs. I think I am ready to ship this!

Added the documentation for APOD API with various examples of almost all the parameters of the API. Fixed the ISR issue on the archive/search page where the query wasn’t loaded on the page from the URL params. Also made it reload-proof where the script malfunctioned on changing the page and coming back. Fixed the UI for the navBar.

The third day of heavy work session! Today I have added one of the most cool things - the filter system in the search page along with the help of claude. I had re-work on the search API for adding up a new filter system. Take a look of it! Also now you can directly search from the url by adding params for search and filter and therefore the redirect from the index archive page will work now. Now I am realizing that I will need to document everything 😭. Also there were several small UI fixes especially for the small devices. I have also fixed the sharing of APOD page where the website url wasnt loaded poperly. The another UI addition is the blurred shadow around the main APOD image. check it out. Also added the related APODs section inside the APOD archive page based on the postgres search. Also fixed the large padding in gallery section for small devices.

Another heavy session today!!!! Added the footer and I think I have cooked it. Just take a look. Also completed one of the important things- the public API v1. It has many features!! Firstly it is free to use, no API key needed, unlimited requests, features include params like date, start_date, end_date, hd, query (Database FTS), thumbnails, random, limits with pagination, media_type, order (new/old first) and specific fields you want, year/month wise filtering. And the max limit is 1000 (1k)!!! You also get a meta data about the returned data regarding pagination, total, and order. There was other stuff done too like ui improvements, added video support (not youtube yet), also the image will be visible in single page now.

Fixed the horizontal scrollbar on chrome. Working on the API which will have many features with unlimited calls and no API key required!

Heavy work session! Worked on the archive index page, archive search page, new public API work in progress. The ISR was also not working properly and the astro view transitions also glitched due to which javascript also malfunctioned. I have prettified some code today as it looked messy. Also, updated the dependencies along with fixing of view transitions, and the javascript issues due to that. The main thing done today is the adding of new search page (with debouncing) on archive where you can use the postgres full text search. I have also worked on the index archive page which contains three things - a search query box which takes you to the search page (not working now), a date-wise url maker with 3 examples, and a year-wise list of APODs that even shows the months (in the form of dots)! Sorry for making this devlog big!

https://cdn.hackclub.com/019d29d8-23d0-7641-a3ad-8e2cf5e52c56/2026-03-26_16-21-24.mp4

I am sorry for not consistently working on this project. I was focusing on the studies and got sick. I am better now. The re-validation and ISR was not setup correctly, so I had to fix that first. Now the site will be re-validated every 24hrs. Also added blurred loading of images for fast preview along with skeleton loading. There’s only blurred loading for the APOD archive page for now. Almost completed the search API and TS vector in Supabase with update trigger (not committed yet).

Changed to static paths and kept APIs dynamic. Updated the dependencies and upgraded to astroJS v6! Also added the vercel analytics and vercel speed insights. Fixed the internal server error completely and the gallery preview is available now. Working on the archive page with search and filter features.

I am back after a break. Focused on studies. There were two important things to fix, the internal server error on website in preview of gallery section. The other problem is that the image load very slow. So to fix that, I used https://wsrv.nl for webP conversion and caching. Now I can feel the difference. Check it out yourself.

Added the scale up animation on loading of image and view transitions from astro. There were a few fixes. Added a version API which tells about the last commit and website version

I only test one URL and decided that the OG Image wasn’t working. But it wasnt true until I tested that in https://opengraph.dev So, I have updated the OG image banner (default OG image) with new favicon. Also added a fallback if the dynamic OG image fails. Also worked on the favicon.ico and on theme based changing of icons

Designed this beautiful logo/favicon! Not the main work done today but still took much time. The other things done today are the simplification optimization of website structure. Also edited the gallery preview on the index page. Take a look!

Sorry! Forgot to add a devlog yesterday. There are couple of new things added! I am still trying to fix the dynamic OG image generation. Added the banner (default OG image), designing favicon in figma, fixed the sync DB script and optimized it. the main thing done today was the simplification and modularity of website structure for better performance. Did dimplification on the landing page, navbar and the preview apod component. the navbar shows the current page now! .There were some UI changes too like adding of more roundedness and effects! have a look-

My HTML structure is looking shi , I need to modify and simplify every page. I am scared to check the SEO or a lighthouse report. Well, I am trying to make it good and minimal. I worked on prettifying that. The another good change is that I added a whole geist icon set on my project so that the code doesn’t look messy. I planning on unifying the meta data and the OG data. And yeah now the social media sharing is live. Also, added the copy button for the URL. Currently, there is a horizontal scrollbar on chrome idk, what’s wrong. Need to resolve that too. Here’s the lighthouse report.

Yeahhh! figured it out, the api got gallery was controlled by the vercel’s ISR. Now, the gallery works just fine. I did beautification, adding of simplification in the html structure. Also working on the the social media sharing options in archive.

Okay, there are a couple of things added! First of all I had to use Gemini in order to achieve the dynamic loading of the images on the gallery page as the user scrolled. The second thing added was to remove the ISR on the random APOD page. There are also some Fixes and optimizations on the code. Also added an “Archive” title on the archive page. And added the “LIVE_DATA” or “OLD_DATA” on the navbar, which basically tells if the data is latest. Currently, I am having issues on the gallery page. idk why the images are shown repeated. Will figure it out soon. Thus, adding a photo only. Will add a video on the next devlog.

First of all sorry for devlogging this much time. Actually, I had ran into a problem, my .git folder had got some issues. However, the issue is resolved now. I have added two main things, the gallery page, and the random APOD page. Both the pages are not finished yet, I am figuring out the loading of all the data from the db to the gallery page, and the random page is currently static. I have also added a “Today’s APOD” title which was missing in the APOD page. Also there were some minor UI fixes. The other thing is that I have worked on the dynamic OG image generation and converted it into a React component. I’m currently unsure about the loading of images in the gallery page but will soon figure it out.

The database wasn’t getting an update due to early API call so, changed the workflow time to 5:30 UTC. There were some UI fixes in navbar, misc. Also I have worked on the landing page. Take a look. I have added a section of posts that were posted on a particular day when you go to an APOD. Added a copyright section in the preview of APOD cards.

Okay so the yearly and monthly archive wasn’t looking that great, so I have worked to beautify it. It is very apple and vercel inspired. Also the navbar was not looking that good as I was thinking so I have redesigned it added blur like everyone else! it’s so beautiful!! But there are still very minute details that I need to add in the UI. Also, the surprise me, gallery , overall archive page is remaining. It is very time consuming !!! But please take a look at my work

A heavy session of UI! Designed the entire monthly archive page. No more energy to journal. Just check it out how beautiful!

Lets go! I have added the main thing on the page the APOD. Now you can go to https://astro--daily.vercel.app/apod to see the latest APOD. This page fetches the latest APOD from the database and shows it! Along with UI/UX, there are few things remaining for this page like caching for 24h so that the page remains static. I have also added the https://astro--daily.vercel.app/archive/[year]/[month]/[day] to show APOD for that particular day. It also uses the same idea as on the APOD page. I have also added vercel’s ISR on these pages so that the pages stay static without increasing the build times.

The first thing necessary is the data. I made a script that fetches my supabase database and checks the last date. If it doesn’t match with today’s date, the script fetches due APODs (Astronomy Picture of the Day) from NASA’s API and updates the database. I added a github action workflow which automatically runs that script everyday so that my database is always up to the date.