SpaceX-Mission-Explorer

This is a web application built using Vite, TypeScript, React, shadcn-ui and Tailwind CSS. It allows users to browse, search, filter, and favorite SpaceX missions by consuming the public SpaceX v4 API. The application is designed to be clean, responsive, and user-friendly.

Features :

• A list of all SpaceX launches with key details like mission name, date, and rocket :

  

• Search for missions by name with a debounced input for better performance :

  

• Filter launches by year and by success status :

  

• Mark or unmark missions as favorites, with the selection saved to localStorage. A toggle is available to view only favorite missions :

  

• Click on any mission to see a detailed view in a modal or on a separate page, including the mission patch, a full description, and links to the webcast :

  

• The UI is fully responsive for both mobile and desktop screens and supports keyboard navigation :

Getting Started :

The only requirement is having Node.js & npm installed - install with nvm

Follow these steps :

# Step 1: Clone the repository using the project's Git URL:
git clone https://github.com/Abhi0517/spacex-mission-explorer.git

# Step 2: Navigate to the project directory:
cd spacex-mission-explorer

# Step 3: Install the necessary dependencies:
npm i

# Step 4: Start the development server with auto-reloading and an instant preview:
npm run dev

# Step 5: To run tests:
npm run test

Tech Stack :

• Vite
• TypeScript
• React
• shadcn-ui
• Tailwind CSS

Feel free to fork and contribute !!