Back to projects

Project Case Study

Safe Flight

A travel risk planning website that helps users review destination safety before booking or departing. Safe Flight presents country risk levels in a polished travel-service interface, supports searchable destination data, and lets users save countries to a personal watchlist with a regular email and password account.

Built with
  • React 18
  • React Router
  • Axios
  • Python 3.11
  • Flask
  • PyMongo
  • MongoDB

Interface Tour

Primary Pages

The current UI uses a modern corporate travel style with a dark navigation bar, strong editorial hero sections, clean data tables, country flag imagery, and responsive layouts for desktop and mobile.

Features

What It Covers

01

Destination Search

Search and filter countries by destination name and risk level.

02

Risk Badges

View destination risk categories with scannable badges and country flag imagery.

03

Watchlist

Save destinations to a personal watchlist tied to a local email and password account.

04

Reliable Fallback

Use sample destination data when live advisory APIs are unavailable.

Technologies Used

Frontend, Backend, and Data

Frontend

React 18 React Router Axios Inter web font Web Crypto API Local Storage Create React App

Backend

Python 3.11 Flask PyMongo MongoDB Requests python-decouple Pipenv

APIs

AirLabs API Travel Advisory API

Build Notes

Implementation Details

Safe Flight pairs a React client with Flask API services, MongoDB-backed account data, destination-risk integrations, and fallback data paths so the main search experience remains usable even when external advisory data is unavailable.

  • Built responsive React routes for the home, risk search, watchlist, account, about, and contact pages.
  • Implemented searchable and filterable country-risk tables with flag imagery and scannable risk badges.
  • Created local email and password account flows using browser storage and Web Crypto APIs for client-side credential handling.
  • Connected Flask, PyMongo, MongoDB, Requests, AirLabs API, and Travel Advisory API paths for destination-risk data.
  • Added fallback sample destinations so the Risk Search page still works when live advisory APIs are unavailable.