johnsvpaul / FRNDSinSPACE

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/

Features

• 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

Prerequisites

• NodeJS and NPM
• Express (dependancy) - for option 1 installation
• Internet connection

Installation

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.

API's Used

• ISS location
  • Documentation
  • Endpoint
• People in ISS
  • Endpoint
• LeafletJS
  • Documentation
• Mapbox
  • Documentation
• Wikipedia
  • Documentation
• ipapi
  • Documentation
  • Endpoint

Included Files

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.

Attributions

• Main homescreen image: Technology vector created by upklyak - www.freepik.com
• Astronaunt in logo: Travel vector created by pch.vector - www.freepik.com

Author

Johns Paul

License

MIT