Exopossibilities

I APOLOGIZE FOR THE 18 COMMITS THAT ARE ALL FOR THE SAME THING. So I decided to style the site for mobile as well as laptop because it worked okay on mobile but was very zoomed out and stuff. So it’s not like I have vs code on my phone and there probably is an easier way but I didn’t want to figure out getting a live server on my phone so I kept changing the CSS, committing, checking it on my phone, and repeat. But hey - now it looks better for mobile!

Introducing Planet of the Day and some neat CSS changes! I added a planet of the day on the home page which is clickable just like the cards on the discover page. I also added skeleton loading states for the list of planets on the discover page. I noticed that it was consistently taking time to load and render the planets (not surprisingly) so I added it to make it feel more polished and less sharp. And yes, the screenshot of the loading states was timed so that I caught them on the screen before the planets appeared.

I added a new feature! A quiz that matches the user’s preferences with exoplanets. The user answers 5 questions and gets a collection of exoplanets that match those preferences!

Update - Changes Since My Ship

1. Photos!
   As I mentioned in my last 2 devlogs, I changed the planets’ photos. I used to have a single blue planet that was on every planet’s page and that seemed boring, so I changed it. Most exoplanets don’t actually have photos, so I took a handful of photos and sorted the planets into types. Now, there is a photo for each type and the planet’s corresponding photo is on its planet page and its card in the discover page. I have a photo for each type: terrestrial, super-earth, Neptune-like, mini-Neptune, gas giant, and hot Jupiter. Mini-Neptunes and hot Jupiters are really just subsections of Neptune-like and gas giants, respectively, but I decided to give them their own photo anyways.

2. Random Planet Button!
   I added a button right next to the filters that brings the user to a random planet page obeying the filters that they set. I thought it’s a fun little feature to make my site a bit more fun. Hopefully, I’ll be adding a couple other features too.

3. I made like some minor CSS changes to the filters and stuff. Barely noticeable but I think that little part looks better than before. Yay!

More to come!

So … I added the images to the discover page, which makes it less boring. The planets are sorted into 6 categories, each with a different photo. I also finally sorted my files. Yay! I wasn’t quite sure how I should organize them - like do I put css in one folder and html in another? So I left some unorganized for now.

A lot of people who reviewed my ship mentioned all the planet pages having the same image - which is totally fair. I felt the same way (and so did my sister), so I decided to do something about it. Most exoplanets just simply don’t have photos, so it’s not like I could put a photo of each planet. I decided to put different photos for different types of planets (terrestrial, super earth, neptune-like, gas giant). Hope you guys like it!

I give you fonts! And I’m done! (for now). I want to try and add a cool feature and do some other random stuff at some point but ta-da!

Finished the first draft of my website. I put an example image of what one of the planet pages looks like. I will probably do a little more CSS work and maybe add some new features but I’m pretty happy with what I have so far. This is my first website that I’ve made myself. It’s also my first time using APIs in a project which was super cool.

I finished the filters and detailed blocks for each exoplanet! Next step is each exoplanet getting an individual page with more details.

I have the API of exoplanets from NASA in my project and added a search bar. Next step is to add clickable cards to show the data of each planet, then filters for searching, etc. The API I used has info on each planet’s name, radius, mass, distance from earth, and equilibrium temp. I’ll get around to better CSS at the end, right now it’s kind of sad looking. Then I’ll tie the info to the effect on the human body.

Hi everyone! This is my first ever devlog and I’m so excited! I’ve only just started my project, for now it’s called Exopossibilities. I’m planning on using an API to have data on exoplanets then users can see what would happen to a human on a specific exoplanets. I’m planning to use a second API to have information on how the human body is affected by certain environmental factors(pressure, extreme temps, etc.).