-
-
The homepage of the website features today's image of the day.
-
You can search for any image of the day (after 1995, the date of the first picture)
-
You can ask the website for a random image (click 'Random')
-
The information sections feature a changing background, as well as information about the website
-
The information sections feature a changing background, as well as Q & A
-
The website does not lose any of its functionality, thanks to the collapable hamburger menu
Inspiration
The theme of “space” got us thinking about the imponderable accomplishments of modern day space exploration. We are very interested in space and its mysteries and try to learn more about space every day. It is quite obvious that space would shape the near future and will advance science further and further, so we decided to make this project to inspire others to learn more about space as well.
What it does
NASA Image of the Day takes information from the official Astronomy Picture of the Day website (https://api.nasa.gov/), and puts it on this website. NASA Image of the Day also allows you to search up any date (after the 16th of june, 1995) and view the incredible image taken on that date.
How we built it
We used several tools to build the website. For the back-end, we used Python with Flask. For the front-end we used HTML with Bootstrap templates. We used GCP's Cloud Run to host the website. We also used GCP's Secrets to store our API key.
Challenges we ran into
We ran into numerous challenges throughout the course of the hackathon. One challenge was not leaving any white spaces on the pages of the website. In order to solve this problem we made each image bigger and made a smaller font size to not block the image. Another challenge we ran into was allowing the website to be viewed on devices with a smaller width, such as smartphones. We implemented a ‘hamburger’ menu to allow the website to be viewed on small devices, without affecting the functionality of the website. Prior to this feature being added, the website would be virtually unusable on small screens. The last problem we ran into was hiding the key to the NASA APOD API. When we published our code to Github, we would not want for there to be any sensitive information. We hid the API key by using GCP’s Secret tool. Other minor challenges included agreeing on some of the text added on the website.
Accomplishments that we're proud of
One of the accomplishments we are very proud of is connecting the Nasa API to the website so it's accessible to you and us. Also, we are proud that we were able to manage our time well and work well as a team to successfully complete this project.
What we learned
During the making of this website, we learned how to use Flask and Bootstrap to make websites, and to create pipelines between APIs and websites. In result, we were able to complete the project in a shorter period of time and add more functions to it.
What's next for NASA Gallery
A next step for all of us would be to make the website look more professional and spend some more time on the layout and design of the site itself, as well as implementing a gallery feature that would display all the images in a gallery form for viewers to scroll through. Not only that, but in the future we might add our own choices for the image of the day, giving the users a chance to look at other images as well, and filter between image categories. To make the website easier to access we would like to implement it as a browser extension that changes the background of a new tab (like Tabliss). This would greatly reduce the amount of effort required to be able to view the beautiful images. Finally, we would add keyboard shortcuts to allow users to go from one image to another easily.
Log in or sign up for Devpost to join the conversation.