Skip to content

Latest commit

 

History

History
44 lines (31 loc) · 2.24 KB

README.md

File metadata and controls

44 lines (31 loc) · 2.24 KB

Flight Tracker

A real-time aviation data tracking application built using React and TypeScript, leveraging OpenSky Network's REST API.

Screenshot 2023-07-22 at 11 00 53 PM

Installation

Clone the repository

git clone https://github.com/jtanya17/flight-tracker-tanyajain.git

Navigate to the directory

cd flight-tracker-tanyajain

Install dependencies

npm install

Start the project

npm run dev

The application is built on Vite and is available on Port 5173.

Note: Please make sure to use your OpenSky account credentials to access the application. These details can be added to the "opensky-service.tsx" file.

Usage

This application provides real-time aviation data tracking. Once authorized with OpenSky credentials, the user can visualize the real-time position of aircraft on the map and access relevant flight data.

Features

  1. The application leverages the Mapbox API to provide a fully interactive map spanning the entire webpage.
  2. The map supports zooming in and out and can locate the user's current location.
  3. The map displays the real-time positions of aircraft. The aircraft icons are rotated in the direction they are headed.
  4. Clicking an aircraft icon presents a pop-up with the country of origin and the ICAO24 Code, a unique identifier for each aircraft.
  5. An information box at the bottom left of the page provides real-time insights and data for various flights.

Challenges

  1. Working within the API access limit of 80 minutes for registered users of the OpenSky Network.
  2. Managing dependency versions.
  3. Handling JSX constructor calls in React.

Future Optimizations

  1. Plan to integrate flight-specific information between the aircraft icons on the map and the data box at the bottom of the page, currently they are mutually exclusive functionalities on the application.
  2. Improve the user interface to make it more intuitive and information-rich.
  3. The potential addition of a landing page.
  4. I haven't been able to include tests at this time.