This single page application was created as a submission to a coding challenge set by Ovatu Interview Process.
Tech stack:
- Vue.js
- Tailwind CSS
An airport schedule app with the following features:
- Uses the Aviation API by AirLabs
- Fully responsive web app
- Users can select an airport from a list of major Australian airports
- Includes a schedule of all departures and arrivals for the selected airport for the current day
- Each list is searchable by flight name and paginated
- Clicking on a row in the schedule opens a modal to show more information about the flight
- Add dynamic colours to the flight status in the FlightInfo modal
- Combine API calls for
fetchFlightInfoandfetchScheduleto reduce number of API requests and improve performance - Render a static table and add a custom skeleton loader component within each row of the table for initial loading state
VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).
See Vite Configuration Reference.
npm installnpm run devnpm run build