This page combined my skills in HTML, CSS, and Javascript to create an interactive website with up-to-date information drawn from the NASA API.
My goals for this project included:
- Connect to an API and fetch information to populate the page.
- Utilize UI patterns for and interactive user experience.
Future goals:
- Make the website fully responsive, especially the mobile version.
- Improve code so that YouTube videos can be opened in the modal.
Below is a screenshot of the default page.
This is how the page appears when the modal is active.
And finally, this is what the page looks like when the accordian is open.
I connected with the NASA Astronomy Picture of the Day API and fetched the current day's photo, title, date, and description. Then, I improved the functionality using Javascript by adding a modal that increases the size of the image when it is clicked by a user. I also added an accordian that expands to reveal the full description of the photo.
This website was created with HTML, CSS, Javascript, and information from the NASA Astronomy Picture of the Day API.
This project includes a single webpage. The code can be examined in this GitHub repository. Click here to view the app.
If you would like to contribute code, identify bugs, or propose improvements, please fork this repository and submit a pull request with your suggestions. Below are some helpful links to help you get started: