SG Bus Arrival

A modern PWA for real‑time bus timings in Singapore.

SG Bus Arrival lets you pin your favourite bus stops and see live arrival times on mobile or desktop. The app sends push alerts and can be installed to your home screen.

For commuters who live near a bus station and want an easy way to plan the trip from home to office and back, SG Bus Arrival cuts out the extra steps of using Google Maps. Pin your usual stops and check timings instantly.

Features

• Live data from arrivelah2.busrouter.sg
• Push notifications when your bus is approaching
• Add favourites and choose the services to track
• Light & dark themes with automatic system detection
• Weather forecast for the next few hours

Tech Stack

• React & TypeScript
• Tailwind CSS with shadcn/ui
• TanStack Query for data fetching
• Service worker via vite-plugin-pwa
• Netlify Functions for notifications and settings storage

Getting Started

Prerequisites

• Node.js 22+
• pnpm (or npm)

Installation

# clone the repo
git clone <repo-url>
cd bus-arrival-app

# install dependencies
pnpm install

# copy environment variables
cp .env.example .env
# edit .env with your VAPID and JWT keys

Development

Start the dev server and open http://localhost:5173:

pnpm run dev

Running Tests

pnpm test

Production Build

pnpm run build

The static files are written to dist/. Deploy to any static host or Netlify (see netlify.toml).

Data Sources

• Real-time bus arrivals from arrivelah2.busrouter.sg (Singapore LTA DataMall)
• Weather data from Open-Meteo

Contributing

Bug reports and pull requests are welcome. Please fork the repository and open a PR.

License

MIT

Acknowledgements

Built with shadcn/ui components and Lucide icons. Made with ❤️ for Singapore commuters.