Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

--- oktatas:web:nodejs:express [2024/07/27 18:06] – eltávolítva admin
+++ oktatas:web:nodejs:express [2024/07/28 11:13] (aktuális) – létrehozva admin
@@ Sor 1: / Sor 1: @@
+[[oktatas:web:nodejs|< Node.js]]
+====== Express ======
+  * **Szerző:** Sallai András
+  * Copyright (c) 2021, Sallai András
+  * Szerkesztve: 2021-2024
+  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
+  * Web: https://szit.hu
+===== Az express =====
+Az Express egy minimális és könnyen kezelhető Node.js
+webalkalmazás keretrendszer, ami robusztus funkciókat
+kínál webes és mobilalkalmazások számára.
+Webhely:
+  * http://expressjs.com/
+===== Express projekt =====
+<code>
+mkdir app01
+cd app01
+npm init -y
+</code>
+Telepítsük az express csomagot:
+  npm install express
+Lehetséges kimenet:
+<code>
+npm install express
+npm notice created a lockfile as package-lock.json. You should commit this file.
+npm WARN projekt01@1.0.0 No repository field.
++ express@4.16.4
+added 48 packages from 36 contributors and audited 121 packages in 3.732s
+found 0 vulnerabilities
+</code>
+Írjuk meg a programunkat:
+<code javascript index.js>
+const express = require('express')
+const app = express();
+app.get('/', (req, res) => {
+  res.send('Helló Világ!')
+});
+app.listen(8000, () => {
+  console.log('Példa alkalmazás port 8000')
+});
+</code>
+<code>
+$ node index.js
+Példa alkalmazás port 8000
+</code>
+Böngészőbe írjuk be:
+  http://192.168.5.100:8000/
+===== Generátor használata =====
+  npx express-generator --view=pug projekt01
+A 8.2.0 előtt Node.js esetén csak így:
+<code>
+npm install -g express-generator
+express --view=pug projekt01
+</code>
+A következő könyvtárszerkezet jön létre:
+<code>
+projekt01/
+  |-bin/
+  |  `-www
+  |-public/
+  |  |-images/
+  |  |-javascripts/
+  |  `-stylesheets/
+  |      `-style.css
+  |-routes/
+  |  |-index.js
+  |  `-users.js
+  |-views/
+  |  |-error.jade
+  |  |-index.jade
+  |  `-layout.jade
+  |-app.js
+  `-package.json
+</code>
+Lépjünk be a projekt könyvtárába, majd telepítsük a függőségeket:
+  cd projekt01
+  npm install
+A node_modules mappába, települnek a függőségek.
+===== Indítás =====
+MacOS és Linuxon:
+  DEBUG=projekt01:* npm start
+Windowson:
+  set DEBUG=projekt01:* & npm start
+Windows PowerShellben:
+  $env:DEBUG='projekt01:*'; npm start
+Az utolsó sorban ehhez hasonlót kell lássunk:
+  projekt01:server Listening on port 3000 +0ms
+A kezdetleges programot a 3000 porton tekinthetjük meg. Böngészőbe:
+  localhost:3000
+===== Routing =====
+Szeretnénk egy action weblapot.
+Készítsünk egy bejegyzést az routers/index.js fájlba:
+<code javascript>
+router.get('/action', function(req, res, next) {
+  res.send('Itt lesznek a tevékenységek');
+});
+</code>
+Az index.js teljes kódja:
+<code javascript index.js>
+var express = require('express');
+var router = express.Router();
+/* GET home page. */
+router.get('/', function(req, res, next) {
+  res.render('index', { title: 'Webes' });
+});
+/* action page */
+router.get('/action', function(req, res, next) {
+  res.send('Itt lesznek a tevékenységek');
+});
+module.exports = router;
+</code>
+===== Nézet =====
+Készítsünk egy weblapot a views könyvtárban PUG nyelven:
+<code pug action.pug>
+extends layout
+block content
+  h1 Tevékenységeink
+  p Vállaljuk weblapok elkészítését
+  p Keressen minket
+</code>
+Most javítsuk a routingot:
+<code javascript>
+router.get('/action', function(req, res, next) {
+  res.render('action', { title: 'Webes' });
+});
+</code>
+===== Lásd még =====
+  * [[oktatas:web:back-end_framework:express|Back-end framwork Express]]
+  * https://github.com/oktat/exchat.git
+===== Linkek =====
+  * http://expressjs.com/en/starter/generator.html (2021)
+  * https://express-validator.github.io/ (2024)