README.md 6.81 KB
Newer Older
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
1
[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.stud.ntnu.no/#https://gitlab.stud.idi.ntnu.no/it1901/todo-list) 
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
2

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
3
# todo-list-prosjektet
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
4

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
5
6
7
8
9
Dette prosjektet er et utviklingsprosjekt tilsvarende det en skal gjennom i IT1901. Det er ment å være til et nyttig eksempel på flere måter:
- Det viser hvordan prosjektet kan deles opp i mange fokuserte og håndterbare trinn
- Prosjektoppsett og kodingsteknikker
- Det er utgangspunktet for en videoserie som også viser hvordan det jobbes praktisk med utviklingsverktøy

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
10
Ikke alt vi gjør blir tatt opp på video, noe arbeid vil bli gjort som forarbeid eller mellom episodene, videoene skal gi en oversikt over alt arbeidet. Merk at oppsettet er ikke nødvendigvis likt fra år til år, så ikke alt kan gjøres på samme måte i ditt prosjekt.
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
11

12
13
14
15
16
17
18
19
20
## Bygging og kjøring av prosjektet

Prosjektet bruker maven til bygging og kjøring.

For å bygge, kjør `mvn install` fra rot-prosjektet (**todolist**-mappa). Dette vil kjøre alle tester og kvalitetssjekker.

Prosjektet må kjøres fra **fxui**-modulen, enten med `mvn javafx:run -f fxui/pom.xml` eller ved å først kjøre `cd fxui` og så `mvn javafx:run`.
Merk at man må først ha kjørt `mvn install` på modulene som **fxui**-modulen er avhengig av (pr. nå **core** og **fxutil**), for at det skal gå.

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
21
22
## Plan over arbeidet/episodene

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
23
Her følger oversikt over arbeidet/episodene. Først er dette en plan, men etterhvert som arbeidet blir utført så blir det en oversikt over faktisk gjennomført arbeid.
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
24

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
25
### Gitpodifisering av repoet og oppsett av første trinn av utviklingsprosjektet
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
26

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
27
Planen er å primært bruke gitpod til utvikling (selv om det kanskje ville vært mest praktisk for meg å bare bruke Eclipse).
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
28
Først må vi "gitpodifisere" repoet, dvs. gjøre at gitpod kan startes opp rett fra repo-sida på gitlab.
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
29

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
30
I starten så setter vi opp et enkelt JavaFX-prosjekt med **maven** som bygge-system. Vi setter det opp fra scratch, vha. en enkel mal for
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
31
32
33
34
maven-prosjekter og så justerer vi litt på det ved å kopiere elementer fra andre prosjekter.

Maler til javafx-prosjekter finnes bl.a. i [javafx-template-kodelageret](https://gitlab.stud.idi.ntnu.no/it1901/javafx-template). Varianter finnes for alt i én modul og pakke, alt i én modul, men egne pakker for domenelogikk og javafx-grensesnitt, og domenelogikk og javafx-grensesnitt i hver side moduler. Disse inneholder også module-info.java, slik at det blir enklere å kjøre koden i en IDE, altså uten bruk av maven i terminalen.

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
35
36
37
Jeg gjør det på denne måten, fordi det da er enklere å forklare hvert element i pom.xml-fila, som inneholder oppsettet.
Merk at prosjektoppsettet i starten er enklere enn det vil bli etter hvert, men vi gjør det sånn for å komme raskere i gang.
Så bygger vi ut og omstrukturerer når det trengs.
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
38

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
39
40
[Første episode](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?id=d6d40267-19f0-4b5a-87fd-ac2f00bbbaf6)

Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
41
### Vår første utviklingsoppgave: Et enkelt API for todo-lister
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
42

43
44
45
46
Vi tar utgangspunkt i [brukerhistorie 1](brukerhistorier.md) og definerer tre brukeroppgaver, én for API-et, en for JSON-basert tekstformat og én for GUI-et og begynner på API-et.
API-et består av to klasser, **TodoList** og **TodoItem**, hvor den første inneholder flere av den andre.
**TodoList** har metoder for å legge til, fjerne og hente ut TodoItem-elementer.

47
Det ble [to episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=54fc1b77-4d04-4fcb-8df2-ac32009ee479), episode 2 og 2b.
48
49
50
51
52

### JSON-basert tekstformat for handlelist-data

Vi bruker Jackson-biblioteket og implementerer serialisering- og deserialisering-klasser.

53
Det ble [to episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=048886e9-1d6b-4727-87e8-ac32008f58c6), episode 3 og 3b.
Hallvard Trætteberg's avatar
Hallvard Trætteberg committed
54
55

### Et enkelt JavaFX-GUI for todo-lista
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106

Vi bruker et **ListView** med en egen **ListCell**-subklasse som styrer hvordan hver rad ser ut.
Hver rad inneholder en avkrysningsboks (**CheckBox**) og en tekst (**Label**).
I redigeringsmodus brukes et tekstfelt for redigering av teksten.

Det ble [fem episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=4c54ab10-3aeb-427c-9ed0-ac3200a06eea), episode 4, 4b, 4c, 4d og 4e.

### Konfigurering av verktøy for kodekvalitet

Vi konfigurerer opp tre verktøy knyttet til kodekvalitet:

- [checkstyle](https://checkstyle.sourceforge.io) - sjekker mer overfladiske og stilmessige egenskaper til koden som tekst
- [spotbugs](https://spotbugs.github.io/) - analyserer koden for vanlige feil
- [jacoco](https://www.jacoco.org) - samler inn og presenterer informasjon og testdekningsgrad

Det be [én episode](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?id=4ff212a2-15f2-4009-9ec3-ac38010531bc), episode 5.

### Ulike typer forbedringer i brukergrensesnittet

Det ble [tre episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=954e3cfb-8692-4d91-ac65-ac3d0140642a), episode 6,6b og 6c.


### Oppdeling i flere moduler

Vi deler opp prosjektet i to moduler, én for kjernekoden (logikk og serialisering) og en for brukergrensesnittet.

Det ble [to episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=a3a720db-ad1e-4d04-a0c9-ac3f00a893ef), episode 7 og 7b.

### Om testing av brukergrensesnittet med TestFX

Vi implementerer (endelig) tester for brukergrensesnittkoden, vha. TestFX.

Det ble [to episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=77561481-581a-4731-8867-ac41007ae0e9), episode 8 og 8b.

### Kapsle inn bruken av Jackson

Vi ønsker å unngå at andre moduler får en kompileringsavhengighet til Jackson, bare fordi core-modulen har det.

Det ble [to episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=84e11eef-3289-420b-8721-ac4400fa3a80), 9 og 9b.

### Bruk av greiner for utviklingsoppgaver

Vi viser hvordan vi kan (og bør) bruke greiner for hver utviklingsoppgave.

Det ble [tre episoder](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?pid=a6a3fa27-9553-4043-8374-ac4700a9d6c3), 10, 10a og 10b.

### Oppdeling av FXML og flere kontrollere

Vi ønsker å unngå at kontrollerklassen blir for stor og kompleks, ved å dele opp i flere FXML-filer og tilhørende kontrollere.

Det ble [én episode](https://ntnu.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?id=8a8df17e-45e7-4a42-ab2c-ac4b00bec6fb), episode 11.
107
108
109
110
111
112
113
114

### Variant av app med dokument-metafor

Vi lager en variant av appen, som bruker dokument-metaforen og derfor inkluderer en **File**-meny med kommendoer som **New**, **Open** og **Save**.
Koden er basert på en nokså generell implementasjon av menyen og en egen kontroller, som har jeg har liggende fra tidligere.
Derfor legges den generelle koden i en egen **fxutil**-modul, som **fxui** får en avhengighet til.

Denne varianten startes ved å angi en egen såkalt *profil* med `mvn javafx:run -Pdocumentapp` (og om nødvendig -f-opsjonen).