Spacetagram

Visit the live link here

Table of Contents

• Description
• Features
• Installation
• Demo
• Dependencies
• Known Issues

Description

A client-side single page application built using React that pulls data from Nasa's Astronomy Picture of The Day. It's like instagram but for space lovers. Users can browse through these images and like or unlike them. The app also has a dark-mode feature which users can toggle depending on their preference.

Features

• Load Image data from NASA's API
• Like and dislike each image
• Switch between dark mode and light mode
• Loading progress bar
• Display error page when it fails to load

Installation

1. Clone this repo

   git clone https://github.com/zakwarsame/spacetagram.git

2. Install and use the correct version of Node using NVM. This app was both built and hosted using node v16.13.1

   nvm install

3. Install dependencies

   npm install

4. Sign up for NASA's free API key here

5. Create a .env file and setup your key by following the .env.example file

6. Start the development server

   npm start

Demo

Running Cypress Tests

npm run cypress

Dependencies

• react
• axios
• material-ui
• dotenv
• react-infinite-scroll-component
• react-query

Known Issues

The like button is a checkbox thus not being saved or persisted in local storage.