
What it is
Flight status tracking application. Users can search for flights and track the flight status. This application allows users to track multiple flights and receive updates as well as detailed weather information.


How it's built
The frontend of this project is built using React for the user interface and Vite as the build tool & development server. Styled using Tailwind CSS, the frontend uses supabase-js to query the corresponding Supabase project which serves as the backend of this project. The backend consists of two large Supabase Edge Functions that handle the flight & weather lookups, updates & search scheduling.
Deployment & CI/CD
Both the backend & frontend of this application take advantage of Github Actions for CI/CD. The frontend is containerized and pushed to Amazon ECR, where the container image is used to deploy the frontend in an Elastic Beanstalk environment. Backend development of the serverless functions and database migrations are also deployed via Github Actions to both a staging & production Supabase projects.
Functionality
- Website allows users to sign-up & authenticate using OAuth 2.0 via Supabase providers. Google & Github enabled - others can be added.
- Users can search for, select, add, delete & track specific flights available from the FlightAware Aero API.
- The application updates user selected flights on a regular schedule to retrieve the latest status updates.
- Users can schedule future flights and the application will retrieve the information and notify user when it becomes available.
- Users can update their profile, view status updates & delete tracked flights.
- Realtime in-app notifications allow users to receive the latest updates.
Technologies
- React: Frontend user interface
- Vite: Tooling & development server
- Supabase Javascript Client Library: Open source Firebase althernative. Database, authentication & webhooks
- Tailwind CSS: CSS framework
- OAuth 2.0: Authorization protocol
- React Router: Client routing
- ESLint: Static code linting
- Github Actions: Build & deploy application
- Amazon Elastic Container Registry
Lessons learned
Always double-check API features and spend the time testing & learning about external API's before deciding to integrate.