DEV Community

Edward Naidoo
Edward Naidoo

Posted on • Edited on

Making a prettier Webpage for Nasa's Astronomy API

Hello Everyone!
It is nice of you that you have clicked onto this post.

The Planning 📚

This will be a project I will be taking on to dive deeper into React and create an interface which will look more up to date compared to the current Nasa Website. I will be creating this with the use of the api to display the 'Picture of the Day' and be a place people can search easily on the web.

It will be Open Source and as a beginner as myself, I hope to learn a lot of things and make the science world a more attractive place to be in rather than be intimidated from the technologies being used.


Game Plan 🚀

Since this is open source, I do not mind and would ask for any help if there were to be trouble along the line as I post more. This will be the front end part, while the backend will be the traffic of the Nasa api

  1. I want to have the star of the show, the 'Picture of the Day', as the centre point of this project and allow those pictures to be saved to where it may be stored in a database.
  2. Have a Nasa themed webpage with similar colours to give the familiarity.
  3. Have Cards hold the image, the description, the date the picture was last posted, and a way to like the photo. There will also be credits for everyone who was involved in the 'Picture of the Day', for example, the names of the observatory.
  4. These cards are scrollable which will move from right to left, giving the effect of a mobile social media app.

More will come with the plan, but hopefully you have gotten the idea. There may be some challenges throughout this project, so my main goal, is to make this Open Source and make the Astronomy Picture of the Day Website look less like documentation and more like dedicated, professional, webpage where more people would like to learn more.


What I hope to get out of this 🧐

This project was originally for the Shopify Front-End Challenge Internship which had passed, but I couldn't complete the challenge in time. This will not stop me from continuing this project and letting it go to waste. I just want to learn more about these modern technologies and learning them through personal projects rather than a step-by-step tutorial is better for me. I hope this helps anyone else looking into React development or Javascript/Typescript Development.


Rescources 🔭

I will be posting all my resources that may help with productivity during a project or give inspiration for a new project and maybe my desgins for the webpage!

Top comments (0)