Digitransit APIs require registration. More information
Digitransit-ui
Digitransit-ui is a mobile friendly User interface built to work with Digitransit APIs.
Service Architecture
Application is built with React. React components can access data in two different ways:
- Routing-API queries with Relay
- Other API with Flux model
Basically, division between alternatives is:
- GraphQL is used to fetch data from server
- If server endpoint does not support GraphQL, flux can be used to retrieve that data
- Flux stores are mainly used to store application state
Installation
Installation instructions are available at GitHub
Tests
Unit testing is used.
Service dependencies
| Asset | Url |
|---|---|
| Routing - API | https://digitransit.fi/en/developers/apis/1-routing-api/ |
| Realtime HSL - API | https://digitransit.fi/en/developers/apis/5-realtime-api/ |
| Map - API | https://digitransit.fi/en/developers/apis/4-map-api/ |
| Geocoding - API | https://digitransit.fi/en/developers/apis/3-geocoding-api/ |
Key service delivery activities
- Keep up with key project dependencies on GitHub
| Dependecy | url |
|---|---|
| React | https://github.com/facebook/react |
| React-leaflet | https://github.com/PaulLeCam/react-leaflet |
| React-router | https://github.com/rackt/react-router |
| React-autosuggest | https://github.com/moroshko/react-autosuggest |
| react-router-relay | https://github.com/relay-tools/react-router-relay |
| Relay | https://github.com/facebook/relay |
| Babel relay plugin | https://github.com/facebook/relay |
| Fluxible | https://github.com/yahoo/fluxible |
| Leaflet | https://github.com/Leaflet/Leaflet |
| MQTT.js | https://github.com/mqttjs/MQTT.js |
| Polyfill-service | https://github.com/Financial-Times/polyfill-service |
| PBF | https://github.com/mapbox/pbf |
| Webpack | https://github.com/webpack/webpack |
- Follow GraphQL specification
https://graphql.org/https://graphql.org/ - From time to time check HSL style guide
https://www.hsl.fi/tyyliopas - Follow EcmaScript, and browser development
https://esdiscuss.org/
https://discuss.babeljs.io/
http://www.ecma-international.org/news/index.html
http://caniuse.com/#info_news
Project assets
| Asset | Url |
|---|---|
| source | https://github.com/HSLdevcom/digitransit-ui |
| DockerHub | https://hub.docker.com/r/hsldevcom/digitransit-ui/ |
| Dockerfile | https://github.com/HSLdevcom/digitransit-ui/blob/v3/Dockerfile |
Key technologies and specifications
- React (https://react.dev/)
- Leaflet (http://leafletjs.com/)
- Relay (https://relay.dev/)
Docker image
The Docker image is called hsldevcom/digitransit-ui:v3-prod and it is available at DockerHub.
To run Docker container, run:
docker run -p 8080:8080 -it -e CONFIG=hsl -e API_URL=https://api.digitransit.fi -e MAP_URL=https://cdn.digitransit.fi -e NODE_OPTS=--max_old_space_size=1500 -e API_SUBSCRIPTION_QUERY_PARAMETER_NAME=digitransit-subscription-key -e API_SUBSCRIPTION_HEADER_NAME=digitransit-subscription-key -e API_SUBSCRIPTION_TOKEN=<your subscription key> hsldevcom/digitransit-ui:v3-prodTo access Docker container:
http://localhost:8080/For More information about how to use Docker see docker info.