Arhitektura spletnih aplikacij

Prejšnja predavanja

• Pregledali so se spletni ogrodji in vzorec MVC.
• Pojasnjeni so bili deli vzorca MVC: Usmernik, Kontroler, Pogled in Model.
• Prikazan je bil demo vzorca MVC na aplikaciji Notes.
• Obravnavana je bila varnost in saniranje podatkov.

Povzetek trenutnega predavanja

• Predstavljena je celostna arhitektura spletnih aplikacij.
• Govorili so o skladih rešitev, s poudarkom na MERN skladu.
• Opisane so razlike med čelnimi in zalednimi deli sistema.
• Razložili so Node.js s poudarkom na namestitvah, posodabljanju, modulih in osnovnih konceptih.

Arhitektura spletnih aplikacij

• Uporabniki interagirajo z vmesnikom (Frontend), ki je napisan v HTML, CSS in JavaScript.
• Frontend komunicira z zaledjem (Backend) preko zahtev in odzivov.
• Zaledje vsebuje aplikacijsko logiko (PHP, JavaScript, Python, Java), spletni strežnik, datotečni sistem (HTML, CSS, slike) in bazo podatkov (MySQL, PostgresSQL, MariaDB).

Celostna arhitektura spletnih aplikacij

• Celostna razvojna arhitektura združuje različna orodja za izgradnjo spletne aplikacije.
• Celostna arhitektura deluje nad čelnim (front-end) in zalednim (back-end) delom sistema.
• „Full stack" razvijalec ima znanje iz razvoja čelnega dela sistema (npr. Angular, ReactJS), zalednega dela sistema (npr. Java, JavaScript, Python, Node.js) in baz podatkov (MongoDB, MySQL).
• Razume tudi DevOps (avtomatizacija procesa razvoja, testiranja, namestitve) ter upravljanje infrastrukture (prenosljivost med sistemi, zabojniki aplikacij, npr. Docker, MS Azure).

Sklad rešitev MERN

• MERN stack (Mongo – Express – React – Node.js) je brezplačen in odprtokoden paket programske opreme za izdelavo dinamičnih spletnih aplikacij.
• Aplikacije zapisane s skladom rešitev MERN se razvijejo v jeziku JavaScript (ter TypeScript), tako na strani strežnika kot za odjemalca.

Alternative skladu rešitev MERN

• LAMP (Linux - Apache - MySQL – Php)
• MEAN (MongoDB - Express – Angular - Node.js)
• MERNG (MERN + GraphQL); GraphQL je poizvedbeni jezik za API (Facebook, 2015)
• PERN (PostgreSQL – Express - React - Node.js)

Sklad rešitev MERN - Naloge in odgovornosti posameznih komponent

• React obravnava uporabniške zahteve.
• Node.js razpozna zahteve.
• Express povprašuje po podatkih.
• MongoDB zagotavlja podatke.

Čelni in zaledni del aplikacije

• Čelni del (Frontend) se implementira z Document Object Model (DOM) in uporablja MVC, Single page application, Material design.
• Čelni del uporablja tehnologije kot so HTML, CSS, JavaScript, Angular/React/Vue.
• Zaledni del (Backend) uporablja spletni strežnik za piškotke/seye (upravljanje s stanjem aplikacije), procesiranje HTTP zahtev, API/REST,... ter DBMS za CRUD, transakcije.
• Zaledni del se implementira z Node.js/Apache, MongoDB/PostgresSQL.

Node.js

• Node.js je zaledni del sistema, ki razpoznava zahteve in vrne odgovor.

Spletni strežnik

• Spletni strežnik (angl. web server) je program, ki sprejema HTTP zahteve od odjemalca (spletni brskalnik) in jim vrne HTTP odgovor (običajno v obliki HTML).
• Spletni strežnik preusmeri naloge na aplikacijski strežnik (angl. application server), ki pridobi podatke iz baze podatkov in opravi logiko potrebno za sestavo odgovora.

Node.js - splošno

• Node.js izvaja JavaScript kodo na strani spletnega strežnika.
• Je odprtokodno ogrodje, platformno neodvisno okolje, zasnovano na Chrome izvajalnem okolju JavaScript (V8 Engine).
• Node.js uporablja neblokiren I/O model, ki temelji na dogodkih, zato je lahek in učinkovit za podatkovno intenzivne aplikacije v realnem času, ki se izvajajo v porazdeljenih napravah.
• Leta 2009 ga je ustvaril Ryan Dahl, kasneje se je razvil NPM.
• Zahteve se obravnavajo v eni niti (single threaded technology).
• Blokirne operacije se izvajajo v več nitih ter uporabljajo povratne klice (callbacks).
• Node.js uporablja JavaScript v brskalniku in strežniku.
• V Node.js ni DOM-a.
• Dodani so dogodki in čakalna vrsta dogodkov, vse teče iz zanke dogodkov.
• Omogočen je vmesnik za operacije OS (datoteke, omrežje) in obdelavo podatkov, dodani so ustrezni sistemski moduli.

Osnove Node.js

• Primitive types v JavaScript: String, Number, Boolean, Undefined, Null, RegExp.
• Vse ostalo je objekt, dinamično tipizirano z rezervirano besedo "var".
• Razlike v Node.js vključujejo dodatne tipe (Buffer), doseg spremenljivk (globalno -> lokalno), dostop do globalnega dosega (objekt global) in exports.name = object.

REPL (Read Eval Print Loop)

• REPL je okolje za testiranje kode, ki je enostavno za uporabo in se zažene z ukazom "node".
• Uporablja Node.js/JavaScript.
• Obstajata dva načina delovanja: Interpreter (za izhod uporabite Ctrl + C) in izvajanje skript (node name.js).

Osnovni moduli v Node.js

• Veliko standardnih (core) modulov, kot so datotečni sistem, dostop do procesov, omrežje, časovniki, naprave, kriptovalute, itd.
• http modul vključuje objekte, metode in dogodke za ustvarjanje http strežnika Node.js.
• URL modul vključuje metode za razpoznavanje URL-ja.
• querystring vključuje metode za delo s poizvedovalnim nizom.
• path modul vključuje metode za obravnavo poti datotek.
• fs modul vključuje razrede, metode in dogodke za delo z V/I datotekami.
• util modul vključuje uporabne funkcije, koristne za programerje.
• events modul vključuje funkcije za delo z dogodki.

Uporaba modula

• Module se uvozi s funkcijo require(): var module = require('module_name');
• Funkcija require() vrne objekt, funkcijo, lastnost ali kateri koli drug koncept JavaScript.
• Module delimo na osnovne in NPM module.

Drugi moduli v Node.js

• Obsežna knjižnica modulov (npm) omogoča skoraj vse.
• npm (Node Package Manager) je online package manager za Node.js module in orodje v ukazni vrstici (command-line utility, CLI).
• npm se namesti samodejno z Node.js.
• Primeri npm modulov:
  • Nodemon – ponovni zagon spletne aplikacije ob vsaki spremembi.
  • Express – hitro, enostavno, minimalistično spletno ogrodje za HTTP (web application framework).
  • Mongoose - Elegantno modeliranje objektov MongoDB (podatkovna baza).

Node Package Manager

• CLI (command-line interface)
• S NPM se lahko preveri verzijo, jo posodobi in namesti posameznih paketov. package.json je datoteka v korenskem direktoriju vsakega Node.js projekta, definira lastnosti projekta. Elementi vključujejo name, version, scripts, description, homepage, author, dependencies, repositories, itd. NPM namesti vse module, navedene kot odvisnosti (dependencies) v paketu package.json.

Modul fs

• Standardni (core) modul, ki se uporablja v vhodno/izhodnih klicih OS.
• S require() dobimo klic modula (var fs = require("fs");)
• fs objekt ovije klice datotečnega sistema za sinhronizacijo z OS.
• Npr. Buffer je optimiziran za shranjevanje in operiranje nad binarnimi podatki. Pomnilnik je zunaj JavaScript pogona V8.
• Optimizirana skupna raba se doseže preko kazalcev in ne s kopiranjem (buffer.copy ()).
• Primeri: fs.readFile, socket.write
• Vsaka metoda v modulu ima sinhrono in asinhrono verzijo (readFileSync() je sinhron, readFile() je asinhron)
• Asinhrone metode prejmejo funkcijo povratnega klica kot zadnji argument. Prvi argument povratnega klica je napaka (JavaScript).
• Če je možno, je priporočljivo uporabiti asinhrone funkcije.
• podatkovniBuffer je poseben objekt (buffer) v Node.

Povratni klic (callback)

• Povratni klic je asinhroni ekvivalent funkcije, ki se pokliče ob zaključku funkcije.
• Node.js APIji podpirajo povratni klic.
• Prednost: obdelamo veliko število zahtev, ne da bi čakali, da katera izmed njih prejme rezultat.
• Bodite pozorni na izvajanje povratnih klicev.
• Dodatna težava je gnezdenje povratnih klicev (Callback hell).

Programiranje z dogodki (event driven programming)

• Node.js uporablja eno samo nit.
• Sočasnost je podprta s konceptoma dogodek (angl. event) in povratni klic (call-back).
• Vzdrževanje sočasnosti se doseže preko klicev asinhronih funkcij.
• Uporaba vzorca opazovalec (angl. Observer).
• Node.js nit ohranja zanko dogodkov (angl. event loop).
• Ko se naloga konča, proži ustrezen dogodek, ki opozori poslušalce (angl. listeners), da izvedejo funkcijo.
• Oddajnik (emitter)/poslušalec (listener)

Poslušalec/oddajnik

• Poslušalec (angl. listener) je funkcija, ki se prijavi na dogodek z addEventListerner.
• Oddajnik (angl. emitter) signalizira, da se je zgodil dogodek.
• Oddajanje dogodka povzroči klicanje vseh funkcij poslušalca.
• Primer poslušalec/oddajnik je modul events.
• Posluša se z on() ali addListner().
• Signalizira se z emit().
• Ob oddajanju, se poslušalci pokličejo sinhrono in po vrstnem redu poslušalcev, kako so bili registrirani.
• Če poslušalca ni, potem emit() pomeni NOP.
• Priporočljivo je ravnati z napakami, saj se Node.js ustavi, če jih ne ujamemo!

Modul stream

• Tokovi (streams) so objekti, ki prebirajo podatke iz vira ali zapisuje podatke na cilj.

• Modul stream ustvari/uporabi tokove podatkov.

• Node.js API-ji vsebuje 4 tipe tokov:

  • Tokovi branja (readable, npr. fs.createReadStream)
  • Tokovi pisanja (writable, npr. fs.createWriteStream)
  • Dupleks tok (duplex, npr. Net.createConnection)
  • Preoblikovanje toka (transform, npr. zlib, crypto)

• Vsi tipi tokov so Oddajniki (EventEmitter) in običajno vsebujejo naslednje dogodke: data, end, error, finish.

• Priljubljen način strukturiranja strežnikov je: Mrežni vmesnik <=> obdela protokola TCP / IP <=> obdelava protokola HTTP <=> naša koda.

• Z dodanimi moduli lahko tokove povežete dinamično: Omrežni vmesnik <=> obdelava protokola TCP / IP <=> šifriranje <=> obdelava HTTP.

Globalni objekti

• Globalni objekti so na voljo v vseh modulih, brez potrebe po vključevanju v aplikacijo.
• Primeri objektov so: Moduli, funkcije, nizi, ter sami objekti.
• Primeri: Spremenljivke (__filename, __dirname), funkcije (setTimeout(callback, ms)), objekti (Console, Process).

Modul http

• Modul http omogoča ustvarjanje primerka strežnika http za obdelavo zahtev HTTP.
• Nastavi se vrsta odgovora.
• Pošlje se nazaj odgovor in prekine povezava.
• Zažene se strežnik na vratih 3000.

Node.js vgrajeni moduli

• Node.js ima veliko uporabnih modulov: Buffer, C/C++ Addons, Child Processes, Cluster, Console, Crypto, Debugger, DNS, Errors, Events, File System, Globals, HTTP, HTTPS, Modules, Net, OS, Path, Process, Punycode, Query Strings, Readline, REPL, Stream, String Decoder, Timers, TLS/SSL, TTY, UDP/Datagram, URL, Utilities, V8, VM, ZLIB.

NPM moduli: nodemon

• Nodemon je pripomoček za razvijalce, ki spremlja morebitne spremembe v kodi in samodejno znova zažene strežnik.
• Namesti se ga z npm install nodemon.
• Nato se spremeni package.json.
• Strežnik se zažene z npm run dev.
• To je podobno kot node --watch hello.js.

Strežnik in serviranje statične vsebine

• Uporablja se const http = require('http'); za strežbo statične vsebine (HTML).

Strežnik in datoteke

• Za serviranje datotek se uporablja konst fs = require('fs');

Strežnik in JSON

• Uporablja se RestfulAPI.

Strežnik in klic RestfulAPI (modul Axios)

• Pridobivanje podatkov iz spletnih API-jev (digitalni dvojček) preko modula Axios.
• Uporablja se Axios za klice RestfulAPI.

Spletni API

• Spletni API (Web Application Programming Interface) je vmesnik, ki omogoča komunikacijo med različnimi spletnimi aplikacijami.
• Omogoča dostop do podatkov (pridobivanje, pošiljanje, upravljanje), uporablja HTTP protokole in formate izmenjave podatkov (JSON ali XML).
• Končne točke (angl. endpoints) so na strani strežnika določeni z URI naslovi preko katerih dostopamo do podatkov.

Skaliranje aplikacije

• Node.js omogoča ustvarjanje podrejenih procesov, za vzporedno obdelavo na večjedrnih sistemih.
• Podrejeni procesi imajo tri tokove: Child.stdin, child.stout, child.stderr.
• Node.js ponuja modul child_process, ki ima tri glavne načine za ustvarjanje podrejenega procesa (exec, spawn, fork).

Literatura

• tutorialspoint
• w3school

Naslednjič

• Izmenjava podatkov (JSON, SOAP)
• Spletne storitve
• Vrste podatkovnih baz (Relacijske podatkovne baze in NoSQL)