NASA Media Library React App

This project is a React-based web application that utilizes NASA's public API for image collection. Users can search the library and view detailed information about specific results.

Preview: https://nasa-media-library-eight.vercel.app/

Concept and design in Figma

Technologies Used

This project uses the following technologies:

Typescript React React Router Bootstrap Sass React Hook Form React Datepicker React Paginate React i18n Jest React Testing Library UUID

Features

Search Page

Allows users to search the NASA Media Library Users search endpoint in compliance with the API specification Includes query input and two optional input filters (year start and year end) Provides basic validations for user input Displays search results with thumbnail, title, location, and photographer's name Links to the Show Page for more details about a specific result

Show Page

Displays details of a specific search result, including title, location, photographer's name, description, keywords, date, and images from the collection Allows users to navigate back to search results page with the back button

Getting Started

To get started with this project, clone this repository and follow these steps:

Install dependencies with npm install

Start the application with npm start

Testing

This project includes basic tests to ensure proper functionality. To run tests, use the following command: npm run test

Credits

This project was created by Mikita Klimuk. Special thanks to NASA for providing the public API and Ilya Grigorenko for designing the project.

Preview

Main page with filters

Details page (whith selected card)

Yerspicker styles

Mobile optimization