Skip to content

Latest commit

 

History

History
 
 

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 

Interjú kérdések front-end fejlesztőknek

@version 2.0.0

Ebben a gyűjteményben összeválogattuk a legjobb front-end fejlesztő interjú kérdéseket. Ellenben nem tanácsoljuk az összes kérdés egyidejű feltevését, hiszen ez órákat venne igénybe de egy válogatott kérdéssorral megkönnyíthetjük a potenciális jelentkezők szelektálását.

Rebecca Murphey, Baseline For Front-End Developers cikke is hasznos alapja lehet egy interjúnak.

Megjegyzés: Ne feledd, hogy a kérdések többsége érdekes beszélgetésé alakulhat, ami többet elárulhat az emberről mintha csak egyszerű válaszokat adna.

A magyar fordítást Czeglédy Tibor készítette az eredeti angol szöveg alapján.

Eredeti közreműködők

A kérdések többsége egy oksoclap beszélgetés alapján készült, amit Paul Irish (@paul_irish) kezdeményezett az alábbi közreműködőkkel:

Általános kérdések:

  • Milyen verziókövetőket használtál már? (Git, SVN, stb.)
  • Mi a számodra legelőnyösebb fejlesztői környezet? (operációs rendszer, szerkesztő, böngésző, fejlesztői eszközök, stb.)
  • Részletezd hogyan készítesz el egy weboldalt.
  • Mi a különbség a fokozatos javítása és a között, hogy a weboldalt folyamatosan optimalizálod régebbi és egyszerűbb felületekre is?
    • Bónusz pont a funkció működésének tesztelése adott eszközön.
  • Magyarázd el mit jelent a "szemantikus HTML".
  • Milyen böngészőt és milyen eszközöket használsz a fejlesztéshez?
  • Hogyan optimalizálod egy weboldal forrásait/eszközeit?
    • Keress több megoldást, amik tartalmazzák az alábbiakat:
      • Fájl egyesítés
      • Fájl minimalizálás
      • CDN hoszting
      • Cachelés
      • stb.
  • Miert jobb az eszközöket egyszerre több domainnek is kiszolgálni?
    • Hány lekérdezés futhat a böngészőben egyidejűleg az adott domain irányába?
  • Nevezz meg 3 lehetőséget az oldalletöltés időtartámanak csökkentésére. (előtöltött vagy aktiális töltési idő)
  • Ha beszállsz egy projektbe, és ők tabot használnak te pedig szókozt a kód rendezésénél, mit teszel?
    • Tanácsolod, hogy használjatok valami technológiát, pl. EditorConfig
    • Elfogadod (vagy tartózkodsz)
    • issue :retab! command
  • Készíts egy egyszerű slideshow oldalt.
    • Bónusz pont ha nem szükséges hozzá JavaScript.
  • Milyen eszközökkel teszteled a kódod teljesítményét?
  • Ha idén elsajátíthatnál egy technológiát, mi lenne az?
  • Ismertesd a sztandardok fontosságát.
  • Mi a FOUC? Hogyan kerulöd el a FOUC-et?

HTML specifikus kérdések:

  • Mi a doctype feladata és hány fajtáját tudod megnevezni?
  • Mi a különbség a standard és a quirks módok között?
  • Nevezd meg az XHTML oldalak korlátait?
    • Van bármi akadálya annak, hogy egy oldalt application/xhtml+xml-ként szolgáljon ki?
  • Hogyan készítesz fel egy weboldalt többnyelvű tartalom megjelenítésére?
    • Mikre kell figyelni egy többnyelvű oldal tervezése és fejlesztése során?
  • Használhatsz XHTML szintaxist HTML5-be?
  • Hogyan használsz XML-t HTML5-ben?
  • Mire valók a data- attribútumok?
  • Mik tartoznak bele a HTML4 tartalmi modelljébe és miként különbözik ez a HTML5-ben?
  • Tegyük fel, hogy a HTML5 egy nyílt webes felület. Mik az építőelemei?
  • Mi a különbség a cookie a sessionStorage és a localStorage között.

JS specifikus kérdések:

  • Mit jelent az event delegation?
  • Magyarázd el hogyan működik a this a JavaScript-ben.
  • Hogyan működik a protokol öröklés (prototypal inheritance)?
  • Hogyan teszteled a JavaScript kódodat?
  • AMD vs. CommonJS?
  • Melyik JavaScript library-ket használtad már?
  • Próbáltad már értelmezni az általad használt library/keretrendszer forrását?
  • Mi a "hashtable"?
  • Mit jelent az undefined és az undeclared változó?
  • Mi a lezárás, milyen formáit ismered és hogyan használod azokat?
    • Kedvenc mintád? "argyle" (kizárólag IIFE-re alkalmazható)
  • Hogyan néz ki egy anoním funkció?
  • Magyarázd el a JavaScript modul sablont és, hogy mikor használjuk.
    • Bónusz pont, ha említi a tiszta namespace-ket.
    • Mi történik akkor, ha a modul namespace mentes?
  • Miként rendszerezed a kódodat? (module pattern, classical inheritance)
  • Mi a különbség hoszt objektum és natív objektum között?
  • Mi a különbség az következő kódok között:
function Person(){} var person = Person() var person = new Person()
  • Mi a különbség a .call és az .apply között?
  • Magyarázd el mire jó a Function.prototype.bind?
  • Mikor szoktad optimalizálni a kódodat?
  • Magyarázd el hogyan működik az öröklődés szabálya a JavaScript-ben?
  • Mikor használod a document.write() funkciót?
    • A generált hírdetés még mindig használják annak ellenére, hogy nem ajánlatos.
  • Mi a különbség a "feature" észlelés (detection), "feature" következtetés (inference) és az UA sztring használata között?
  • Magyarázd meg az AJAX működését a lehető legrészletesebben.
  • Magyarázd el, hogyan működik a JSONP (és miért nem AJAX valójában).
  • Használtál már JavaScript template rendszert?
    • Ha igen mit? (Mustache.js, Handlebars, stb.)
  • Mit jelent a "hoisting"?
  • Mit jelent az event bubbling?
  • Mi a különbség az "attribute" és a "property" között?
  • Miért nem jó ötlet kiegészíteni a beépített JavaScript objektumokat?
  • Miért jó ötlet kiegészíteni a bepített funkciókat?
  • Mi a különbség a "document load" és a "document ready" között?
  • Mi a különbség == és === között?
  • Hogyan olvasol be egy paramétert a böngésző ablak URL-ből?
  • Mit jelent a "same-origin" szabály a JavaScript-bet?
  • Ismertesd a JavaScript öröklési mintáját.
  • Javítsd ki az alábbi példát:
[1,2,3,4,5].duplicate(); // [1,2,3,4,5,1,2,3,4,5]
  • írj le egy memorizáló stratégiát (ismétlődő kalkulációk nélkül) JavaScriptben.
  • Mit nevezünk "Ternary" kifejezésnek? Mire utal a "Ternary" szó?
  • Mennyi attribútumot lehet átadni egy funkciónak?
  • Mi a "use strict";, mik az előnyei és a hátrányai?

JS példakódok:

~~3.14

Kérdés: Mi a kimente a fenti példának? Válasz: 3

"i'm a lasagna hog".split("").reverse().join("");

Kérdés: Milyen értékkel tér vissza a fenti állítás? Válasz: "goh angasal a m'i"

( window.foo || ( window.foo = "bar" ) );

Kérdés: Mi az értéke a window.foo-nak? Válasz: "bar" de csak ha a window.foo hamis egyébként megtartja az értékét.

var foo = "Hello"; (function() { var bar = " World"; alert(foo + bar); })(); alert(foo + bar);

Kérdés: Mi a fenti két alert-nek a kimenete? Válasz: "Hello World" és ReferenceError: bar is not defined

var foo = [];
foo.push(1);
foo.push(2);

Kérdés: Mi a foo.length értéke? Válasz: 2

var foo = {};
foo.bar = 'hello';

Kérdés: Mi a foo.length értéke? Válasz: undefined

jQuery specifikus kérdések:

  • Mit jelent a chaining?
  • Mit jelent a deferreds?
  • Milyen jQuery specifikus optimalizálást ismersz?
  • Mire használhatjuk az .end() funkciót?
  • Hogyan neveznél el egy kapcsolt esemény kezelőt (bound event handler) és miért?
  • Nevezz meg 4 különböző értéket, ami átadható egy jQuery folyamatnak.
    • Szelektor (sztring), HTML (sztring), Callback (funkció), HTMLElement, objektum, tömb, elemb tömb, jQuery objektum, stb.
  • Mit jelent az effektek (vagy fx) sorba állítas?
  • Mi a különbség .get(), [], és .eq() között?
  • Mi a különbség .bind(), .live(), és .delegate() között?
  • Mi a különbség $ és $.fn között? Vagy mit jelent a $.fn?
  • Optimalizáld a alábbi szelektort:
$(".foo div#bar:eq(0)")
  • Mi a különbség delegate() és live() között?

CSS specifikus kérdések:

  • Mire való a "reset" CSS fájl és mennyire hasznos?
  • Hogyan működik a CSS float?
  • Milyen clear technikákat ismersz és melyik milyen környezetben a megfelelő?
  • Magyarázd el a CSS sprites működését és, hogy hogyan alkalmazod egy weboldalon?
  • Mi a kedvenc képpel helyettesítő (image replacement) technikád és mit használsz mire?
  • CSS hackek, böngésző függő CSS fájlok, vagy.... valami más?
  • Hogyan jelenítesz meg oldalakat korlátozott böngészőkben?
    • Milyen technológiákat/folyamatokat használsz?
  • Milyen módon tudsz tartalmakat vizuálisan elrejteni (és csak screen olvasók számára elérhetővé tenni)?
  • Használtál már rács rendszert (grid system)? Ha igen nevezz meg párat. (960 Grid System, Foundation, Twitter Bootstrap)
  • Használtál már "media query"-ket vagy mobil specifikus layoutokat/CSS-eket?
  • Jártas vay az SVG használatában?
  • Hogyan alakítasz egy weboldalt nyomtatóbaráttá?
  • Mik a legjobb "ötletek" a hatékony CSS kód írásához?
  • Használsz CSS előfeldolgozó technilógiát? (SASS, Compass, Stylus, LESS)
    • Ha igen mit szeretsz és mit nem szeretsz bennük?
  • Hogyan valósítasz meg egy olyan dizájn kompozíciót, ami nem a szabványos betűtípusokat tartalmazza?
  • Miként határozza meg a böngésző a megfelelő CSS szelektort?

Választható és vicces kérdések:

  • Mi a legjobb dolog, amit eddig kódoltál? Mire vagy a legbüszkébb?
  • Ismered a HTML5 banda jelét?
  • Vagy, vagy voltál már hajón?
  • Mi a kedvenced az általad használt fejlesztői eszközökben?
  • Van bármilyen állatos projekted? Ha igen milyen?
  • Ismertesd a "cornify" jelentőségét. Cornify
  • Egy darab papirra írd le az A B C D E betűket függőlegesen. Most rendezzd át oket csökkenő sorrendbe egyetlen sor kóddal.
    • Várj és figyelj, megfordítják-e a papírt, hogy fejjel lefelé legyen.
  • Kalóz vagy Ninja?
    • Bónusz pont, ha mindkettő és jó indokot adott rá (+2 ha zombi majom kalóz ninják)
  • Ha nem fejlesztesz, mi mást szoktál csinálni?
  • Hol lehet vajon Carmen Sandiego?
    • Megoldás: nincs rá helyes válasz
  • Mit szeretsz a legjobban az Internet Explorerben?
  • Fejezd be a mondatot: Brendan Eich és Doug Crockford a JavaScript __________.
  • jQuery: egy jó library vagy a legjobb library? Vitassátok meg.
  • W3School vagy W3Fools