ruston-rides is a modern, multi-role ride-hailing web app frontend built with Next.js and TypeScript. It delivers a seamless experience for both customers and drivers, featuring real-time location tracking, robust authentication, and a frictionless booking and payment flow. Designed for performance, accessibility, and developer productivity.
Deliver a fast, accessible, and maintainable frontend supporting:
- Role-based flows for customers and drivers
- Real-time location updates and ride status
- Frictionless booking and payment experience
- Optimized performance and accessibility
- Next.js (App Router)
- React + TypeScript
- Tailwind CSS
- Google Maps JavaScript API (map + driver tracking)
- WebSocket / long-polling for real-time updates
- Vercel for deployment
git clone https://github.com/SolidKing-1/ruston-rides.git
cd ruston-ridesnpm installCreate a .env.local file in the root directory:
NEXT_PUBLIC_GOOGLE_MAPS_API_KEY=your-google-maps-api-key
NEXT_PUBLIC_WEBSOCKET_URL=your-websocket-url
# Add other required variables herenpm run devOpen http://localhost:3000 in your browser.
Build for production:
npm run build
npm startRecommended: Deploy to Vercel for optimal performance.
- Role-based UI: Distinct flows and pages for customers and drivers.
- Real-time updates: Sub-second driver location and ride status refresh.
- Component-driven architecture: Reusable TSX components and typed contracts.
- Performance-focused: SSR/SSG, code-splitting, and Tailwind optimization.
- Accessibility: Keyboard navigation, semantic HTML, and client-side validation.
- Payments-ready: Scaffold for integrating payment providers.
- Fork the repo and create your branch:
git checkout -b feature/your-feature - Commit your changes:
git commit -m 'Add some feature' - Push to the branch:
git push origin feature/your-feature - Open a pull request
- Issues: GitHub Issues
- Email: kingsleyap3@.com
Built with ❤️ by [Kingsley Oppong Appiah]