Airplane Disco ✈️🪩

Airplane Scatter prediction calculator

This project uses Vue 3, Typescript, Vite, and Tailwind. In order to proxy API requests it uses Cloudflare Pages Functions. Deployed on Cloudflare Pages.

Roadmap

Development

Copy .env.example to .env.local

Copy .dev.vars.example to .dev.vars.

Get an API key from ADS-B Exchange. You'll have to register on RapidAPI and subscribe to the API.

Update AIRCRAFT_SCATTER_API_KEY in .dev.vars

# Set Node version
n auto

# Install dependencies
npm install

# Run cloudflare proxy + Vite development server
npm run dev

Development server will be available on http://localhost:4220

What's the difference between 4220 and 5173 ports?

Great question. 5173 (kinda looks like VITE) is Vite development server port. 4220 (kinda looks like Airbus A220) is Cloudflare dev server port. Cloudflare proxies requests to Vite:

Your browser -> Cloudflare -> Vite

It works the same way in production. In this project, we use Cloudflare as a "backend" and it only processes /airplanes endpoint which responds with a JSON.