A reactjs website that displays current flying planes on a map, showing details about each flight.
Examples:
1- Display current fetched flights on a map, ability to filter aircraft on map by call sign, you can hover on an aircraft to view the Call sign (If available), or click on it to view information about the flight, which can include:
- Call sign
- Aircraft type
- Registration
- Airline
- Route
- Altitude in feet
- Ground speed in Km/h
3- You can click "View flight" to display live flight path on the map, which auto refreshes every 10 seconds. if you want it to refresh more often, go to the file src\pages\Flight\FlightInfo.jsx , and at line 318:
}, 10000); // How often flight status refreshes in milliseconds, change to a smaller number if you want it to refresh more often
you can change 10000 to another number, where the number equals amount of seconds multiplied by 10.
4- Information about airports, and recent arrivals and departures (if available).
5- Searching by aircraft registration or airport code.
1- react-router
2- react-leaflet
1- The app uses OpenSky Network API for information about flights to be displayed on the map. OpenSky network API has request limitations of 100 API requests per day for anonymous users or 1000 API requests per day for registered users.
2- The app uses hexdb.io API for information about Aircraft, call signs, and airports.
3- The app uses Country Flags API for flag images.
4- The app retreives most recent available image of aircraft from JetPhotos. Link is retreived from hexdb.io API.
5-The app uses LeafletJs with OpenStreetMap for the map.
1- First you need to install NodeJs
2- Clone this repository, and in the terminal, run:
3- In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
You can learn more in the Create React App documentation.
To learn React, check out the React documentation.