This website was created with HTML, CSS, and plain JavaScript
Published at: https://noumanamalik.github.io/Shopify-Intern-Challenge-Spacestagram/
- When you open the website, it automatically calls the API to get 12 objects
- From those 12 objects, the ones that are not images are removed and the rest are shown
- You can click on the image itself to open the full sized image on Nasa's website
- If you click on the share button, the link to the full size image on Nasa's website will be copied to your clipboard
- If you click the info button, information about the image, received from the API, will slide up to be visible
- To collapse the imformation, you can click anywhere on the information card to make it go back down
- When you get to the bottom of the page, there is a button that will get 12 more images from Nasa's api by reloading the page, which will automatically make a call to the API
- On the top right of the page, there is a date input where you can put in any day, and then the image from that date, if available, will be shown
- To search of the image of the day, make sure to click the submit (check) button next to the input
- If you clear the date input and click the search button, 12 new objects are called from the API (and only the images are shown).
- I got the inspiration for background color and the color of the header from Discords' theme