The International Space Station (ISS) constantly flies over our planet. FRNDSinSPACE allows you to track the position of the ISS and see who is currently abroad on it.
View Live Version at: https://frndsinspace.netlify.app/
View Github Repo at: https://github.com/johnsvpaul/friends-in-space/
- ISS location mapped on a map with orbital path being drawn live.
- Track the exact location of the ISS with information such as latitude/longitude, velocity and altitude displayed
- See how many people are currently in space with information such as name, picture, title, country of origin and days in space displayed.
- See current and ongoing ISS Expeditions
- See your own IP Location on the map
- NodeJS and NPM
- Express (dependancy) - for option 1 installation
- Internet connection
Option 1 - using Node:
Go to root folder and open terminal.
- install the dependencies (express) - run
npm install express
- run
node app.js
- This sets up a server that listening on port 3000.
- The server should start and you can view FRNDSinSPACE response by visiting http://localhost:3000 in your browser. You can use Ctrl+C to stop the server.
Option 2 (easier):
Assuming you have a code editor such as VS Code or Atom you can simply install a package called live-server. Then simply open up index.html and right click anywhere on the page and open with live server
NOTE: Using this method no dependacies such as express is needed.
File | Explaination |
---|---|
app.js | Server-side JS code. The code NodeJS executes when we start our server. |
index.html | A static page served by app.js. We have all the elements here with items appropriately named so we can refer to them in our client-side code. We also include our other two static main.css and main.js so that the browser loads them when we open the app |
main.js | The client-side JS code. Includes all API calls and fetch functions to display and map the data fetched from the API |
main.css | An external CSS stylesheet that defines the styles for the index.html. |
moment.js | Moment. js is a free and open source JavaScript library that removes the need to use the native JavaScript Date object directly. |
- Main homescreen image: Technology vector created by upklyak - www.freepik.com
- Astronaunt in logo: Travel vector created by pch.vector - www.freepik.com
Johns Paul