Sky Explorer – Flight Booking App

A little context

Sky Explorer is a flight-booking application built as a bootcamp final project.

My part: Frontend implementation in a two-person frontend team, including multi-step forms, state management, and responsive interfaces.

Status: Original React version completed; a planned Next.js iteration is paused.

What needed attention

Passengers should be able to go back and change a booking detail without re-entering the rest of the form.

Core Workflow

1. Search flights
2. Select flight
3. Passenger details
4. Cabin selection
5. Confirmation

The choices behind the screens

01

Status visibility

Visible progress

Use step indicators and clear loading and confirmation states.

02

Progressive disclosure

Focused steps

Reveal details and forms when they become relevant.

03

Error prevention

Inline validation

Flag missing fields and invalid dates before the form is submitted.

04

User control

Keep previous entries

Keep previous entries when navigating back through the booking flow.

05

State clarity

Loading, empty, and error states

Distinguish pending requests, empty search results, and errors.

Frontend Structure

1. React views and forms
2. Shared Recoil state
3. Reusable hooks and components

Implementation Focus

Reusable components, code splitting, and lazy loading supported the multi-step experience. Validation and feedback were handled consistently across search, passenger, and confirmation screens.

What I built

We completed the responsive booking flow for the bootcamp final project. It was a project build, not a commercial booking service.

What stayed with me

In our two-person frontend team, we had to agree on where booking data lived and how each step used it. Keeping earlier form entries available was a central part of that work.

What I’d explore next

A Next.js iteration is planned but paused due to work commitments. It has not shipped.