/spacestagram

Image-sharing from the final frontier

Primary LanguageJavaScript

Spacestagram

Deployed site

Netlify Status

Overview

Spacestagram is a webpage that pulls images from NASA's Astronomy Picture of the Day API and displays them ~a la instagram for users to like and unlike their favorite photos.

desktop view

Development

When I was first given this challenge, I began by crafting user stories, issues, and a project board for each requirement. Design inspiration came (naturally) from instagram for the UI. The one column layout, even on desktop, allows for maximum image size and a "...more" button after 120 characters of each caption ensures that the focus is primarily on the photos. The like and unlike actions are both animated. The application is responsive across all screen sizes and uses semantic HTML and best-practices for accessibility throughout, including aria-accessible labels for the heart icon buttons.

mobile view

Careful consideration was given to error handling and loading states in the UI so that our space travellers are (hopefully) never frustrated by their experience on spacestagram.

Lastly, the application is deployed on Netlify and the free API key is stored as an environment variable on Netlify for extra security.

Technologies Used

-React -React Router -Deployed on Netlify

Contributors

Claire Fields Github and LinkedIn