- We are a virtual company operating under WIMMA Lab of Jyväskylä University of Applied Sciences.
- Tukko Core - Documentation
- WIMMA Lab is a learning environment where students solve assignments in multidisciplinary project teams.
- Read more at wimmalab.org
- Is a part of Jyväskylä University of Applied Sciences jamk.fi
Name | Description | Company / entity Task Responsibilities | |
---|---|---|---|
Reima Parviainen | Team Leader | IoTitude / Lead the project and handle test planning | |
Justus Hänninen | Junior Developer | IoTitude / Backend, TypeScript, SKILL-db API | |
Hai Nguyen | Junior Developer | IoTitude / Backend, API, Data visualization, Gitlab Pipeline | |
Ilia Chichkanov | Junior Developer | IoTitude / Backend, SKILL-db API | |
Olli Kainu | Junior Developer | IoTitude / Frontend | |
Otto Nordling | Junior Developer / Tester | IoTitude / Testing | |
Alan Ousi | Junior Developer / Tester | IoTitude / Testing |
Tukko ("clog") is a traffic visualizer web application built with React
WIMMA Lab 2023 IoTitude created Tukko - Traffic Visualizer, an assigment given by Combitech. Tukko utilizes data from digitraffic API, and improves upon it by unifying the scattered info across multiple endpoints into our own much simpler API. We also gather data long term, which can later be shown to users to check for recent anomalies.
This data is then shown in a React based user interface, with mapping tools by Leaflet utilizing multiple plugins such as Geoman and Cluster markers. Utilizing custom icons, popups and tooltips, Tukko strives to convey information intuitively. For the more interested users, more in depth information is available. Development for Tukko followed best practices by utilizing a very strict ruleset maintained by Typescript and ESLint. Tukko is a complete product, but our team had many ideas left unfulfilled due to time constraints.
For development environment you will need:
- Your favorite code editor (vim, vscode, nano)
- Node.js (v18.16.0 or higher)
- Node Package Manager (npm)
- Git
- Tukko's backend (Github)
- Docker for production version (Docker)
# Use SSH to pull from Github
git pull git@github.com:reimbo/tukko.git
git pull git@github.com:reimbo/tukko-backend.git
# Change working directory to tukkos folder
cd traffic-visualizer
cd traffic-visualizer-backend
# Install node dependencies with npm for both
npm install
# Run frontend development environment with vite
# For backend the same and it runs "npm-run-all -p compose:dev debug"
npm run dev
# For backend install npm-run-all
sudo npm install -g npm-run-all
# Build and run backend containers
# "npm-run-all -p build compose:prod"
npm run prod
# Does the build and makes a Docker image for the frontend and runs it
# localhost:5173
# "docker stop container_name 2>/dev/null || true && docker rm travis --force 2>/dev/null || true && docker build -t travis:latest . && docker run -d --name travis -p 5173:80 travis:latest"
npm run prod
- Open Redis UI http://localhost:8001
- Check "I have read and understood the Terms" and Submit
- Username: default
- Password: travis_is_the_best
- Click Apply changes (a couple of times)
If you want to connect your Github/Gitlab ticketing system to the feedback form, create an access token with api-rights and add the token to the .env of the backend folder.
# Redis variables
REDIS_OM_URL=redis://redis-stack:6379
REDIS_OM_PASSW=tukko_is_the_best
#mongoDB variables
MONGO_INITDB_ROOT_USERNAME=admin
MONGO_INITDB_ROOT_PASSWORD=admin
DB_NAME=tukko
COLLECTION_NAME=tms
DB_CONN_STRING=mongodb://admin:admin@mongo:27017
# Node variables
TUKKO_DOMAIN=http://localhost:3001
PORT=3001
TMS_API_URL=https://tie.digitraffic.fi/api/tms/v1
TM_API_URL=https://tie.digitraffic.fi/api/traffic-message/v1
TMS_STATIONS_DATA_URL=https://tie.digitraffic.fi/api/tms/v1/stations/data
TMS_STATION_LIST_URL=https://tie.digitraffic.fi/api/tms/v1/stations
# Access token is used by the feedback form to insert 'customer feedback' labeled tickets
# straight into GitLab. You will need to generate a new one.
ACCESS_TOKEN=your_github_or_gitlab_access_token_here
- http://localhost:5173/
- Frontend should be running on port 5173. Go and enjoy!
- Click around! Go crazy!
Pull requests are welcome.