Frontend fejlesztői elvárások – a munkaadók szemszögéből

Ha frontend fejlesztő szeretnél lenni, vagy már ezen a területen dolgozol, de szeretnél előrelépni, nagyobb kihívást jelentő, jobban fizető munkát kapni, akkor képezned kell magad, és új technológiákat kell megismerned. Akár az alapokról, akár haladó szintű programozásról van szó, mindenképpen tanulni kell. De mit tanulj? 

A roadmapen sárgával jelöltük a fő eszközcsoportokat, szürkével pedig a fontos szempontokat és alkalmazható technológiákat.Az eredeti (angol nyelvű) roadmap

Frontend alapok és haladó tudás

Bőven találsz az interneten olyan cikkeket, listákat, videókat, amikben összeszedik és elmagyarázzák, mit kell tudnia egy frontend fejlesztőnek (ennek a cikknek a végén megtalálod a mi kedvenc roadmap-ünket, amit a roadmap.sh készített).

Hasznos lehet átböngészni az ilyen gyűjtéseket, meghallgatni, mit mondanak a tapasztalt fejlesztők, de ezekben mind szubjektív nézőpont jelenik meg. Biztos, hogy pont ezekre a technológiákra van szükség, és mindenképpen ilyen sorrendben kell megtanulni őket? 

Vannak alapvető programozási nyelvek, ami nélkül nincs frontend (ilyen a HTML, a CSS és a JavaScript). De mi az a plusz tudás, amit ezen felül elvárnak? Mit kell tudni, milyen készségekkel kell rendelkezni a fejlesztői eszköztár ismeretén kívül? Erre keresünk választ ebben a cikkben. 

Mi az, ami valóban szükséges ahhoz, hogy munkát találj?

A fent említett cikkekhez és videókhoz képest más nézőpontot választottunk. Azt néztük meg, hogy a munkaadók mi mindent várnak el kötelező tudásként, és mit adnak meg “nem kötelező, de előny jelent” címkével. 

Ennek érdekében összegyűjtöttünk közel 70, Magyarországra célzott frontend fejlesztői álláshirdetést a LinkedInről és az Indeedről, rendszereztük, és listákba szedtük, milyen elvárásokat fogalmaznak meg. Így kerestük a választ arra kérdésre, mi az, amit tényleg mindenképpen tudnia kell egy frontend fejlesztőnek ahhoz, hogy állást kaphasson, mivel bővítse a tudását – ha az alapok már megvannak – azért, hogy előnnyel induljon az álláskeresők versenyében. 

A programozásban semmi sem örökérvényű

Ez a gyűjtés egy 2021-es pillanatképet mutat, idővel lesznek majd kisebb-nagyobb változások, ahogyan a programozás területén mindig is voltak. Ha fejlesztői területen szeretnél dolgozni, jó, ha nyitott maradsz az újdonságokra és figyelsz a trendekre. 

Hogyan jöttek létre a cikkben látható listák? 

A munkaadók (multik, kisebb cégek, startupok) szempontjaira voltunk kíváncsiak, ezért az álláshirdetésekben megadott kritériumokat gyűjtöttük össze. A legnagyobb állásportálok közül a LinkedInről és az Indeedről gyűjtöttünk közel 70 frontend fejlesztői álláshirdetést. 

A hirdetéseket, és a belőlük kigyűjtött adatokat ebben a táblázatban találod

frontend fejlesztő 2021-ben

Forrás: Unsplash

Feltétel, vagy csak előny? 

Külön listába szedtük, mi az, ami kötelező kritériumként szerepel, és mi az, ami csak pozitívum, de nem kötelező elvárás. A must-have a feltételeket, a nice-to-have az előnyt jelentő készségeket jelöli. Külön listát készítettünk ezekből, de fontos tudni, hogy nincs éles határ a must-have és a nice-to-have között, hiszen cégenként, állásonként változik, mit várnak a jelentkezőktől, és mi számít az adott pozíciónál előnynek. 

A cikkben található listákba aszerint kerültek be technológiák vagy elvárt ismeretek, hogy mennyire gyakran bukkannak föl az álláshirdetésekben. Ezeket az adatokat részletesen a mellékelt táblázatban találod, ha szeretnéd, böngészheted, mi mindent térképeztünk fel. 

Kategóriák és technológiák

Nagyon sokféle fejlesztői technológia, nyelv, keretrendszer, eszköz, és módszer bukkan föl a hirdetésekben. A könnyebb követhetőség és átláthatóság érdekében kategóriákba soroltuk ezeket. A kategóriák összefoglaló nevek, a listák alatt kibontva megtalálod, mire vonatkoznak ezek az általános megnevezések. 

A top 10 leggyakrabban említett must-have és nice-to-have technológiát is megtalálod listázva, itt már nem az átfogó skillekre utalunk, hanem a konkrét nyelvekre, szoftverekre. 

Must-have kategória lista (a 10 leggyakrabban elvárt átfogó ismeret vagy készség)

Ahogy már említettük, a gyűjtés összesítésekor kategóriákba rendeztük az elvárásokat. Ebben a listában azokat az alapvető készség-kategóriákat látod, amik a legtöbbször jelentek meg a frontend álláshirdetésekben. 

A készségek összefoglaló neveA hirdetések hány %-ában szerepel:
Programozási nyelvek (pl. HTML, CSS, JS stb.)88%
Keretrendszerek és könyvtárak (pl. React, Angular stb.)78%
Idegennyelv-tudás (pl. angol, német)62%
A szakmai tudáson felüli készségek, soft skillek (pl. kommunikációs készségek, képesség önálló munkavégzésre stb.)60%
Programozási módszerek, kód minőségére, tesztelhetőségre vonatkozó elvek és eljárások (pl. clean code, debugging stb.)35%
Szoftverek közötti kommunikáció (pl. REST API, JSON stb.) 34%
Verziókezelés (pl. git, Github stb.)32%
Fejlesztési módszertan, menedzsment eszközök (pl. Agile, Scrum stb.)28%
CSS preprocesszorok (pl. SCSS, SASS stb.)25%
Tesztelés (pl. Jest, Jasmine stb.)25%

Must-have technológia lista (a 10 leggyakrabban elvárt konkrét technológia) 

Ebben a listában azokat a konkrét programozási nyelveket, szoftvereket, technológiákat találod, amiket a leggyakrabban említenek a frontend álláshirdetésekben.

Technológia neve: A hirdetések hány %-ában szerepel:
JavaScript82%
CSS51%
React43%
Angular43%
TypeScript34%
HTML29%
Git28%
REST28%
SASS21%
jQuery16%

Foglaljuk össze, amit az előző listákból megtudtunk 

A munkaadók elvárásai alapján mi az az alapvető tudás, amivel rendelkezned kell frontend fejlesztőként, ha állást szeretnél kapni? 

  • Ismerned kell a frontend programozás legfontosabb nyelveit, a HTML-t a CSS-t és a JavaScriptet. Egyre gyakrabban merül fel elvárásként a JavaScript bővítéseként létrejött TypeScript
  • Meg kell ismerkedned legalább egy modern JavaScript frameworkkel, de előnyös, ha többet is ismersz. Alapvetően a React vagy az Angular az elvárás.
  • A programozói munkád feleljen meg a modern minőségi elvárásoknak, ismerd a Clean Code elveket, légy jártas a debuggingban (hibakeresésben).
  • Légy jártas a verziókezelésben, legyen gyakorlatod a Git használatában.
  • Ismerd a szoftverek közötti kommunikáció alapjait: konkrétumként legtöbbször a REST API-al találkozunk.
  • Tudd használni a CSS preprocesszorokat, vagy más néven precompilereket, első sorban a SASS-t.
  • Mozogj otthonosan a tesztelés világában, a tesztelő frameworkök és szoftverek között, tudj teszteket készíteni.
  • Magabiztosan kell kommunikálnod angolul szóban és írásban, a dokumentációhoz is megfelelő szakmai nyelvismerettel kell rendelkezned.
  • A csapatmunkához elengedhetetlen társas és kommunikációs készségek nagyon fontosak: csapatjátékosként, a proaktív attitűddel, megbízhatóan és precízen dolgozva kell részt venned a fejlesztői csapatban.

Nice-to-have kategória lista (a leggyakrabban említett előnyt jelentő képesség) 

Az alábbi listán a “nem kötelező, de előnnyel indulsz, ha tudod” ismeretek szerepelnek, ezek arra az alaptudásra épülnek rá, amit a must-have listákban olvashatsz. Zárójelbe tettük azokat a kategóriákat, amik magas pontszámot értek el a nice-to-have listán, de a must-have listán is szerepelnek.

A kategória megnevezéseA hirdetések hány %-ában szerepel nice-to-have skillként
További frameworkök ismerete41%
További programozási nyelvek ismerete38%
Backend technológiák31%
Infrastruktúra technológiák ismerete26%
(Build toolok)25%
(Tesztelés)22%
(Soft-skillek)18%
(Fejlesztési módszertanok, menedzsment eszközök)15%
(Verziókezelés)12%
(Szoftverek közötti kommunikáció)12%
Design képességek10%
Mobil eszközökre fejlesztés technológiái10%

Nice to have – technológia (A 10 leggyakrabban említett előnyt jelentő technológia)

Nincs elvárólagos határ a kötelező ismeretek és az előnyt jelentő pozitívumok között – vannak technológiák, amiket egyes cégek elvárnak, másoknál csak plusz pont jár érte. 

Mivel sok az átfedés, – ha csak a gyakoriságot vennénk figyelembe – ezen a listán sok olyan technológia szerepelne, amit már a must-have technológiák közt feltüntettünk. Itt olyan szoftvereket és technológiákat listáztunk, ami feljebb még nem szerepel, hogy minél hasznosabb legyen ez a gyűjtés. 

Technológia neveHány %-nál jelenik meg
Node.js12% must-have, 18% nice-to-have
Docker4% must-have, 13% nice-to-have
CI/CD6% must-have, 13% nice-to-have
Bootstrap12% must-have, 6% nice-to-have
Mobile 6% must-have, 9% nice-to-have
Webpack7% must-have, 9% nice-to-have
Jira3% must-have, 7% nice-to-have
Vue7% nice-to-have
Azure3% must-have, 7% nice-to-have
Jenkins1% must-have, 6% nice-to-have
Jest10% must-have, 6% nice-to-have

Mit látunk ezekből az adatokból?

    • Az egyik legfontosabb tudás, amivel előnyt szerezhetsz, az ha további keretrendszereket ismersz meg. Vue.js vagy a Bootstrap ismerete is biztosan hasznodra lesz, a Redux-szal sem lősz mellé.
    • További programozási nyelvekkel, backend ismeretekkel, illetve JavaScript tudásod fejlesztésével (az alap frontend nyelveken túl) szintén előnyhöz juthatsz: fejleszd a JavaScript tudásod az ES6 szabvány ismeretével és ismerkedj más nyelvekkel, mint pl. a Java vagy a Python, illetve a Node.js mellett a PHP és az SQL tudás is jól jöhet.
    • Sokféle különböző, fejlesztői munkát segítő eszköz ismerete fog segíteni, hogy megkapd álmaid állását. Module bundler, package manager, container tool, infrastructure… ha ezek még nem csengenek ismerősen, bővítsd a tudásod a különböző fejlesztői és infrastrukturális eszközökkel – például Webpackkel, Dockerrel, Jenkins-szel, a CI/CD (continuous integration, continuous development) fogalmaival megismerkedni biztos, hogy jó választás. 
    • A szoftvertesztelésben való jártasság egyre több helyen jelent előnyt, a Jest ismerete például sok álláshoz közelebb vihet. 
    • Az a szoftverfejlesztési elv, módszertan, amivel az adott cégnél dolgoznak, meghatározó lehet a munkamódszerekre, időbeosztásra, ütemezésre nézve. A legtöbbször az agilis szoftverfejlesztési módszertan ismerete, illetve a Scrum vagy a Kanban merülnek föl. A Jira nevű projektmenedzsment eszköz használata szintén gyakori elvárás.
  • A frontend már nem csak desktopon, hanem mobil eszközökön is fontos, így a követelmények között egyre gyakrabban szerepel a reszponzív design, vagy olyan keretrendszerek ismerete (pl. React Native), amik mobilalkalmazások fejlesztését teszik lehetővé.
  • Alapvető UI és UX design ismeretek fontosak lehetnek a felhasználóbarát felületek fejlesztéséhez. Bár ezek külön is létező szakmák, sok szoftverfejlesztő csapatban a frontendes feladata néhány ezekhez a területekhez köthető feladat, és előnyös lehet, ha ismered a felhasználóbarát felületek készítésének alapelveit. Ha érdekelnek a kreatív területek, szívesen merülsz el design szoftverek, színek, stílusok világába, képezheted magad a design irányába, jól fogsz vele járni a frontend állások piacán is. 

Frontend fejlesztőként szerteágazó tudással kell rendelkezni

Forrás: Unsplash

Néhány érdekes adat

Mindössze az állások 15%-ánál feltétel a diploma 

Gyakran olvasni, vagy hallani arról, hogy a programozói pályához, vagy annak bizonyos területeihez, mint frontend, nem szükséges egyetemi diplomával rendelkezni. Ebben a gyűjtésben is ezt tapasztaltuk: az elemzett frontend álláshirdetések 15%-a fogalmazta meg elvárásként a szakirányú felsőfokú végzettséget. Fontosabb a szakmai tudás, és hogy minél több gyakorlati tapasztalat legyen a jelentkező háta mögött. 

A soft skilleknek kiemelt jelentősége van

A közel 70 elemzett hirdetésből 53-ban külön figyelmet kapnak a soft skillek. Leggyakrabban a tanulásra való nyitottság és fogékonyság, valamint a csapatmunka készségek merülnek fel. Ezeken kívül fontos a megbízhatóság, a határidők betartása, esetleg menedzsment tapasztalat. Az állásajánlatok elvárásait olvasva kirajzolódik egy olyan munkavállalói személyiség, aki együttműködő, kezdeményező és tud önállóan is dolgozni. 

Bár frontend állásokról van szó, bekerül a képbe a backend

Bár egytől-egyig frontend pozíciók voltak, amiket elemztünk, de azt láthatjuk, hogy némi backend ismerettel nagy előnyre tehetünk szert a piacon. A hirdetések 31%-ában előnyt jelentett, ha rendelkezik backendhez köthető tudással a jelentkező. 

A Node.js az állások közel 20%-nál megjelent, de jó pont lehet pl. SQL vagy PHP tapasztalattal is rendelkezni. 

A TypeScript bekúszott az élmezőnybe

A frontend fejlesztés 3 alapvető programozási nyelve a HTML a CSS és a JavaScript. Úgy látszik viszont, hogy egyre inkább elvárás (az állások 34%-ánál), vagy előny (további 10%-nál) a TypeScript ismerete. 

Mobilalkalmazások, fejlesztés Androidra vagy iOS-re

A mobilos fejlesztés, az Android vagy iOS ismeretek, a reszponzív design-ra vonatkozó elvárások egyelőre nem jelennek meg túl nagy számban, de jelen vannak a palettán. Ha érdekel ez a terület, megéri színesíteni a tudásod a mobilfejlesztéssel. 

Frontend fejlesztői roadmap

A roadmap.sh oldalán többféle fejlesztői karrierhez is találsz térképeket, amelyek összefoglalják az adott terület fontos technológiáit. Az oldal készítői és önkéntes szerkesztői készítettek egy részletes haladási útvonalat a frontend fejlesztői karrierhez is. Ezt a frontend fejlesztői roadmapet használtuk fel a cikk illusztrálásához, de egy kicsit átalakítottuk az eredeti térképet. Kiemeltük azokat a technológiákat, amikkel gyakran találkoztunk az álláshirdetésekben a munkaadók elvárásai közt. 

A térkép elején az internettel kapcsolatos alapismereteket találjuk, ezt megalapozó tudásnak tekintjük, de az álláshirdetések nem részletezik, mint ahogy azt sem, hogy HTML-ben, CSS-ben és JavaScriptben mi az az alapvető tudás, amivel rendelkezni kell. Elmondhatjuk, hogy a roadmap első néhány állomásánál minden tétel fontos.

Pályakezdő és senior szintek

Juniorként is sokféle nyelvet, keretrendszert, build toolt kell ismernünk ahhoz, hogy elkezdhessünk frontend fejlesztőként dolgozni. A roadmapen a “Válassz egy keretrendszert” állomásig olyan technológiák vannak, amik egy pályakezdő számára is szükségesek. 

Haladók számára további framework-ök, illetve a TypeScript ismerete lehet a következő lépés. A “Progressive Web Apps”-től kezdve már olyan ismeretek vannak a térképen, amik a seniorrá váláshoz kellenek, vagy specializálódhatsz velük, például mobilfejlesztésre.

Itt végigkövetheted a teljes, magyar nyelvű roadmap-et a javasolt állomásokal:

Ebben a cikkben a céltól – egy frontend állás megszerzésétől – indultunk el visszafelé, azt néztük meg, mik azok a technológiák és soft skillek, amik szükségesek a vágyott állás megszerzéséhez. Reméljük, hasznosnak találtad ezt a gyűjtést és segít felállítani egy sorrendet, miket tanulj meg először és mivel bővítsd a tudásod, ha az alapok megvannak.

A CodeBerry Programozóiskola A programozás alapjai című cikksorozatában programozással kapcsolatos témákat feszegetünk, és mindenről szót ejtünk, amire a kezdetekben szükséged lehet. Kövesd a blogunkat, ha még több olyan cikket szeretnél olvasni, amiben minden programozással kapcsolatos kérdésedre választ találhatsz!

A programozás alapjai

Szeretnél online megtanulni programozni? Gyere, és próbáld ki az első 25 leckénket ingyen a CodeBerry Programozóiskolában!