Prosjektstruktur

Denne siden gir en strukturert oversikt over mappestruktur, viktige filer og organisering av backend og frontend i prosjektet.

---

Oversikt

Prosjektet er organisert i to hoveddeler:

• Backend – Java 21, Spring Boot 3, JDBC, Flyway, REST
• Frontend – React

---

Backend

Mappestruktur

.
└── src
    ├── main
    │   ├── java
    │   │   └── no
    │   │       └── ntnu
    │   │           └── idatt2106
    │   │               └── backend
    │   │                   ├── config
    │   │                   ├── controller
    │   │                   ├── exception
    │   │                   ├── model
    │   │                   │   ├── base
    │   │                   │   ├── request
    │   │                   │   ├── response
    │   │                   │   └── update
    │   │                   ├── repository
    │   │                   ├── service
    │   │                   │   └── mapper
    │   │                   ├── util
    │   │                   └── websocket
    │   └── resources
    └── tests

Sentrale mapper med beskrivelse av innhold:

Filsti	Beskrivelse
src/main	Kildekode og ressurser
../controller	Controller klasser
../service	Service klasser
../repository	Repository klasser
../model/base	Entitetsklasser
../model/request	Forespørsler fra frontend (DTO)
../model/response	Responser til frontend (DTO)
../model/update	Forespørsler om oppdateringer (DTO)
../service/mapper	Klasser for å lett mappe requests og update model objekter til base, og base til response
../exception	Exception håndtering
../config	Konfigurasjon til backend
../util	Diverse hjelpefunksjoner

Rammeverk

• Spring Boot: Java-Rammeverk for utvikling av Spring-baserte applikasjoner.

Avhengigheter

• Project lombok: Java bibilotek men annotasjoner som tillater automatisk generering av boilerplate kode som getters og setters.
• Dotenv Java: Bibliotek for å bruke miljøvariabler.
• JJWT: Bibliotek for generering og verifisering av JSON Web Tokens.
• MySQL Connector: MySQL JDBC Driver
• SpringDoc: Dokumentasjon for endepunkter
• H2: Testdatabase
• FlyWay: Oppdatere database med migrasjoner.

Alle avhengigheter i prosjekter ligger definert i pom.xml.

Byggesystem

• Maven: Bygge backend

---

Frontend

Mappestruktur

.
├── cypress
│   ├── e2e
├── public
└── src
    ├── actions
    ├── app
    ├── components
    │   └── ui
    │       └── form
    ├── types
    └── util

Mappestrukturen inneholder et par sentrale mapper:

Filsti	Beskrivelse
cypress/e2e	Ende-til-ende tester
public.	Offentlige filer f.eks bilder
src	kildekode
src/actions	Alle API-kall
src/app	Sider
src/components	Gjenbrukbare react-komponenter
src/components/ui	UI-komponenter
src/components/ui/form	Form-komponenter
src/types	Typedeklarasjoner
src/util	Diverse hjelpefunksjoner

Rammeverk

Frontenden bruker diverse rammeverk:

• React: Komponentorientert Javascript frontendrammeverk.
• Next.js: Fullstack react metarammeverk med støtte for blant annet SSR og HTML-streaming.
• Tailwindcss: CSS-rammeverk for å skrive CSS-klassenavn direkte i react-kode.

Biblioteker

I tillegg til rammeverkene brukes det mange biblioteker. De mest sentrale inkluderer:

• TanStack Query: Tilstandshåndteringsbibliotek for henting og mutering av data fra backend.
• TanStack Form: Tilstandshåndteringsbibliotek for html skjemaer.
• Zod: html skjemavalideringsbibliotek.
• Radix: Ustilte React UI komponenter.
• Next-auth: Autentisering.
• Stompjs: Websocket tilkoblinger.
• React-map-gl: Kartvisning.

Alle biblioteker brukt ligger definert i package.json.

Eksterne programmer

For å kunne kjøre og bygge prosjektet kreves det også noen eksterne programmer:

• Node.js: Kjøre frontend-serveren.
• Npm: Installere nødvendige pakker og kjøre frontend-serveren.