Skip to Content
💻 Fejlesztői🛠️ Használt környezet

Használt környezet

Weboldal

A frontend React + Vue + Typescript-ben lett elkészítve.

Miért használjuk? A React és Vue keretrendszerek lehetővé teszik a modern, dinamikus és reszponzív felhasználói felületek gyors fejlesztését. A TypeScript pedig erős típusellenőrzést biztosít, amely segít elkerülni a futásidejű hibákat.

Miért jobb, mint az alternatívák? A React és Vue széles körben támogatott, nagy közösséggel rendelkező keretrendszerek, amelyekhez rengeteg könyvtár és eszköz érhető el. A TypeScript előnye a JavaScript-hez képest a jobb fejlesztői élmény és a nagyobb kódminőség.

Használt csomagok

Az alábbi Node csomagokat használtuk projektünk könnyebb és hatékonyabb fejlesztésének érdekében:

  • js-sha256

    • Regisztrálásnál és bejelentkezésnél használjuk, ennek a modulnak a segítségével tudjuk a jelszót eltitkosítani. Mikor a felhasználó regisztrálni vagy bejelentkezni próbál, ebben a formában küldjük el a szervernek a jelszavát, hogy ne lehessen könnyen elérhetővé tenni azt, mindenki számára.
    • A csomag elérési linkje: https://www.npmjs.com/package/js-sha256 

  • react-countdown-circle-timer

    • Ennek a modulnak a használatával nagyon könnyen, viszonylag kevés beállítással és előkészülettel tudunk egy praktikus és funkcióit tekintve effektív visszaszámlálót készíteni. Ezt a modult használjuk egy-egy kör kezdésekor, játék során, valamint az eredmények megtekintésénél. Rendelkezik egy olyan paraméterrel, ami azt kezeli, hogy mi történjen mikor a visszaszámláló lejár, emiatt tudtuk egyszerűen lehetővé tenni azt, hogy a szavak automatikusan el legyenek mentve, még akkor is ha nem gombbal adta le a felhasználó vagy akkor is, ha az eredmények oldalon lejárt a megtekintésre szánt időtartam.
    • A csomag elérési linkje https://www.npmjs.com/package/react-countdown-circle-timer 
    • A csomag fő célja általánosságban, hogy csúsztatható kártyákat hozzon létre. Ezt gyakran látjuk olyan oldalakon, mint például a híroldalak, webáruházak vagy katalógusok. Mi ezt a modult használtuk arra, hogy maga a játék és az eredmények oldal felületén ne egy egyszerű táblázat legyen 7-7 cellákkal, hanem egy kevésbé látott formában történjen meg a szavak bekérése és az eredmények megjelenítése. Felhasználása egyszerű, néhány beállítással bármilyen eszközre tudjuk optimalizálni (reszponzívvá tenni).
    • A csomag elérési linkje: https://www.npmjs.com/package/react-multi-carousel 

  • react-router

    • Ez a modul lehetővé teszi az URL-ekkel kapcsolatos funkciók elérését egyszerű és könnyen használható formában. Ennek köszönhetően valósítottuk meg az oldalak közötti könnyed navigációt, ugyanis csak be kell állítanunk, hogy bizonyos URL útvonalak esetén milyen oldal töltődjön be. Egyaránt ezt a modult használjuk arra, hogy az URL-ből kiszedjünk bizonyos paramétereket (példuál a szobáknál, hogy milyen azonosítóval rendelkező szobába lépett be a felhasználó).
    • A csomag elérési linkje: https://www.npmjs.com/package/react-router 

Mobil alkalmazás

A mobil alkalmazás .NET MAUI használatával készült.

Miért használjuk? A .NET MAUI (Multi-platform App UI) lehetővé teszi, hogy egyetlen kódbázisból több platformra (iOS, Android, Windows, macOS) készítsünk alkalmazásokat.

Miért jobb, mint az alternatívák? A .NET MAUI integrált megoldást kínál, amely csökkenti a fejlesztési időt és költségeket. Az alternatívák, mint például a Flutter vagy a React Native, szintén jók, de a .NET MAUI előnye, hogy szorosan integrálódik a Microsoft ökoszisztémájába, ami előnyös lehet, ha már használunk .NET alapú technológiákat.

Asztali alkalmazás

Az asztali alkalmazás C# alapú WPF-ben készült.

Miért használjuk? A WPF (Windows Presentation Foundation) egy erőteljes eszköz a Windows asztali alkalmazások fejlesztésére, amely támogatja a modern UI/UX tervezést és az adatközpontú fejlesztést.

Miért jobb, mint az alternatívák? A WPF előnye a Windows Forms-hoz képest a fejlettebb grafikai képességek és az XAML alapú UI tervezés. Más platformokhoz képest, mint például az Electron, a WPF natív Windows támogatást nyújt, ami jobb teljesítményt és kisebb memóriahasználatot eredményez.

Használt csomagok

Az alkalmazás fejlesztése során, ezeket a NuGet csomagokat haszáltuk:

  • System.IdentityModel.Tokens.Jwt

    • Sikeres felhasználói bejelentkezés után, a megkapott hozzáférési kulcsot tudja visszafejteni, egy program által is könnyen használható formába. Ez főként akkor hasznos (a mi programunk is ezért használja), mert ki tudjuk nyerni azt, hogy a bejelentkezett felhasználó milyen adatokkal rendelkezik, ezáltal az is eldönthető, hogy milyen szerepkörbe tartozik (felhasználó/adminisztrátor). Hogyha nincs megfelelő jogosultsága, mint ami kéne a programhoz, el tudjuk utasítani a hozzáférését.
    • A csomag elérési linkje: https://www.nuget.org/packages/system.identitymodel.tokens.jwt/ 

Szerver

A szerver ASP.NET-ben készült.

Miért használjuk? Az ASP.NET egy robusztus és skálázható keretrendszer, amely lehetővé teszi a webes és API-alapú alkalmazások gyors fejlesztését.

Miért jobb, mint az alternatívák? Az ASP.NET előnye a PHP-hez vagy Node.js-hez képest a beépített biztonsági funkciók, a magas teljesítmény és a .NET ökoszisztémával való szoros integráció. Emellett a Microsoft által nyújtott támogatás és dokumentáció is kiemelkedő.

Adatbázis

Az adatokat egy SQLite alapú adatbázisban tároljuk.

Miért használjuk? Az SQLite egy könnyűsúlyú, gyors és önálló adatbázis-kezelő rendszer, amely nem igényel külön szerver telepítést vagy konfigurációt. Egyszerűen mozgatható és visszaállítható, ami ideális választás kisebb projektekhez vagy fejlesztési környezetekhez.

Miért jobb, mint az alternatívák? Az SQLite beépített SQL támogatást nyújt, és mivel nem igényel külön szerverfolyamatot, csökkenti a komplexitást és a karbantartási igényt. Emellett az SQLite adatbázisok alapértelmezetten SQL injection támadások ellen is védettek, ha megfelelően használjuk az előkészített utasításokat.

Utoljára módosítva:
🔄 Alternatívák💾 Adatbázis