Spacestagram
![](https://raw.githubusercontent.com/abhaygupta08/spacestagram/main/ss.png)
Made this under Shopify Challange
Created withReact | TailwindCSS | NasaAPI | Axois
Run this Web app on your local Machime
- Download and Extract or Clone
git clone https://github.com/abhaygupta08/spacestagram/
this repository to your Local Machine. - Go to the folder.
- Run
npm i
to install all the dependencies. - Run
npm start
to start this project. - Play with code 🧐
The Challenge
We need a webpage that can pull images, and allow the user to “like” and “unlike” their favourite images.
- We'd like a simple to use interface that makes it easy to:
- Fetch data from one of NASA’s APIs and display the resulting images (more details under Technical Requirements)
- Display descriptive data for each image (for example: title, date, description, etc.)
- Like an image
- Unlike an image
Technical requirements
- Search results should come from NASA’s free APIs, for which you’ll need a free API key from https://api.nasa.gov
- Each image result should list at least a title, date of capture (ideally in earth_date) and a button to “like” that image.
- Each image can be “liked”, and a user should be able to undo their “like”
- The HTML that ends up being served client-side should be accessible and semantic MDN reference
Extras
- Save likes if the user leaves or reloads the page
- Add a loading state while we wait for NASA’s API to return data
- Create shareable links for each image