

Application Architecture met Express
Application Architecture met Express
APPLICATIE TYPES


Client - Server


Client - Server
Client

Server


OF

Programming 3: Advanced
Client


REST API
Server Side Rendering







Programming 4
Client

REST API
Server

GraphQL

Application Architecture met Express
ExpressJS


Express.js, of simpelweg Express, is een back-end webapplicatieframework voor Node.js, uitgebracht als gratis en open-source software. Het is ontworpen voor het bouwen van webapplicaties en API's. Het wordt het de facto standaard serverraamwerk voor Node.js.
ExpressJS
- Website
- Maak een nieuwe NodeJS applicatie met ExpressJS aan
$ mkdir myapp
$ cd myapp
$ npm init -y
$ npm install express --save
- We werken altijd met ES6 modules

ExpressJS
- Maak in je index.js een hello world applicatie
import express from "express";
const app = express()
const port = 3000
app.get('/', (req, res) => {
res.send('Hello World!')
})
app.listen(port, () => {
console.log(`Example app listening on port ${port}`)
})

ExpressJS
- Start je app
$ node app.js

- Installeer nodemon en maak een nodemon.config bestand aan
- Pas je scripts aan in je package.json
ExpressJS
- Maak een src folder aan, hier komt de broncode van je applicatie
- Verplaats je app.js bestand naar de src folder
- Pas de main key aan in je package.json
- Maak een folder views
- Maak een bestand index.html
- Zorg dat je node applicatie je index.html bestand teruggeeft wanneer ik met de browser naar '/' navigeer via een controller

ExpressJS
- Maak in de root van je project een public folder aan
- Maak hierin vier nieuwe folders aan:
- assets
- images
- css
- scripts
- Zorg dat je deze statische bestand kenbaar maakt voor de buitenwereld via Express

ExpressJS
- Voeg een stylesheet to in ./public/css/styles.css
- Je kan ook de reset.css van meyer toevoegen
- Koppel de stylesheet aan je index.html

Opdracht - Make IT Happen


PGM3/2 - Application Architecture met Express
By Frederick Roegiers
PGM3/2 - Application Architecture met Express
- 59