https://github.com/bocaletto-luca/spacex-launch-explorer
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...
https://github.com/bocaletto-luca/spacex-launch-explorer
api api-free application bocaletto-luca css3 html5 javascript launch-space responsive spacex spacex-api spacex-launches spacex-missions
Last synced: 2 months ago
JSON representation
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...
- Host: GitHub
- URL: https://github.com/bocaletto-luca/spacex-launch-explorer
- Owner: bocaletto-luca
- License: gpl-3.0
- Created: 2025-05-28T11:14:20.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-28T11:19:06.000Z (about 1 year ago)
- Last Synced: 2025-05-28T12:27:33.092Z (about 1 year ago)
- Topics: api, api-free, application, bocaletto-luca, css3, html5, javascript, launch-space, responsive, spacex, spacex-api, spacex-launches, spacex-missions
- Language: HTML
- Homepage: https://bocaletto-luca.github.io/
- Size: 22.5 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# SpaceX Launch Explorer | API Free | Database | WEBAPP
#### Author: Bocaletto Luca
[](https://developer.mozilla.org/en-US/docs/Web/HTML) [](https://developer.mozilla.org/en-US/docs/Web/CSS) [](https://developer.mozilla.org/en-US/docs/Web/JavaScript) [](https://getbootstrap.com/)
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](https://github.com/r-spacex/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.
## Features
- **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.
## Technologies Used
- **HTML5**
- **CSS3**
- **JavaScript**
- **Bootstrap 5**
## Getting Started
### Prerequisites
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).
### Installation
1. **Clone the Repository**
git clone https://github.com/bocaletto-luca/spacex-launch-explorer.git cd spacex-launch-explorer
2. **Launch the Application**
- Open the `index.html` file in your preferred web browser.
- Alternatively, use a live-reload server via your code editor for real-time preview.
## How It Works
- **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.
## Contributing
Contributions are welcome! To contribute to SpaceX Launch Explorer, please follow these steps:
1. Fork the repository.
2. Create a new branch for your feature or fix:
#### Enjoy WEBAPP - Bocaletto Luca