completed

FYA Trans Frontend

A comprehensive ticketing and transportation management system for FYA Trans travel company

Tech Stack

Next.js TypeScript React TailwindCSS React Query Zustand Drizzle ORM
FYA Trans Frontend
Project Details

FYA Trans is a comprehensive web application built to handle the ticketing system for FYA Trans, a transportation company operating bus routes across multiple cities in Romania. The platform allows travelers to search for routes, book tickets, and make payments online.

Motivation

Transportation companies often struggle with outdated booking systems that don’t provide good user experience and lack integration with modern payment solutions. FYA Trans needed a modern, user-friendly platform that could handle route management, ticket reservations, and provide a smooth booking experience for customers.

What It Does

The FYA Trans platform offers a complete ticketing solution with features including:

  • Route Search & Booking: Users can search for bus routes between cities, select dates, view available departure times, and book tickets.
  • Round Trip Support: Option to book return trips with specific dates.
  • Online Payment: Integrated payment processing with ING payment gateway.
  • Ticket Management: Customers receive confirmation emails with tickets.
  • Route Management: Admin functionality to manage bus routes, schedules, and pricing.
  • Responsive Design: Works seamlessly across desktop and mobile devices.
  • Progressive Web App: Installable on mobile devices for quick access.

How It Works

The application has an intuitive flow:

  1. Search: Users select departure and arrival cities, date, and number of passengers.
  2. Route Selection: Available routes with times and prices are displayed.
  3. Passenger Information: Customers enter passenger details and contact information.
  4. Payment: Integration with ING payment gateway for secure transactions.
  5. Confirmation: Upon successful payment, tickets are issued via email.

The system also handles important business logic like blocking bookings too close to departure time and managing seat availability.

Technologies Used

  • Frontend: Next.js 14, TypeScript, React, TailwindCSS
  • State Management: Zustand for global state, React Query for data fetching
  • Form Handling: React Hook Form with Zod validation
  • UI Components: Custom UI components with Radix UI primitives
  • Mapping: Google Maps integration for station locations

Key Features

  • Real-time Availability: Shows available seats in real-time
  • Multi-city Routes: Supports complex routes with multiple stops
  • Date-based Search: Calendar integration for easy date selection
  • Responsive Design: Mobile-first approach for all user interfaces
  • Email Notifications: Automated ticket delivery system
  • Payment Processing: Secure payment handling with ING

The FYA Trans platform demonstrates how modern web technologies can transform traditional transportation booking systems into efficient, user-friendly digital experiences that benefit both the company and its customers.