<section className="mb-16 text-black">
 
 Az Electron JS (vagy csak simán Electron) pont ezt a célt szolgálja.
 Segítségével Javascriptben írhatjuk a kódot, majd ezt lefordítva kapunk
 egy futtatható állományt, mely nem igényel sem internetkapcsolatot,
 sem pedig külön böngészőt.
 

 <h num="{{2}}" className="mb-4">
 Hogy működik pontosan? Mik az előnyei? Biztosan van valami trükk a háttérben
 </h>

 
 Van bizony, de nem olyan súlyos, mint amennyire elsőre gondolnánk.
 Miután megírtuk a forráskódot, a fordítás (azaz build) pillanatában
 az Electron az egészhez hozzácsomagol egy Chromium motort, amely a háttérben
 értelmezi és végrehajtja a JS funkciókat. A Chromium egy nyílt-forráskódú
 projekt, amelyből a jól ismert Chrome webböngésző is építkezik. Ez persze nem
 azt jelenti, hogy ez csak ennyit tud.
 
 Valójában kapunk operációs rendszer specifikus funkciókat is.
 Ilyen például a Taskbar Customization, amellyel a Windows tálcán
 megjelenő ikonjára tehetünk rá egy fedőréteget, képfájlok felhasználásával.
 
 Ennek köszönhetően megjeleníthetőek például “x számú új üzenet” buborékok az ikon sarkában.
 
 
 Valószínűleg már egyértelmű, hogy ha vannak Windows specifikus funkciók,
 akkor bizony Linux és MacOS specifikusak is, azaz egy Cross-Platform megoldásról beszélhetünk,
 mely képes minden ma használt operációs rendszeren jól működő, futtatható állományt generálni.
 Egyértelmű előny, hogy a kódbázis gyakorlatilag ugyanaz mindhárom esetben, hiszen ezzel rengeteg
 időt meg tudunk spórolni, mivel nem kell minden egyes új funkciót újraírni az adott nyelven, egy konkrét környezetre.
 
 Persze, mint ahogy azt már megszokthattuk a platformfüggetlen technológiáknál,
 az elérhető maximális teljesítmény alacsonyabb, de szerencsére nem minden esetben
 kell kihasználnunk az utolsó MHz-et is a hardverünkön és gyakran optimálisabb megoldásokat is kapunk
 egy-egy problémára egy ilyen csomagban, mint amilyeneket magunktól írnánk elsőre.
 

 <h num="{{2}}" className="mb-4">
 Hogyan tudom használni az Electron JS-t?
 </h>
 
 Itt kicsit ködössé válhat a helyzet az elején, mert többféle releaset választhatunk,
 a git repoból klónozott kész állományok teljesen máshogy néznek ki mint amihez szoktunk,
 de valójában elkezdhetjük nagyon egyszerűen is, nem kell hozzá giten és npm-en kívül semmi.
 
 
 Először klónozzuk az electron-quick-start repót:
 
 <codeblock className="mt-3 mb-3 ml-6">git clone https://github.com/electron/electron-quick-start</codeblock>
 
 Aztán a mappán belülről tegyük fel a szükséges csomagokat és indítsuk el a projektet:
 
 <codeblock className="mt-3 mb-3 ml-6">cd electron-quick-start
npm install
npm start</codeblock>
 
 Itt rögtön kapunk egy ablakot egy Hello World példával, ami pontosan úgy néz ki,
 mintha egy rendes asztali program lenne, pedig tudjuk, hogy a háttérben böngészőmotor fut.
 
 
 Ha megnézzük a forráskódot, találkozhatunk néhány olyan kifejezéssel, amellyel valószínűleg máshol még nem, a JS-en belül.
 
 
 Nézzük a main.js-t.
 Az egész egy BrowserWindow Object létrehozásával kezdődik, ezen belül fog futni minden amit látunk:
 
 <codeblock className="mt-3 mb-3 ml-6">const mainWindow = new BrowserWindow({
 width: 800,
 height: 600,
 webPreferences: {
 preload: path.join(__dirname, 'preload.js')
 }
})</codeblock>
 
 Ezzel egy 800x600-as felbontású ablakot hozunk létre. A preload.js az a fájlunk lesz, ami legelőször fut le.
 Ezután a megjelenített tartalmat kell betölteni:
 
 <codeblock className="mt-3 mb-3 ml-6">mainWindow.loadFile('index.html')</codeblock>
 
 Itt elsőre úgy tűnik, hogy nincs nagy csoda, szabványos HTML szintaxis van ebben a fájlban, azzal a Hello World + 3 verzió stringgel amit már láttunk az indításnál.
 Annyi érdekesség azonban esetleg lehet benne, hogy a verziók utólag kerülnek be az ezeknek fenntartott span elemekbe, ezt csinálja a preload.js. Ha belenézünk,
 találunk benne egy process objectet, amiben a chrome, nodejs és electron verziók is megtalálhatóak. Ha kiírjuk konzolra, akkor ennél sokkal többet is találhatunk benne.
 
 
 Például a getSystemMemoryInfo függvény visszaadja a rendszermemória állapotát egy objectben, egész pontosan így:
 
 <codeblock className="mt-3 mb-3 ml-6">{
 free: 15087720
 swapFree: 9032416
 swapTotal: 38462052
 total: 33481316
}</codeblock>
 
 Ez értelemszerűen bájtban van, látszik, hogy nagyjából 28GB lapozófájl (jelenleg windowson fut, így ez nem a hagyományos, linuxos értelemben vett swap) és kb 17GB tényleges ram le van foglalva. 
 
 Ezen kívül például lekérhetünk rendszerverziót a getSystemVersion metódussal. Windows 10 esetében egy ehhez hasonló stringet fogunk visszakapni: 10.0.19044
 
 Ennek persze csak akkor van értelme, ha tudjuk a platformot. A process.platform ezt is megadja, ez esetben “win32”.
 
 
 Összességében tehát az Electron sokkal többet tud, mint azt elsőre gondolnánk,
 valós alternatíva lehet ha asztali környezetben szeretnénk fejleszteni és már van egy alapvető Javascript tudásunk.
 
 </section>

Vegye fel velünk a kapcsolatot! Szívesen segítünk bármilyen szoftverfejlesztési probléma megoldásában!

Az Electron JS alapú megoldások egyre erősödnek, a korábban megszokott Java és C alapú asztali szoftverekhez képest, mivel sokkal könnyebben tanulható.

Korábban az asztali szoftverek nagyrészt Javaban vagy valamilyen C-szerű nyelven íródtak. Mára ez fordulni látszik, a JS alapú megoldások egyre erősödnek.

Electron

Electron JS használata asztali programkörnyezetben