Spacestagram was designed to show users various images of Mars captured by the Curosity rover. The date of the image as well as the rover and camera names are displayed alongside the image. User can also click the like button on the image. The button will turn pink to signify to user that it's liked and pale yellow if not liked.
- HTML
- CSS/SCSS
- JavaScript
- React
- Fetch API
- Heroku
If you want to run locally...
- Clone this repo to your machine
cdinto the directorySpacestagramin the terminal- Run
npm startin the terminal - In the browser go to
http://localhost:3000/
My API was the Mars Rover Photos from https://api.nasa.gov and I got my API key. From the NASA website, I understand the API is maintained by Chris Cerami. I went to https://github.com/chrisccerami/mars-photo-api to understand more about documentation. The README suggested to use https://mars-photos.herokuapp.com/. While I was able to fetch images using API key, I decided to take his suggestion.
- It is a great practice in building a react app.
- Deployment, I had an issue with deploying the React App on Heroku.
I keep on getting the error
TypeError: MiniCssExtractPlugin is not a constructor. I was able to find the solutionhere. I rannpm i -D --save-exact mini-css-extract-plugin@2.4.5on my terminal and that fixed the problem and deployed.
- Add the likes information to local storage, so the likes would still persists if the user leaves or reloads the page.