SpaceX Launch Explorer is an interactive web application designed to let you explore detailed information about past and upcoming SpaceX launches. Leveraging a free API (such as the SpaceX API), the app dynamically fetches launch data and presents it in a sleek, responsive interface. Whether you're a space enthusiast or a curious learner, SpaceX Launch Explorer offers insights on launch dates, mission details, rocket information, and more—all at your fingertips.
- Responsive Design: Enjoy a seamless user experience across desktops, tablets, and mobile devices.
- Real-Time Data: Retrieve up-to-date launch data directly from the free SpaceX API.
- Detailed Launch Information: View essential details including mission name, launch date, rocket specifications, payload details, and mission patches.
- Upcoming & Past Launches: Easily toggle between upcoming and past launches to explore SpaceX’s launch history.
- Dynamic Modal Display: Click on any launch card to open a modal window with in-depth details about the mission.
- Filtering & Sorting: Filter launches by status (upcoming/past) and sort them by date or mission name for easy navigation.
- HTML5
- CSS3
- JavaScript
- Bootstrap 5
SpaceX Launch Explorer runs in modern web browsers without any additional dependencies. For development purposes, it is recommended to use a code editor with live reload functionality (e.g., Visual Studio Code with the Live Server extension).
-
Clone the Repository git clone https://github.com/bocaletto-luca/spacex-launch-explorer.git cd spacex-launch-explorer
-
Launch the Application
- Open the
index.htmlfile in your preferred web browser. - Alternatively, use a live-reload server via your code editor for real-time preview.
- Data Fetching: The application uses JavaScript’s Fetch API to retrieve launch data from the free SpaceX API. The JSON response is parsed and rendered dynamically to create informative launch cards.
- Launch Details: Each card displays key mission details such as launch date, mission name, rocket used, and a mission patch image. Clicking a card opens a modal with comprehensive mission details.
- Filtering & Sorting: Users can easily filter launches by their status (upcoming or past) and sort them based on various parameters to quickly find the information they need.
- Responsive Interface: Designed with Bootstrap 5 and custom CSS, the application adapts seamlessly to any device, ensuring a smooth exploration experience.
Contributions are welcome! To contribute to SpaceX Launch Explorer, please follow these steps:
- Fork the repository.
- Create a new branch for your feature or fix: