The course information project (KIP) is an initiative at KTH that was launched in 2018 to improve the quality and availability of information about KTH:s courses. The background to the project is, among other things, that it was difficult for the student to find information about the courses and even more difficult to compare information about several courses. The reason for the problems is scattered course information in several places and that there is no uniformity or assigned places for the course information. The project takes measures to consolidate course information into two locations and to present the information in a manner that is uniform for KTH. The student should find the right information about the course, depending on their needs. The result of the project is a public course site where the correct course information is collected and presented uniformly. Also, a tool is developed for teachers to enter and publish course information. Eventually, this will lead to the student making better decisions based on their needs, and it will also reduce the burden on teachers and administration regarding questions and support for the student.
Kursinfo-admin-web is a microservice with an administration tool for teachers to enter and publish course information. Teachers can edit the introduction text and choose an image for a course. The tool also provides an entrance to other microservices like course memo och course history.
π Homepage
Firstly, the app displays en entrance page for services to organize information about course. Secondly user can edit a short description about a course and upload a image which will be displayed together with a short description on public pages of microservice kursinfo-web
The app consists of several pages:
- Administrate start page with menu and cards to show what can be changed by course coordinators and examiners. (requires no api keys, only kopps url)
localhost:3000/kursinfoadmin/kurser/kurs/:courseCode
- Course introduction text for course information page, which can be edited by course coordinators and examiners.
localhost:3000/kursinfoadmin/kurser/kurs/edit/:courseCode
- page to monitor images, if there are any missing files in blob storage or some unused files. BLOB_SERVICE_SAS_URL should include list rights, section "Generate Shared access signature"
localhost:3000/kursinfoadmin/kurser/kurs/_monitor_images
- Menu with navigation links for course information related pages (kursinfo-web, kursinfo-admin-web)
- Cards with navigation buttons leading to editing introduction text, editing course development, and history admin web
Application is fetching data from KOPPS-API for:
- Course title
- Introduction text from Kopps
Application is fetching data from kursinfo-api to show:
- Introduction text if it has been edited before and exists in kursinfo-api
REDIS_URI used is to cache a response from kopps api because it is used as a start page for other microservices and will be used intensively by user while going from one service to another. Though it should be avoided to cache kursinfo-api, or only for a short time.
We must try to make changes that affect the template projects in the template projects themselves.
- node 18
blob container (STORAGE_CONTAINER_NAME) kursinfo-image-container
While images uploads directly to a blob container located in a cloud in the storage account, f.e., kursinfostoragestage
, the name of uploaded image will be saved in kursinfo-api
.
To connect to blob storage, the Shared access signature is used to limit what can be done by using this signature, f.e., only read, or write and which services. In stage environment keys were generated on base of key2.
For each service generated a separate Shared access signature and saved(f.e., SAS-REF-blob-service-sas-url) in standard key vault.
It requires package "@azure/storage-blob": "^12.2.1"
. Further to parse a file between client and server, you need to have npm package body-parser
. More details in server/blobStorage.js
.
To generate it, go to a storage account, f.e., kursinfostoragestage
, choose Shared Access signature and choose:
- Allowed services: Blob
- Allowed resource types: Container, Object
- Allowed permissions: Read, Write, Create, List
- Start and expiry date/time
- HTTPS only
- Signing key: key1 or key2
After a generation of a key, copy Blob service SAS URL and save it in a standard key vault and set Expiration Date. Later you will use it as a BLOB_SERVICE_SAS_URL in secrets together with a name of blob container STORAGE_CONTAINER_NAME
Secrets during local development are stored in a gitignored .env
file (env.in
can be used as template for your .env
file). More details about environment variable setup and secrets can be found in confluence.
First time you might need to use options --ignore-scripts
because of npm resolutions:
npm install --ignore-scripts
or
npm install
You might need to install as well:
npm install cross-env
npm install concurrently
Start the service on localhost:3000/kursinfoadmin/kurser/kurs/:courseCode.
npm run start-dev
It's possible to use debugging options available in Visual Studio Code Add to .vscode file launch.json:
- Microsoft
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug kursinfo-admin-web",
"program": "${workspaceFolder}\\app.js",
"envFile": "${workspaceFolder}\\.env",
"env": {
"NODE_ENV": "development"
}
}
]
}
- Mac, Unix and so on
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug kursinfo-admin-web",
"program": "${workspaceFolder}/app.js",
"envFile": "${workspaceFolder}/.env",
"env": {
"NODE_ENV": "development"
}
}
]
}
npm run test
KURSINFO_API_URI
in docker-compose.yml
is configured for a local kursinfo-api, and might as well be changed to kursinfo-api in ref.
docker-compose up
@kth/kth-ckeditor-build package is used for editor. It uses gulp file to be built in /dist folder.
π€ KTH
- Website: https://kth.github.io/
- Github: @KTH