Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/totaro/citybike
Reading postgreSQL database and display data on HTML-page using javascript and Node.js
https://github.com/totaro/citybike
api database expressjs fetch html javascript nodejs pg postgresql
Last synced: 2 days ago
JSON representation
Reading postgreSQL database and display data on HTML-page using javascript and Node.js
- Host: GitHub
- URL: https://github.com/totaro/citybike
- Owner: totaro
- Created: 2023-11-12T20:14:26.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-11-14T09:47:02.000Z (about 1 year ago)
- Last Synced: 2023-11-15T09:33:02.268Z (about 1 year ago)
- Topics: api, database, expressjs, fetch, html, javascript, nodejs, pg, postgresql
- Language: JavaScript
- Homepage:
- Size: 48.8 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Project: citybike
https://github.com/solita/dev-academy-spring-2024-exercise
Let's imagine that you have received an interesting project offer to create a UI and a backend service for displaying data from journeys made with city bikes in the Helsinki Capital area.
The exercise uses data that is owned by City Bike Finland. We provide database to you in a Docker container, but the original datasets can be downloaded from here:
https://dev.hsl.fi/citybikes/od-trips-2021/2021-05.csv
https://dev.hsl.fi/citybikes/od-trips-2021/2021-06.csv
https://dev.hsl.fi/citybikes/od-trips-2021/2021-07.csv
Also, the database is created using dataset that has information about Helsinki Region Transport’s (HSL) city bicycle stations.
Dataset: https://opendata.arcgis.com/datasets/726277c507ef4914b0aec3cbcfcbfafc_0.csv
License and information: https://www.avoindata.fi/data/en/dataset/hsl-n-kaupunkipyoraasemat/resource/a23eef3a-cc40-4608-8aa2-c730d17e8902
The exercise
Create a web application that uses a backend service to fetch the data. Backend can be made with any technology. We at Solita use for example (not in preference order) Java/Kotlin/C#/TypeScript but you are free to choose any other technology as well.
You are provided with Docker setup, with contains a PostgreSQL database with all the necessary data for the exercise.
You can also freely choose the frontend technologies to use. The important part is to give good instructions on how to build and run the project.
- local docker PostgreSQL
- station and journey tables
Functional requirements
Station list
- List all stations
- Link to single station views
Single station views
- Station name
- Station address
- Total number of journeys starting from the station
- Total number of journeys ending at the station
- Average distance of journeys starting from the station
- Avarage duration of journeys starting from the station
# Solution:
javascript and html / express and pg node.js modules / webpack
- Server-side Node.js script (server.js) that connects PostgreSQL database and makes API endpoint for fetching data.
- Client-side script (client.js) that uses Fetch API to get data from server.
- webpack.config.js file for configuring Webpack that is used to bundle client.js (command: npx webpack --config webpack.config.js)
- HTML file (index.html) where fetched data is displayed on data-container div and includes the bundled script (bundle.js).
- Running server (command: node server.js) and open in browser at http://localhost:3000
