[[:oktatas:web:back-end_framework:express|< Express]] ====== Express - Kezdés ====== * **Szerző:** Sallai András * Copyright (c) 2023, Sallai András * Szerkesztve: 2024, 2025 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]] * Web: https://szit.hu ===== Az Expressről ===== Az Express segítségével gyorsan készíthetünk webalkalmazást JavaScript nyelven, Node.js alapokon. Kezeli a HTTP kéréseket, támogatja a middleware használatát. ===== VSCode ===== Ajánlott bővítmény a VSCode számára: * Node.js Modules Intellisense ===== Projekt készítése ===== Készítsünk egy Node.js projektet:


yarn init -y

vagy:


npm init -y

A yarn parancs használata esetén, lesz egy ilyen package.json állományunk:


{
  "name": "app04",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
}

Az npm parancs esetén ez egy kicsit bővebb. Telepítsük az express csomagot:


npm install express

Használhatjuk az **pnpm** parancsot is. Hozzuk létre az app((Az src helyett app könyvtárat használunk, mivel nincs fordítás, ez fog futni.)) könyvtárban az index.js állományt, a következő tartalommal:


const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.send('helló')
});

app.listen(8000);

Indítsunk el a szervert: node app Teszteljük curl, http vagy res paranccsal, vagy más HTTP klienssel (Postman, Insomnia, Insomnium, HTTPie). http localhost:8000 A szervert a Ctrl+C billentyűvel állíthatjuk le. ===== A listen() függvény ===== A listen() függvény képes fogadni második paraméterként egy callback függvényt. Írjunk egy névtelen függvényt, ami kiírja milyen porton fut a szerver:


app.listen(8000, () => {
    console.log('Listening: localhost:8000');
});

Ha most elindítjuk a szervert, informál bennünket arról, hogy a localhost:8000 címen és porton figyel. A port változóba:


const port = 8000;
app.listen(port, () => {
    console.log(`Listening: localhost:${port}`);
});

Vegyük észre, hogy console.log() paramétere már nem szimpla aposztrófok között van, helyette backtick karakterek szerepelnek. A változó behelyettesítés csak így működik. ===== Végpont ===== Most adjunk valamilyen végpontot a szerverünkhöz. Legyen például egy **product** nevű végpont:


app.get('/product', (req, res) => {
    res.send('termék')
});

A kódot tegyük a már meglévő app.get() függvény után. Indítsuk újra a szervert: node app Teszteljük: http localhost:8000/product ===== A nodemon ===== A **nodemon** (Node Monitor) lehetővé teszi, hogy ne kelljen minden fejlesztés után, újraindítanunk a szervert. Telepítsük: pnpm install --save-dev nodemon Írjunk egy scriptet a package.json fájlban:


{
    "scripts": {
        "start": "nodemon app --watch app"
    }
}

Ha fut a szerver állítsuk le, majd indítsuk újra a start script segítségével: npm start Teszteljük az elérést: http localhost:8000/product ===== Külön routing ===== A végpontokkal (endpoint) határozzuk meg, hogy milyen URL-en keresztül kérdezhetünk le adatokat. Az ilyen információkat nevezzük routing-nak. A routing-t kül állományba tesszük, egy **routes.js** fájlba.


const Router = require('express');
const router = Router();

router.get('/product', (req, res) => {
    res.send('termék')
});

module.exports = router;

Az index.js fájlban importáljuk a routes.js tartalmát:


const express = require('express');
const app = express();
const router = require('./routes');

app.use('/api',router);

app.listen(8000, () => {
    console.log('Listening: localhost:8000');
});

Vegyük észre, hogy az URL-be bekerült egy **/api** rész. Tesztelés: http localhost:8000/api/product ===== JSON válasz ===== A routes.js fájlban határozzuk meg, hogy mit küldünk a kérésre. Eddig szimpla szöveget küldtünk. A REST API szervereket általában JSON kommunikációval használjuk. JSON választ a json() függvénnyel készíthetünk:


const Router = require('express');
const router = Router();

router.get('/product', (req, res) => {
    res.json({ name: 'memória'});
});

module.exports = router;

===== Metódusok ===== Minden HTTP metódushoz tartozik egy függvény: get(), post(), put(), path(), delete(). Vegyünk fel minden HTTP metódushoz egy routingot.


const Router = require('express');
const router = Router();

router.get('/product', (req, res) => {
    res.json({ msg: 'get metódus'});
});
router.post('/product', (req, res) => {
    res.json({ msg: 'post metódus'});
});
router.put('/product', (req, res) => {
    res.json({ msg: 'put metódus'});
});
router.patch('/product', (req, res) => {
    res.json({ msg: 'patch metódus'});
});
router.delete('/product', (req, res) => {
    res.json({ msg: 'delete metódus'});
});

module.exports = router;

Teszteljük HTTP klienssel. Például a http paranccsal (HTTPie része):


http localhost:8000/api/product

http post localhost:8000/api/product

http put localhost:8000/api/product

http patch localhost:8000/api/product

http delete localhost:8000/api/product

===== create-sip használata ===== npm create sip@latest A futtatás során a következőt láthatjuk:


npm create sip@latest

> npx
> create-sip

? Project name:  › app01

Írjuk át a projekt nevét, például api névre.


npm create sip@latest

> npx
> create-sip

✔ Project name:  … api
? Project type:  › - Use arrow-keys. Return to submit.
❯   Webpage - Simple webpage: index.html, style.css
    Web Bootstrap
    JavaScript
    Web Node.js
    ESBuild JavaScript
    ESBuild TypeScript
    hai mock API
    Express API
    Cancel

Válasszuk az Express API lehetőséget:


✔ Project name:  … api
? Project type:  › - Use arrow-keys. Return to submit.
    Webpage
    Web Bootstrap
    JavaScript
    Web Node.js
    ESBuild JavaScript
    ESBuild TypeScript
    hai mock API
❯   Express API - Express API with simple Sequelize
    Cancel

A következőket láthatjuk:


Create a new Express API...
ExpressJS REST API sablon created
Read docs/user_doc.md
Run next commands:
  cd api
  npm install
  node op key:generate
  npm run dev

Egy ilyen könyvtárszerkezetet kapunk:


api/
  |-app/
  |  |-controllers/
  |  |   |-authcontroller.js
  |  |   `-usercontroller.js
  |  |-database/
  |  |   `-database.js
  |  |-middlewares/
  |  |   `-authjwt.js
  |  |-models/
  |  |   `-user.js
  |  |-routes/
  |  |   `-api.js
  |  `-index.js
  |-config/
  |  |-default.json
  |  `-default.json.example
  |-docs/
  |  |-dev_doc.md
  |  `-user_doc.md
  |-templates/
  |-test/
  |-tools/
  |-nodemon.json
  |-op
  |-package.json
  `-README.md

==== Alkalmazás kulcs generálása ==== node op key:generate ==== Model létrehozása ==== node op create model employee ==== Kontroller létrehozása ==== node op create controller employee ==== Indítás ==== Fejlesztői szerver indítása: npm run start Production indítása: npm start