Senior Full-Stack Engineer at Schoolz

Routz

Fleet management and school transportation for operators, drivers, and families

When: Jan 2025 – present
Team: Part-time consultant until Apr 2026, full-time since May 2026. I own the web frontend and the real-time services.

Vue 3
Node.js sockets
GPS tracking
In-app chat
PayTabs
Arabic/English

In short

Routz is Schoolz's cloud platform for school and corporate transport in Egypt and the region. Operators plan routes and trips, follow vehicles live, and sell subscriptions to families; drivers and passengers use the Routz and Routz Captain mobile apps. I joined in January 2025 and built the Vue 3 web application from the first screen: the admin and client dashboards, the live tracking and chat layer over custom Node.js socket services, and the passenger subscription flow with online payment.

My role and scope

I own the web frontend: the admin and client dashboards from the first commit, the shared component library, and the frontend workflows for drivers, trips, billing, and subscriptions. I also built the real-time layer across the stack: the socket services and the tracking and chat features that run in the dashboards and inside the mobile apps. The native mobile apps themselves are built by the mobile team.

The problem

A school or company transport team runs dozens of daily trips with drivers, assistants, stops, and passengers that change every week. The control room needs one live view of every active vehicle, families want to know where the bus is and to pay for their seat without calling the office, and drivers need clear instructions trip by trip. All of this has to work in Arabic and English, because the operators and families are in Egypt and the Gulf.

When I joined, the web application did not exist yet. The brief was to build the operator dashboards from the ground up while the real-time features were designed at the same time.

How it is built

The web application is a Vue 3 single-page app with two surfaces: an admin dashboard for Schoolz and a client dashboard for each operator. Both are built from one shared component library and a set of composables, so every screen works in Arabic (right-to-left) and English.

Live data comes from custom Node.js socket services that I built end to end: the driver app pushes GPS positions, the services fan them out to the dashboards and the passenger app, and the same channel carries the in-app chat between operators, passengers, and drivers on web and mobile. Mapping and geocoding APIs provide route planning, stop search, and the live map. Passenger subscriptions run through an in-app flow (registration, package selection, PayTabs online payment) that feeds the operator's billing screens.

Routz web app (Vue 3, Arabic/English)
        ├── Admin dashboard (Schoolz) · Client dashboard (operators)
        ├── Shared components and composables (RTL-first)
        └── Mapping and geocoding APIs (routes, stops, live map)
                    │  socket events
                    ▼
Custom Node.js socket services (built end to end)
        ├── Live GPS positions: driver app → dashboards and passenger app
        └── In-app chat: operators ↔ passengers ↔ drivers (web and mobile)
                    │
                    ▼
Subscriptions: in-app registration → package → PayTabs payment → billing

Key decisions

Custom socket services instead of polling

Live positions and chat are the core of the operator experience; a push channel keeps the map current without hammering the API.

One shared component library for both dashboards

Admin and client screens share tables, forms, and map widgets, so right-to-left and translation are solved once.

PayTabs for passenger payments

A gateway used across Egypt and the Gulf lets families pay with local cards inside the app.

Mapping and geocoding APIs rather than a custom map stack

Route planning and stop search depend on accurate geocoding; the APIs let the team focus on the workflows around the map.

What it changed for the product

Gives the control room a live view of active trips and driver locations.
Lets families register, choose a package, and pay online instead of calling the office.
Puts operators, passengers, and drivers in one chat thread per trip.
Serves operators and families in Arabic or English from the same code.

Hard parts and how I solved them

A live view of every active trip

What I didBuilt the live tracking map on top of custom Node.js socket services, so operators follow vehicles and driver locations as they move instead of refreshing a list.

Chat between operators, passengers, and drivers

What I didDelivered the in-app chat end to end, backend and web frontend plus the mobile apps, over the same socket layer as tracking, so a question about a late bus reaches the driver and the office at once.

Families paying without the office

What I didShipped the passenger self-service flow: registration, package selection, and online payment through PayTabs, connected to the operator's subscription and billing workflows.

Routes and stops on a map

What I didIntegrated mapping and geocoding APIs for route planning, location search, and map interactions in the trip and destination workflows.

One interface in two directions

What I didEstablished shared Vue components and composables that handle right-to-left layout and translation, so every new screen is bilingual by default.

Stack and what each part does

Vue 3Admin and client dashboards, built from the ground up
Node.js socket servicesLive trip and driver-location updates, in-app chat
Mapping and geocoding APIsRoute planning, stop search, live map
PayTabsOnline payment in the passenger subscription flow
Arabic and EnglishRight-to-left first, shared components and composables

Highlights

GPS visibility into active trips and driver locationsLive operations

In-app chat between operators, passengers, and driversCommunication

Self-service subscriptions paid online through PayTabsPayments

One bilingual component library behind both dashboardsShared frontend

Screens

Dashboard screens are from the production operator app of a live tenant, captured in November 2026 outside school hours. Parent, child and driver names and plate numbers are pixelated. The mobile screens are from the public site at routz.me.

Operator dashboard: today's trips, passengers, subscriptions and invoices, a priority queue, and the live map

Live tracking: active trips list with the socket status, filters by school, government and direction, and the vehicle map

Manage operations: daily trips with captain, vehicle, status and schedule, plus unassigned passengers and requests queues

Subscriptions: package, billing period, amount, approval status and end date per family

Payment methods: offline methods that require approval next to PayTabs gateways for cards, wallets and installments

Pay link settings: each operator gets a public pay portal URL and can require a verification code

The public pay portal where a parent opens their balance with a phone number and pays online

The same dashboard in Arabic, fully mirrored for right-to-left reading

The passenger app with today's trips and the captain app after a completed trip, from routz.me

Working on a similar product?

If you need someone to own a product frontend, lead a frontend team, or ship an Arabic and English interface, let's talk.

Email me LinkedIn