Tämä on Digivertaisverkkohanketta varten toteutetun opetuskäyttöön tarkoitetun Tukki-tikettijärjestelmän web-käyttöliittymä. Web-käyttöliittymä on toteutettu Angularilla. Web-käyttöliittymä kommunikoi erikseen asennettavan palvelimen Tukki-backend kanssa. Web-käyttöliittymän arkkitehtuurin kuvaus löytyy tiedostosta documentation/kuvaus/kuvaus.md.
Web-käyttöliittymä tarvitsee toimiakseen palvelimen Tukki-backend. Katso ohjeet sen asentamiseksi projektin GitHub sivulta. Sieltä löytyy myös ohjeet tämän web-käyttöliittymän ajamiseen yhdessä palvelimen kanssa.
Alla on ohjeet miten käytät tätä projektia kehitystyössä. Ohjeet olettavat sinun asentaneen palvelimen Tukki-backend sen ohjeiden mukaan.
npm install -g @angular/cli@16.2
. Projektissa käytetty Angularin versio on 16.2.FRONTEND_DIRECTORY
osoittamaan kyseisessä kansiossa olevaan /dist/tukki-front -hakemistoon. Esimerkiksi FRONTEND_DIRECTORY=/home/user/UKK-tiketit/dist/tukki-front/
npm ci
asentaaksesi projektin riippuvuudetnpm run build
kääntääksesi projektin.Aja komento npm run build
kääntääksesi projektin production
versiona.
Aja komento npm run build:dev
kääntääksesi projektin development
versiona.
Aja komento npm run watch
, jos haluat tehdä kehitystyötä. Tällöin projekti käännetään development
versiona ja kääntäminen tapahtuu tiedostojen muuttumisen yhteydessä.
Projektin käännetty versio sijaitsee dist/tukki-front/
hakemistossa.
Aja komento npm run test
ajaaksesi kaikki projektin testit Karmalla. Testit sijaitsevat *.spec.ts -tiedostoissa jokaisen komponentin, servicen ja pipen yhteydessä.
Testejä voi ajaa myös testitiedosto kerrallaan käyttäen --include
argumenttia. Esimerkiksi SubmitTicketComponent testit voi ajaa komennolla npm run test --include **/submit-ticket.component.spec.ts
Testit ajetaan käyttäen Google Chrome -selainta. Joissain tapauksissa testiympäristö ei havaitse automaattisesti Chromen binaaria ja tällöin joudut asettamaan ympäristömuuttujan CHROME_BIN
. Esimerkiksi CHROME_BIN=chromium npm run test
.
Projektiin on myös määritelty production
testien ajaminen npm run test:prod
komennolla, joka ajaa testit argumenteilla --browsers=ChromeHeadless --watch=false --code-coverage
.