Alapvető programok telepítése

Ez a fordítás hiányos. Segítsen a cikk angolról történő lefordításában

Ebben a cikkben megmutatjuk milyen programokra lesz szükségünk egyszerű weboldalak fejlesztéséhez.

Milyen eszközöket használnak a profi webfejlesztők?

  • Modern számítógépet. Némelyeknek magátólértetődőnek tűnhet, de biztosan vannak, akik telefonról vagy könyvtárból olvassák ezt a cikket, ezért le kell szögezzük: a komoly webfejlesztéshez muszáj befektetni egy modern Windows, Linux vagy macOS futtatására képes számítógépbe.
  • Kódszerkesztőt. Ez lehet egy egyszerűbb kódszerkesztő (pl. Visual Studio CodeNotepad++Sublime TextAtom, GNU Emacs, esetleg VIM), vagy egy hibrid megoldás (pl. Dreamweaver vagy WebStorm). A hétköznapokból ismert irodai szövegszerkesztők nem alkalmasak erre a feladatra, mivel a dokumentum formázásához olyan rejtett adatokat ír a fájlba, amik megzavarják a böngészőket.
  • Modern böngészőket, a kód tesztelése. A legelterjedtebb böngészők ma a Firefox, Chrome, Opera, Safari, Internet Explorer és a Microsoft Edge. Erősen ajánlott a weboldalunkat különböző mobilkészülékeken, valamint a közönségünk által esetlegesen használt régebbi böngészőkben is tesztelni (például IE 8–10.) A gyengénlátó felhasználók böngészési élményét segíthet feltérképezni a Lynx, egy grafikus felülettel nem rendelkező, karakter alapú, parancssoros böngésző.
  • Grafikus szerkesztőt, mint például a GIMP, FigmaPaint.NET, Photoshop, vagy XD, hogy a weboldalunkra szánt képeket optimalizálni tudjuk a Világhálóra.
  • Verziókövetőt, amely segít nyomonkövetni a kód változását és elkerülni, hogy egymás lábára lépjünk a közös munkavégzés során. Jelenleg a Git az egyik legnépszerűbb verziókövető, a GitHub és GitLab pedig közkedvelt online Git szolgáltatók.
  • FTP programot. Régebbi webtárhelyeken használatos módszer a fájlok kezelésére, manapság egyre jellemzőbb, hogy FTP helyett Gitet használnak speciálisan erre a célra. Számtalan FTP/SFTP program közül választhatunk, például a Cyberduck, Fetch vagy a FileZilla.
  • Automatizációs eszközöket, mint a WebpackGrunt, vagy a Gulp. Ezek a szoftvereszközök a fejlesztés során gyakran ismétlődő folyamatok automatizálására valóak, mint például a kódtömörítés (minifying), vagy a tesztek futtatása.
  • Könyvtárakat, keretrendszereket, egyéb újrafelhasználható szoftvercsomagokat, amelyek felgyorsítják a fejlesztést. A könyvtárak (library) valamilyen hasznos funkciót biztosítanak, amit beépíthetünk az alkalmazásunkba, míg a keretrendszerek (framework) komplett rendszerek, amelyekre a saját alkalmazásunkat alapozzuk.
  • És még számtalan egyéb, valamilyen konkrét problémát megoldó szoftvereszközt!

Mire van feltétlenül szükségem a kezdéshez?

Habár a fenti lista elsőre rémisztőnek tűnhet, a jó hír az, hogy ezeknek csupán egy töredéke szükséges a kezdéshez.

A továbbiakban a két legszükségesebbre fókuszálunk: egy alkalmas szövegszerkesztőre és böngészőkre.

Kódszerkesztő

Szinte bizonyos, hogy már van valamilyen kódolásra alkalmas szövegszerkesztő a számítógépünkön. Windowson a Jegyzettömb, macOS esetén a TextEdit elő van telepítve. Linux esetén disztribúciófüggő az alapértelmezett szerkesztő, Ubuntu esetén ez a gedit.

Habár ezekkel a programokkal lehetséges kódot írni, vannak jobb alternatívák. A Visual Studio Code egy igen népszerű ingyenes kódszerkesztő, kimondottan programozást támogató funkciókkal.

Modern böngészők

Tekintsük az operációs rendszerünknek megfelelő böngészők listáját és telepítsük őket a megadott linkek segítségével. Erősen ajánlott  legalább két böngészőt telepíteni, mielőtt elkezdjük a tanulást, de a későbbi teszteléshez javasolt mindegyiknek a telepítése.

Figyelem: Az Internet Explorer nem kompatibilis némely modern webes technológiákkal, így előfordulhat, hogy nem tudja futtatni a projektünket. Általánosságban azonban elmondható, hogy nem kell aggódnunk az Internet Explorer miatt, mivel manapság nagyon kevesen használják — ugyanakkor az is előfordulhat, hogy olyan projektbe botlunk, ahol fontos az Internet Explorer támogatása.

Helyben futó webszerver

Egyes példák futtatásához egy működő webszerverre lesz szükségünk. A How do you set up a local testing server? cikk részletesen bemutatja, hogyan tudunk konfigurálni egyet.

Modul tartalomjegyzék