Krav: Node 12.0+
Både front-end och back-end ska utvecklas i NodeJs-miljö tillsammans med TypeScript för att få en konsekvent utvecklingsmiljö och stark typad kod. Nedanför finns ramverk och verktyg beskrivet.
För att slippa sätta upp allt varje gång så finns en starter här: LÄNK
Front End
NextJS / React
Front-end byggs i React + TypeScript tillsammans med NextJS för att utnyttja bland annat:
Server Side Rendering (SSR)
Vi försöker att utnyttja static generation så mycket det går. Statiska filer har många fördelar som prestanda samt går att leverera från CDN samt är lättare att skala. Det går att bygga APIer direkt i NextJS vid behov men om det byggs i Express så blir det mer frånkopplat och lättare att anpassa.
Tailwind + Sass
Designriktlinjer: LÄNK
Tailwind är ett utility-ramverk för CSS som kommer med mycket out of-the-box som:
Färger / Teman
Media query breakpoints
Avstånd / Marginaler
Utility-klasser för nästan allt
Sass superset-språk av CSS.
Några features:
Nesting
Mixins
Modules
Variables
ESLint + Prettier
ESLint & Prettier används för linting och formatering av kod för att få så konsekvent kod som möjligt som följer samma standard och formatering. Den ESLint-profil som ska användas är den NextJS rekommenderar.
Jest + Cypress
NextJS rekommenderar Jest och Cypress för tester: NextJS testing
End-to-End (E2E)
Integration Testing
Jest:
Unit Testing
Back End
Express + TypeScript
Back-end byggs med Express som är en webb/applikations-server för NodeJS. Fördelen att bygga en separat back-end istället för att använda APIer i NextJS är att få en headless arkitektur där det lätt går att koppla på nya front-ends eller byta ut befintlig front-end. Man kan även skala front och back-end separat vid behov.
Jest + SuperTest
Jest används för enhetstester i back-end precis som i front-end tillsammans med SuperTest för HTTP-tester.
Allmänt
Miljövariabler
Miljöspecifika variabler ska ligga i .env-filer eller annat motsvarande, ska ej ligga hårdkodat. Inga lösenord, API-nycklar, tokens eller liknande ska finnas i koden.