From 474acb24cfb81c7c2fbf1aebdec5adb590070685 Mon Sep 17 00:00:00 2001 From: Revanth <109272714+revanth1718@users.noreply.github.com> Date: Fri, 9 Aug 2024 21:34:05 +0530 Subject: [PATCH] SpaceX API --- New_APIs/SpaceX API/index.html | 23 +++++++++ New_APIs/SpaceX API/index.js | 41 ++++++++++++++++ New_APIs/SpaceX API/package-lock.json | 19 ++++++++ New_APIs/SpaceX API/package.json | 16 ++++++ New_APIs/SpaceX API/server.js | 44 +++++++++++++++++ New_APIs/SpaceX API/style.css | 70 +++++++++++++++++++++++++++ 6 files changed, 213 insertions(+) create mode 100644 New_APIs/SpaceX API/index.html create mode 100644 New_APIs/SpaceX API/index.js create mode 100644 New_APIs/SpaceX API/package-lock.json create mode 100644 New_APIs/SpaceX API/package.json create mode 100644 New_APIs/SpaceX API/server.js create mode 100644 New_APIs/SpaceX API/style.css diff --git a/New_APIs/SpaceX API/index.html b/New_APIs/SpaceX API/index.html new file mode 100644 index 0000000..d012351 --- /dev/null +++ b/New_APIs/SpaceX API/index.html @@ -0,0 +1,23 @@ + + + + + + + SpaceX Explorer + + +
+

SpaceX Explorer

+
+
+
+ + + +
+
+
+ + + diff --git a/New_APIs/SpaceX API/index.js b/New_APIs/SpaceX API/index.js new file mode 100644 index 0000000..bd49b66 --- /dev/null +++ b/New_APIs/SpaceX API/index.js @@ -0,0 +1,41 @@ +document.getElementById('fetchLaunches').addEventListener('click', async () => { + await fetchData('/launches'); +}); + +document.getElementById('fetchRockets').addEventListener('click', async () => { + await fetchData('/rockets'); +}); + +document.getElementById('fetchMissions').addEventListener('click', async () => { + await fetchData('/missions'); +}); + +async function fetchData(endpoint) { + try { + const response = await fetch(endpoint); + const data = await response.json(); + displayData(data); + } catch (error) { + console.error('Error fetching data:', error); + document.getElementById('dataDisplay').textContent = 'Failed to fetch data.'; + } +} + +function displayData(data) { + const displayDiv = document.getElementById('dataDisplay'); + displayDiv.innerHTML = ''; + + if (Array.isArray(data)) { + data.forEach(item => { + const itemDiv = document.createElement('div'); + itemDiv.classList.add('item'); + itemDiv.innerHTML = ` +

${item.name || item.mission_name || item.rocket_name}

+

${item.details || item.description || item.mission_id}

+ `; + displayDiv.appendChild(itemDiv); + }); + } else { + displayDiv.textContent = 'No data available.'; + } +} diff --git a/New_APIs/SpaceX API/package-lock.json b/New_APIs/SpaceX API/package-lock.json new file mode 100644 index 0000000..3a39e1e --- /dev/null +++ b/New_APIs/SpaceX API/package-lock.json @@ -0,0 +1,19 @@ +{ + "name": "spacex-explorer", + "version": "1.0.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "express": { + "version": "4.17.1", + "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz", + "integrity": "sha512-G7fYv8zS0D7ftu3gnLsOniwhgLU4k9v+1NEtFPP07/Oa8XJ51FtdUKLqIvsTcZo5ua23NO4s9Hr77BM19DOf1g==" + }, + "node-fetch": { + "version": "2.6.1", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz", + "integrity": "sha512-VTRr27C7kFTX04D5faZbO57jWhA+3vWQBB8T/LDlMjUbES0uUKU+6XoGp54LzWuKIo6OzztYLMATJ3jyCUnD0A==" + } + } + } + \ No newline at end of file diff --git a/New_APIs/SpaceX API/package.json b/New_APIs/SpaceX API/package.json new file mode 100644 index 0000000..142fb3d --- /dev/null +++ b/New_APIs/SpaceX API/package.json @@ -0,0 +1,16 @@ +{ + "name": "spacex-explorer", + "version": "1.0.0", + "description": "A simple app to explore SpaceX data using the SpaceX API", + "main": "server.js", + "scripts": { + "start": "node server.js" + }, + "author": "Your Name", + "license": "ISC", + "dependencies": { + "express": "^4.17.1", + "node-fetch": "^2.6.1" + } + } + \ No newline at end of file diff --git a/New_APIs/SpaceX API/server.js b/New_APIs/SpaceX API/server.js new file mode 100644 index 0000000..005fb74 --- /dev/null +++ b/New_APIs/SpaceX API/server.js @@ -0,0 +1,44 @@ +const express = require('express'); +const fetch = require('node-fetch'); + +const app = express(); +app.use(express.static('public')); + +const SPACEX_API_BASE_URL = 'https://api.spacexdata.com/v4'; + +app.get('/launches', async (req, res) => { + try { + const response = await fetch(`${SPACEX_API_BASE_URL}/launches/latest`); + const data = await response.json(); + res.json(data); + } catch (error) { + console.error('Error fetching launches:', error); + res.status(500).json({ error: 'Failed to fetch launches' }); + } +}); + +app.get('/rockets', async (req, res) => { + try { + const response = await fetch(`${SPACEX_API_BASE_URL}/rockets`); + const data = await response.json(); + res.json(data); + } catch (error) { + console.error('Error fetching rockets:', error); + res.status(500).json({ error: 'Failed to fetch rockets' }); + } +}); + +app.get('/missions', async (req, res) => { + try { + const response = await fetch(`${SPACEX_API_BASE_URL}/missions`); + const data = await response.json(); + res.json(data); + } catch (error) { + console.error('Error fetching missions:', error); + res.status(500).json({ error: 'Failed to fetch missions' }); + } +}); + +app.listen(3000, () => { + console.log('Server is running on port 3000'); +}); diff --git a/New_APIs/SpaceX API/style.css b/New_APIs/SpaceX API/style.css new file mode 100644 index 0000000..6a0829d --- /dev/null +++ b/New_APIs/SpaceX API/style.css @@ -0,0 +1,70 @@ +body { + font-family: 'Arial', sans-serif; + background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d); + color: #fff; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; + margin: 0; +} + +header { + text-align: center; + margin-bottom: 20px; +} + +header h1 { + font-size: 3em; + color: #fff; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); +} + +main { + background: rgba(0, 0, 0, 0.6); + padding: 20px; + border-radius: 10px; + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); + width: 80%; + max-width: 800px; + text-align: center; +} + +button { + padding: 10px 20px; + margin: 10px; + font-size: 1.2em; + color: #fff; + background-color: #333; + border: none; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s; +} + +button:hover { + background-color: #555; +} + +#dataDisplay { + margin-top: 20px; + text-align: left; +} + +.item { + background: rgba(255, 255, 255, 0.1); + padding: 15px; + margin: 10px 0; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); +} + +.item h3 { + margin-top: 0; + color: #fdbb2d; +} + +.item p { + margin: 5px 0 0; +}