/velocity-pwa

🚴‍♂️💨 An alternative https://velocity-aachen.de/menu

Primary LanguageTypeScript

Velocity PWA

This is an improved version of the e-bike-rental PWA found at https://velocity-aachen.de/menu.

It was rewritten from the ground up in modern React for improved performance and a better user experience. Originally written to be a 1:1 clone of the existing PWA it now has diverged from the official web app to integrate some improvements in regards to the bike booking & rental process and an improved overview over the map.

The PWA contains a service worker (that is currently disabled on iOS) and can be installed as a Chrome PWA.

Building

This project uses Create-React-App as its build process & yarn for package management. Compiling is straightforward:

yarn build

You will find the minified & bundled sources in the build folder. They can be served from any static web server.

CORS Proxy

Due to CORS restrictions (and for various other reasons), the PWA requires an API proxy to Velocity's backend and to the OpenStreetMap tile servers. During development, the proxy is provided by Create-React-App. For production usage, the app is already configured for a Netlify deployment.

If you want to configure the proxy manually, take a look at the _redirects file. It lists the required rewrite rules in Netlify syntax that should be quite easy to understand & to transfer to a more general proxy solution.

Bundle Analysis

The build process will generate a bundle analysis of the compiled code at build/bundle-stats.html.

Development

yarn start

The web app will by default be served on localhost:3000.

Screenshots

Mobile

mobile-1-map

mobile-2-menu

mobile-3-popup

mobile-4-no-bikes

Desktop

desktop-1-map

desktop-2-popup

desktop-3-rent-at-slot