Ramverk

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:

Vi försöker att utnyttja static generation så mycket det går. Statiska filer har många fördelar som prestanda, går att leverera från CDN samt är lättare att skala. Det går att bygga API:er 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:

  • 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

  • Moduler

  • Variabler

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

Cypress:

  • 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 API:er 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.