Posts

Hitelesítési protokollok NestJS szemmel – OIDC, OAuth2, SAML2

A modern webalkalmazások egyik legkritikusabb része a hitelesítés és az autorizáció. Az alkalmazások közötti kommunikáció, a felhasználói fiókok védelme, valamint a biztonságos API-hozzáférés mind megköveteli, hogy szabványos protokollokra támaszkodjunk. NestJS-ben többféle lehetőségünk van ezek integrálására, hiszen a keretrendszer moduláris felépítése és a Passport.js integráció kiválóan illeszkedik a legtöbb megoldáshoz. Ebben a cikkben áttekintjük a legelterjedtebb protokollokat – OIDC, OAuth2 és SAML2 –, és megnézzük, hogyan közelíthetők meg NestJS környezetben. OAuth 2.0 – Az API-k kapuőre OAuth 2.0 egy autorizációs protokoll, amely főleg erőforrásokhoz való hozzáférést szabályoz. Nem hitelesítésre találták ki, de gyakran így is használják. A legismertebb példák a "Bejelentkezés Google/Facebook fiókkal" típusú integrációk. Fő elemei: Authorization Server – kiadja a hozzáférési tokeneket Resource Server – az erőforrást szolgáltató API Client – az al...
Post a Comment
Read more

Mi a különbség Linux alatt a "sudo su" és a "sudo su -" között?

A Linuxban a sudo su és a sudo su - parancsok között fontos különbség van abban, hogyan viselkedik a shell és milyen környezeti változókat örököl. sudo su Ez a parancs root felhasználóra vált , de megtartja az aktuális felhasználó környezeti változóit (pl. PATH , HOME , USER stb.). Olyan, mintha csak jogosultságot váltanál, de nem lépsz be teljesen a root környezetébe. Példa: $ whoami user $ sudo su # whoami root # echo $HOME /home/user # <-- ez a sima felhasználó HOME-ja sudo su - Ez teljes belépés a root felhasználó környezetébe (login shell). Betölti a root saját .profile , .bashrc , .bash_profile fájljait, és beállítja a root környezeti változóit . Olyan, mintha bejelentkeztél volna a root felhasználóként közvetlenül. Példa: $ whoami user $ sudo su - # whoami root # echo $HOME /root # <-- ez már a root HOME-ja Összefoglalva Parancs Shell típusa Környezet Mikor használd sudo su nem login shell megtartja az aktuális felhasználó k...
Post a Comment
Location: Hungary
Read more

ng-event-bus

Real-Time Notifications in Angular with ng-event-bus Ever built an Angular app where components needed to communicate without being directly connected? Maybe you wanted a global notification system  that updates instantly, no matter where the user is in your app? That’s where `ng-event-bus` shines. It acts as a lightweight event bus, letting different parts of your application talk to each other seamlessly. In this article, we’ll build a real-time notification system using `ng-event-bus`—no messy service injections, no complex state management. Why Use ng-event-bus ? Let’s face it: passing data between unrelated components in Angular can be a headache. Services with `Subject` and `BehaviorSubject` from RxJS work, but they require dependency injection, which isn’t always convenient. `ng-event-bus` provides a simple, global event system that makes component communication effortless. It’s great for: ✅ Notifications (like we’ll build today!). ✅ Inter-component communication without tig...
Post a Comment
Read more

NgRx - Devtools

Az @ngrx/store-devtools egy fejlesztői eszköz az NgRx Store -hoz, amely segít nyomon követni és debuggolni az állapotváltozásokat egy Angular alkalmazásban. 📌 Mit csinál az NgRx Store Devtools? Time-travel debugging 🕰️ – Vissza tudsz lépni korábbi állapotokra. Akciók monitorozása 🔍 – Megnézheted, milyen actionök futottak le és milyen adatokat tartalmaztak. Állapotváltozások vizualizálása 📊 – Láthatod, hogyan módosult az állapot az egyes akciók hatására. Exportálás/importálás 📂 – Elmentheted az állapotot és visszatöltheted később. 🚀 Hogyan telepítsd? Futtasd az alábbi parancsot a projektedben: npm install @ngrx/store-devtools ⚙ Hogyan konfiguráld? Nyisd meg az app.config.ts (vagy app.module.ts , ha még module-alapú az appod) fájlt, és egészítsd ki: import { provideStoreDevtools } from '@ngrx/store-devtools' ; export const appConfig : ApplicationConfig = { providers : [ provideStoreDevtools ({ maxAge : 25 , // Ennyi állapotvált...
Post a Comment
Read more

Bevezetés az NgRx-be

Bevezetés az NgRx-be – Állapotkezelés Angularban Az NgRx egy Redux-alapú állapotkezelő könyvtár Angular alkalmazásokhoz. Segít az alkalmazás állapotát egy központi helyen tárolni, ezáltal könnyebben kezelhetővé és előrejelezhetővé válik az állapotváltozás. Az NgRx főbb elemei 1. Store (Állapottár) A Store egy központi adattár, amely az alkalmazás állapotát tartalmazza. Az állapot csak egy módon módosulhat: actionökön (akciókon) keresztül. import { createFeature, createReducer, on } from '@ngrx/store' ; import { loadItemsSuccess } from './items.actions' ; export interface ItemsState { items : string []; } const initialState : ItemsState = { items : [], }; export const itemsFeature = createFeature ({ name : 'items' , reducer : createReducer ( initialState, on (loadItemsSuccess, ( state, { items } ) => ({ ...state, items })) ), }); 2. Actions (Akciók) Az actionök olyan objektumok, amelyek egy adott műveletet írnak le. E...
Post a Comment
Read more

Alapvető Hálózati Protokollok és Szolgáltatások

Alapvető Hálózati Protokollok és Szolgáltatások: TCP/IP, HTTP/HTTPS, DNS, DHCP A modern számítógépes hálózatok számos protokollra és szolgáltatásra épülnek, amelyek lehetővé teszik a különböző eszközök közötti kommunikációt. Ebben a cikkben négy alapvető technológiát mutatunk be: TCP/IP , HTTP/HTTPS , DNS és DHCP . 1. TCP/IP: Az Internet Alapja A TCP/IP (Transmission Control Protocol/Internet Protocol) egy olyan protokollkészlet, amely az internet és a helyi hálózatok alapját képezi. A rendszer két fő protokollra épül: IP (Internet Protocol) : Ez felelős az adatok célba juttatásáért az interneten keresztül. Az IP címek segítségével az eszközök egyedi azonosítót kapnak a hálózaton. TCP (Transmission Control Protocol) : Ez biztosítja az adatok megbízható továbbítását. Felbontja az információt kisebb csomagokra, majd a célállomáson újra összerakja őket. A TCP/IP működése négy rétegre osztható: Hálózati hozzáférési réteg (pl. Ethernet, Wi-Fi) Internetes réteg (IP-címzés és csomagok útv...
Post a Comment
Read more

CSS Flexbox

CSS Flexbox: Rugalmas Elrendezés Egyszerűen A CSS Flexbox egy hatékony elrendezési modell, amely segít a HTML elemek rugalmas és dinamikus igazításában. Kiválóan alkalmas a modern weboldalak komponenseinek elhelyezésére, különösen akkor, ha a tartalom mérete változó. 1. Flexbox Alapjai A Flexbox egy olyan elrendezési modell, amely lehetővé teszi az elemek igazítását egy szülő konténeren belül. Két fő eleme van: Flex konténer : Ez az az elem, amely tartalmazza a rugalmas elemeket. Flex elemek : A konténerben elhelyezkedő elemek, amelyek igazodnak a megadott szabályok szerint. Egy elemet flex konténerré alakíthatunk a display: flex; tulajdonság beállításával. .container { display: flex; } 2. Főtengely és Melléktengely A Flexbox egyik legfontosabb koncepciója a tengelyrendszer: Főtengely (main axis) : Az a tengely, amely mentén az elemek alapértelmezés szerint igazodnak. Melléktengely (cross axis) : A főtengelyre merőleges tengely. Az alapértelmezett irány vízszintes (balról jobbra), d...
Post a Comment
Read more