Ezzel a cikkel készülj fel a React interjúdra 2023-ban

12 technikai kérdéssel és válasszal, hogy teszteld magad

Előszó

Az interjúra való felkészülés mindig kulcsfontosságú lépés a sikeres karrierút megalapozásában. Ezen cikk célja, hogy segítsen React fejlesztőknek felkészülni a 2023-as interjúkra és kiemelje azokat a területeket, amelyekre érdemes odafigyelni. Az alábbiakban általános tanácsokat adunk, amelyek hasznosak lehetnek bármilyen interjú esetén, valamint a technikai interjúra hasznos tippekkel szolgálunk.

Az interjú folyamán általában két kategóriára lehet számítani: a személyes és a technikai részre. Az interjú körök száma ”n”, vagyis cégenként eltér, hogy hogyan is képzelték el a felvételi folyamatot, de annyi bizonyos, hogy a személyes részben a soft skillek és a céges kultúrába illeszkedés értékelése élvez kiemelt figyelmet, míg a technikai részbe tartozik a programozási és technikai tudás felmérése.

Általános interjúra felkészítő tanácsok

CV frissítése: Az interjú előtt érdemes átnézni és frissíteni a CV-t, kiemelt figyelemmel a releváns tapasztalatokra és projektekre, főleg, amik a meghirdetett munkakörhöz kapcsolódnak.
Céginformációk gyűjtése: Érdemes már az interjú előtt kutatást végezni a cégről. Ismerd meg a cég értékeit, kultúráját és a termékeiket/szolgáltatásaikat.
Saját kérdések: Az interjú egy kétirányú folyamat. Legyenek kérdéseid a cég és a pozíció kapcsán. Ez mutatja az érdeklődést és felkészültséget. Az interjúk során gyakran előkerülnek olyan kérdések, amelyek segítenek a munkáltatónak megismerni a jelöltet, értékelni a motivációját és megérteni a hozzáállását a munkához.

Íme néhány példa a leggyakoribb interjúkérdésekből:

Hol látod magad 5 év múlva?

Ezzel a kérdéssel azt vizsgálják, hogy mennyire vagy tervező személyiség, és hogy a jelenlegi pozíció mennyire illeszkedik a hosszú távú céljaidhoz. Pro tipp: Ne azt mondd, hogy a hálóban. Nem biztos, hogy átjön a poén.

Az interjún érdemes hangsúlyozni a hosszú távú terveket és célokat. Például, elmondhatod, hogy az elkövetkező 5 évben a React területén szeretnél elmélyülni, és a célod az, hogy olyan projektvezetővé válj, aki komplex alkalmazásokat tervez és vezet. Emellett hangsúlyozd, hogy szakértővé szeretnél válni a legújabb React trendek és technológiák terén. Természetesen szem előtt tartva a vanilla JS, CSS és egyéb fejlesztéshez köthető diszciplínákat is.

Az adott céghez való hűség és az általuk képviselt értékek iránti elkötelezettség is fontos. Ezt úgy fejezheted ki, hogy hű maradsz a céghez és aktívan hozzájárulsz az általuk képviselt értékekhez és célkitűzésekhez.

Nagy hangsúlyt fektethetsz az önképzésre és a fejlődésre is. Például elmondhatod, hogy folyamatosan tanulsz, fejlődsz és ezt a tudást kívánod hasznosítani az adott cég projektjeiben.

Végül, a csapatmunka és a kapcsolatteremtés is kulcsfontosságú. Fontos, hogy rámutass, hogy hatékonyan tudsz kommunikálni és együttműködni másokkal a projektjeiden, és hogy a csapatmunka számodra is kiemelten fontos.

Melyek az erősségeid és gyengeségeid?

Ez a kérdés arra irányul, hogy mennyire vagy önreflektív, és hogyan látod a saját képességeidet.

Amikor ezt a kérdést kapod, először beszélj az erősségeidről. Például, említsd meg, hogy erős vagy a problémamegoldásban és nagy szenvedéllyel követed a legújabb fejlesztői trendeket, különösen a React terén. Hangsúlyozd, hogy jól működsz csapatban és hatékonyan kommunikálsz más fejlesztőkkel és érdekeltekkel együttműködve.

Amikor a gyengeségekről van szó, légy őszinte, de pozitív hozzáállással. Például, mondd el, hogy bár jól boldogulsz a front-end fejlesztésben React-ként, még mindig van tér a fejlődésre és tanulásra, és mindig nyitott vagy az új kihívások elfogadására. Emellett, hangsúlyozd, hogy a gyengeségeidet szívesen fejlesztenéd tovább és kész vagy tanulni és dolgozni is azokon az területeken, amelyeken fejlődésre van szükség.

A lényeg, hogy őszinte és pozitív hozzáállással válaszolj és mutasd be, hogy a gyengeségeket is lehetőségként kezeled a fejlődésre és tanulásra.

Miért szeretnél nálunk dolgozni?

Ezzel a kérdéssel arra keresik a választ, hogy miért érdeklődsz a cég iránt és hogyan tudsz hozzájárulni az értékeihez.

Mivel a cégüknél való elhelyezkedést fontolóra veszed, fontos, hogy megfelelő választ adj a kérdésre, hogy miért szeretnél náluk dolgozni. Ezen a ponton, érdemes kiemelni azokat az okokat, amelyek miatt érdeklődsz a cég iránt. Például, ha a cégüket az innováció és a kiválóság jellemzi, és ezt értékeled a fejlesztői területen, hozd ezt előtérbe a válaszodban.

Szintén hangsúlyozd azokat a módokat, amelyekkel hozzá tudnál járulni a cégükhöz. Ha rendelkezel szakmai tudással és tapasztalattal, például a React fejlesztés terén, említsd meg, hogy hogyan gondolod, hogy ezen keresztül értéket tudsz hozni a cégüknek. Az is fontos, hogy rámutass, hogy miként értékeled az itteni fejlődési lehetőségeket, és hogy cégük ideálisnak tűnik az ambícióid és szakmai céljaid számára.

Végül, fejezd ki, hogy örömmel lennél része ennek a dinamikus csapatnak és készen állsz hozzájárulni a cégük sikeréhez. Az őszinteség és az elkötelezettség mindig pozitív benyomást kelt az interjúztatóknál.

Milyen tapasztalataid vannak az adott területen?

Ezzel a kérdéssel azt vizsgálják, hogy mennyire illeszkedsz a pozícióhoz, és milyen releváns tapasztalataid vannak.

Amikor ezt a kérdést kapod, fontos, hogy hangsúlyozd azokat a releváns tapasztalataidat, amelyek segíthetnek abban, hogy illő jelöltként tűnj fel a pozícióra. Például, ha van tapasztalatod a React fejlesztés terén, említsd meg, hogy milyen projekteken dolgoztál korábban és milyen eredményeket értél el ezekben a projektekben.

Legyenek az előző tapasztalataid részletesek és relevánsak a pozícióhoz, és mutasd be magad magabiztosan és összefoglalóan.

Hogyan kezeled a nehézségeket és konfliktusokat a munkahelyen?

Ez a kérdés arra irányul, hogy hogyan reagálsz stresszes helyzetekre és milyen problémamegoldó készségeid vannak.

Hangsúlyozd, hogy higgadt maradsz stresszes helyzetekben és milyen megfontoltan kezeled a problémákat.

Fontos, hogy példákat is adj az előző munkahelyeidről vagy helyzetekről, amikor sikerült sikeresen kezelned nehéz helyzeteket vagy konfliktusokat. Ezzel bizonyíthatod, hogy a problémamegoldás és a konfliktuskezelés nem csak elméleti szinten, hanem gyakorlatban is erős készségeid.

Emellett érdemes kiemelni az empátiát és az együttműködési képességeket is. Például, ha egy konfliktust említesz, mutasd be, hogy hogyan próbáltad megérteni a másik felet és egy közös megoldást találni a problémára.

Végül, ne felejtsd el azt is megemlíteni, hogy mindig hajlandó vagy tanulni és fejlődni, és hogy az ilyen helyzetekből tapasztalatot szerzel, ami segít abban, hogy jobban kezeld a jövőbeli kihívásokat.

Miért hagyod el az előző munkahelyed?

A motiváció megértése: Szeretnék megérteni a motivációd az új állás kereséséhez. Ez betekintést nyújthat abba, hogy lássák az okot erre, hogy ez karrierfejlődés vagy egy jobb munkakörnyezet vagy más személyes vagy szakmai okokból keresel-e új munkát.

Tanulság a múlt tapasztalataiból: A válasz betekintést nyújthat abba, hogy mit tanultál korábbi tapasztalataidból és hogyan alkalmazod ezeket a jövőbeli lehetőségek során.

Amikor ezt a kérdést kapod, fontos, hogy őszintén és pozitívan válaszolj. Például, mutasd be, hogy mi motivált téged a váltásra, anélkül, hogy negatív módon beszélnél az előző munkahelyedről.

Elképzelhető, hogy a szakmai fejlődési lehetőségek vagy a cég kultúrája motivált a váltásra. Példákat hozhatsz fel arra, hogy hogyan illeszkedik az új pozíció a karrier céljaidhoz és milyen lehetőségeket látsz benne a személyes és szakmai fejlődésed szempontjából.

Emellett érdemes beszélni arról, hogy milyen tanulságokat hoztál magaddal az előző munkahelyedről és hogy hogyan tudod ezeket az új helyen hasznosítani. Például, ha a korábbi munkahelyeden megtanultad, hogy mennyire fontos az összetartó csapatmunka, említsd meg, hogy ezt a tudást és hozzáállást továbbra is magaddal viszed.

A lényeg, hogy a válaszodban hangsúlyozd a pozitív motivációkat és a fejlődési lehetőségeket és kerüld a negatív kritikákat vagy panaszokat az előző munkahelyedről.

Milyen projekteken dolgoztál korábban?

Amikor ezt a kérdést kapod, érdemes kiemelni azokat a projektjeidet, amelyek a leginkább relevánsak lehetnek az adott pozícióhoz. Emellett fontos, hogy részletesen és strukturáltan válaszolj a kérdésre.

Mindenekelőtt, említsd meg a projektek címét és a munkahelyedet vagy a projekt kezdeményezőjét. Például, 'Az előző munkahelyemen egy olyan projektben dolgoztam, amely...' vagy 'Saját vállalkozásom során egy projekt keretében...'

Aztán beszélj röviden a projektcélról és a kihívásokról, amelyekkel szembe kellett nézned. Hogyan határoztad meg a problémákat és a célokat és hogyan tervezted meg a projektet hogy megold őket?

Az eredményekre is koncentrálj. Milyen eredményeket értél el a projekt során? Például, ha sikerült növelni a weboldal látogatottságát vagy javítani a felhasználói élményt, említsd meg ezeket a konkrét eredményeket.

Ne felejtsd el kiemelni a saját szerepedet és hozzájárulásodat a projekthez. Milyen konkrét feladatokat végeztél és hogyan járultál hozzá a projekt sikeréhez?

Végül, próbáld összekapcsolni ezeket a projekteket az új pozícióhoz és mutasd be, hogy a tapasztalataid és képességeid milyen értéket hozhatnak a jövőbeli munkáltatódnak.

Milyen momentumokra vagy a legbüszkébb, amit kiemelnél a munkádból?

Itt célszerű pár ténylegesen érdekesebb momentumot felsorolni tudni, amik a szakmabelieknek is elismerő pillantását vívja ki.

Technikai rész

A Github: az interjú sikeres alapja

A GitHub az egyik legfontosabb eszköz a fejlesztői munka bemutatásához. Nem csupán egy hely, ahol tárolhatjuk kódjainkat, hanem egy értékes platform is, ahol a potenciális munkáltatók betekintést nyerhetnek munkáink minőségébe és következetességébe. Az interjú során a GitHub profilunk egyfajta digitális portfóliót képvisel, amely tükrözi munkamorálunkat, szakmai elkötelezettségünket és a kódírás iránti szenvedélyünket.

Hogyan használjuk a GitHub-ot hatékonyan az interjú során?

Verziókezelés és együttműködés demonstrációja: A munkáink verzióit (commit-okat) rendezetten dokumentáljuk. Emellett saját fiókunkon példákkal mutassuk meg, hogy hogyan dolgozunk másokkal együtt egy projekten.

Hogyan használjunk hatékonyan open source és saját projekteket az interjú során?

Open source részvétel: Ha lehetőségünk van, vegyünk részt népszerű open source projektekben. Ez nem csak a kódminőséget mutatja, hanem azt is, hogy milyen módon kapcsolódunk be a szélesebb fejlesztői közösségbe.

Saját projektek bemutatása: Mutassuk be a saját projektjeinket, még akkor is, ha azok nem nyilvánosak. Részletezzük, hogy milyen problémákat oldottunk meg, milyen technológiákat alkalmaztunk, és milyen eredményeket értünk el.

Dokumentáció és kódminőség: Az open source projektekben való részvétel mellett ügyeljünk arra, hogy a saját projektjeink dokumentáltak legyenek és magas színvonalú kódminőséget képviseljenek.

Az open source projektek és a saját projektek bemutatása nem csak a fejlesztői készségeinket tükrözi, hanem azt is, hogy mennyire vagyunk elkötelezettek a fejlődés, az együttműködés és az innováció iránt. Ezek a projektek egyfajta digitális portfóliót alkotnak, amelyekből a munkáltatók megláthatják, hogy hogyan ismerkedtünk meg az új technológiákkal és hogyan járultunk hozzá az iparág fejlődéséhez.

source: Github shower

Hogyha ne adj’ isten nincsen akkor se keseredjünk el, nem ezen fog múlni a siker, ám egy erős pluszt tud adni az összképhez.

A LinkedIn: személyes brand építés és kapcsolatépítés

A LinkedIn egy hatalmas szakmai hálózat és platform, ahol a fejlesztők összekapcsolódhatnak, tapasztalataikat megoszthatják és láthatóvá tehetik szakértelmüket. Ezen a felületen keresztül nem csak a munkatapasztalatokat és készségeket tükrözhetjük, hanem egy teljes képet adhatunk arról, hogy kik vagyunk és mi motivál minket.

Hogyan használjuk a LinkedIn-t hatékonyan az interjú során?

Profil teljessége: Töltsük ki minden részletet gondosan, beleértve a munkatapasztalatot, oktatást, készségeket és hobbikat.

Bejegyzések és cikk megosztás: Az általunk megosztott tartalmak (például technológiai újdonságok, projektek) mutatják szakmai elkötelezettségünket.

Kapcsolatépítés: Kapcsolódjunk más fejlesztőkhöz és cégvezetőkhöz. A jó kapcsolatok bővítik lehetőségeinket.

Portfólió

Önálló munkák, kreativitás és skálázhatóság

Bár a GitHub már lehetővé teszi munkáink bemutatását, egy személyes portfólió további mélységet és kontextust adhat. Ez lehet a hely, ahol saját projektjeinket és oldalainkat mutathatjuk be, szemléltetve a tervezői és fejlesztői készségeinket.

Hogyan használjuk a portfóliót hatékonyan az interjú során?

Projektek diverzitása: Mutassuk be a portfólióban a különböző típusú projekteket, amelyeken dolgoztunk. Ez mutatja a szakmai sokoldalúságunkat.

Projekt leírások: Részletesen mutassuk be a projekteket, a céljukat, a problémát, amit megoldottak és a használt technológiákat.

Az interjú előkészítése során a GitHub, a LinkedIn és a portfólió együttesen támogatják szakmai hitelességünket és személyes brandünket. Ezen platformok és eszközök gondos használata lehetővé teszi, hogy a potenciális munkaadók egy teljeskörű képet kapjanak rólunk, mint fejlesztőről és szakemberről.

Ahogyan a Github accountra, erre is igaz, hogyha nincsen akkor se keseredjünk el, nem ezen fog múlni a siker, ám egy erős pluszt tud adni az összképhez (sok szeniornak pl. abszolút nincsen).

Technikai interjú

Az interjú folyamán az alábbi kérdésekkel a jelentkező kódolási tudását és tapasztalatait mérik fel. Arra kíváncsiak, hogy mennyire mélyült el az interjúzó a JS és React világában. A kérdésekre kapott válaszok segíthetnek az interjúztatónak megállapítani, hogy a jelentkező junior, medior, senior vagy más szinten áll a fejlesztői hierarchiában, de fontos megjegyezni, hogy ez az elvárt szint mindig a cég és az interjúztató saját preferenciáitól függ.

Azonban ne lepődjünk meg, ha az interjú során más típusú kérdések is előkerülnek, mint rendszertervezési, tesztelési, optimalizálási és egyéb kategóriák. A különböző cégek eltérő elvárásokat támaszthatnak a jelentkezőkkel szemben ugyanabban a pozícióban. Tehát minden interjú egyedi lehet, és az interjúztató saját preferenciái és a cég kódolói csapatának igényei alapján formálódnak. Ebben a cikkben olyan érdekes és változatos kérdéseket gyűjtöttünk össze, amelyek közül válogathatsz, hogy felkészülten állj a kódolási interjú előtt, függetlenül attól, hogy melyik céghez jelentkezel.

JS kérdéspéldák:

Mi is az az Immediately Invoked Function Expression a JavaScript-ben és miért vagy hol is használnád azt?

Egy IIFE lényege, hogy egy egyszer használatos funkció és azonnal le is fut. Nincsen szükség arra, hogy elnevezz egy function-t és utána azonnal meg is hívd, ezáltal az elnevezéssel töltött időt is megspórolhatod, valamint nem kell a memóriában tárolni.

Magyarázza el a 'paraméterátadás érték szerint' és a 'paraméterátadás hivatkozás szerint' fogalmait, JS esetén ez hogy is működik?

Js-ben a primitív adat típusok érték, míg a nem primitívek esetében referencia szerint adódnak át.

Minden valószínűség szerint a legjobb, hogyha egy érzékletes kód példával illusztrálom, miért is számít, hogy value vagy pedig referenceként adom át?

let num = 10

let obj1 = {item: "unchanged"}

let obj2 = {item: "unchanged"}

function changeStuff(a, b, c) {
  a = a * 10
  b.item = "changed"
  c = {item: "changed"}
}

changeStuff(num, obj1, obj2)

console.log(num) // 10
console.log(obj1.item) // changed
console.log(obj2.item) // unchanged

Nézzük is meg, hogy mi történik.

Az első console.log-nál 10 a kiírt érték mert nem a num-ot változtattuk, csak egy értékátadás történt és azt változtattuk, amivel azután nem is történt semmi.

Az másodiknál ”changed” amit kiír, mert referencia rámutatott a b.item az obj1.item-re és azt megváltoztattuk.

Ellenben a harmadiknál a kiírt érték az ”unchanged” lesz. Ennek oka az, hogy a changeStuff függvény paraméterként kapja az obj2 objektumot, de amikor az objektumot változtatjuk a függvényben, az csak az objektum hivatkozásának a változását eredményezi, nem pedig az objektumot magát.

Mi a különbség a == és a === operátor között?

Mindkettőnek két érték összehasonlításához van köze. A == két értéket, míg a === az értéket és a típusát is összehasonlítja.

Itt felmerül a kérdés, hogy „Hogy nézi meg a típust mikor a js-ben nincs is típusom?”.

Természetesen a válasz az, hogy van típusa mindennek, csak nem kötelező ezt közölni a JS-el, hogy egy változó deklarálásánál milyen típusú lesz, tudja ő az alapján, hogy mit raksz bele (dinamikusan típusos).

Primitíveknél typeof operatorral lehet megtudni.

typeof 42 // "number"
typeof "42" // "string"
typeof true // "boolean"

Array-ek esetén
```
Array.isArray()
```

Objectek esetén kicsit trükkösebb, pl.:

function isObject (item) {
    return (typeof item === "object" && !Array.isArray(item) && item !== null)
}

Melyek a JS primitív adattípusok?

Boolean
Undefined
Null
Number
BigInt
String
Symbol

Magyarázd el a JS Implicit Type Coercion-jét

JS ben az Implicit Type Coercion egy automatikus dolog amikor az értéket egy adott típusról neked átalakítja egy másik típusra. Akkor lép életben amikor egy kifejezés operátora összetalálkoztatja a két különböző típussal rendelkező értéket.

Azért fontos mindezt tudni, hogy ismerjük a JS belső lelki világát és ne nevezzük bugnak, hogy 5 + ”5” = ”55”.

JS kód feladatok

Írjon egy promisosított load image eventet (például HTML játékokhoz használható).

const promisifyLoadEvent = (url) => {
    return new Promise((resolve, reject) => {
        const image = new Image()
        const error = () => {
            image.removeEventListener("load", success)
            reject(new Error(`Failed to load image's URL: ${url}`))
        }

        const success = (event) => {
            image.removeEventListener("error", error)
            resolve(event)
        }

        image.addEventListener("load", success)
        image.addEventListener("error", error)
        image.src = url
    })
}

const loadImage = async (url) => {
    const e = await promisifyLoadEvent(url)
    console.log("Image loaded!", e)
}

React kérdéspéldák:

Mik a React hookok szabályai?

Hook-okat csak a komponens tetején szabad meghívni. Nem megengedett őket meghívni a beágyazott funkciókban, ciklusokban vagy feltételekben.
A hook-okat csak a React funkciós komponensekből szabad/lehet hívni.
Nem lehet hook-ot a serverComponent-ben meghívni.
A hookok sorrendje számít.

Hogyan tér el a hook-ok használatának teljesítménye az osztályok használatától?

A React hook-ok számos felesleges műveletet elkerülnek, mint például a példányok létrehozása, eventek bindelése, stb., amelyek az osztályoknál jelen vannak.

A React hook-ok használata kisebb komponensfákat eredményez, mivel elkerülik a HOC-ok (higher-order components) fészkelését, és prop-okat rendelnek, amelyek kevesebb munkát jelentenek a React számára.

Vajon a React Context helyettesítheti-e a Redux-ot, és miért?

Az esetek egy részében igen, azonban alapvetően a React context inkább nem arra lett tervezve, hogy teljes mértékben helyettesítse a state management megoldásokat. A fő szerepe a "prop drilling" elkerülésében rejlik, így bizonyos helyzetekben hatékony lehet. Fontos azonban megjegyezni, hogy bizonyos kompozíciós sémák esetén olyan mély beágyazódásokhoz vezethet, ahol cirkuláris függőségek merülnek fel. Ilyenkor a React context már nem tud megfelelően működni.

Miért nem szabad közvetlenül frissíteni az állapotot?

Ha megpróbálod közvetlenül frissíteni az állapotot, akkor a komponens nem fog újra renderelődni.

Használj helyette state setter metódust. Ez ütemez egy frissítést a komponens állapotobjektumához. Amikor az állapot változik, a komponens erre reagálva újra renderelődik.

React kód feladatok

Mi a hiba ebben a kódban és javítsd ki! I.

const App = () => {
    const [isMike, setIsMike] = useState(true)

    const handleClick = () => {
        setIsMike(prevState => !prevState)
    }

    return (
        <div>
            {
                isMike
                    ? <Counter name="Mike"/>
                    : <Counter name="Martha"/>
            }
            <button onClick={handleClick}>
                switch
            </button>
        </div>
    )
}

Megoldás: A Counter Komponensből két példány születik, de nem tudja a React megkülönböztetni őket még úgy sem, hogy különböző name propokat kapnak. Vagy be kell wrappolni az egyiket egy elementbe (span, div, etc…) vagy adni kell nekik egyedi key-t pl:. <Counter name="Mike" key="Mike"/> és <Counter name="Martha" key=" Martha "/>

Mi a hiba ebben a kódban és javítsd ki! II.

Index.jsx

import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'

import App from './Story'

const root = createRoot(document.getElementById("root"))

root.render(
  <StrictMode>
    <App />
  </StrictMode>
)

Story.jsx

import {useState} from 'react'

import StoryTray from './StoryTray'

let initialStories = [
    {id: 0, label: "Ankit's Story"},
    {id: 1, label: "Taylor's Story"},
]

export default function Story() {
    let [stories, setStories] = useState(initialStories)

    return (
        <div
            style={{
                width: '100%',
                height: '100%',
                textAlign: 'center',
            }}
        >
            <StoryTray stories={stories}/>
        </div>
    )
}

StoryTray.jsx

import { useState } from 'react'

export default function StoryTray({ stories }) {
    const [isHover, setIsHover] = useState(false)

    const items = stories

    items.push({ id: 'create', label: 'Create Story' })

    return (
        <ul
            onPointerEnter={() => setIsHover(true)}
            onPointerLeave={() => setIsHover(false)}
            style={{
                backgroundColor: isHover ? '#ddd' : '#fff'
            }}
        >
            {items.map(story => (
                <li key={story.id}>
                    {story.label}
                </li>
            ))}
        </ul>
    )
}

Megoldás: A state módosul amint a kurzort fölé visszük (onPointerEnter), ami miatt a StoryTray újra renderelésre kerül. Ekkor az items tömbbe egy új objektumot pusholunk. Amikor elhúzzuk róla az egeret (onPointerLeave), ugyanez a folyamat ismét megtörténik. A Strict Mode esetén minden renderelés development módban kétszer történik meg, hogy kiderüljenek az ilyen hibák. Ennek következtében a referenciák alapján az stories tömbbe kerül az új objektum. Ennek elkerülése érdekében a stories tömb klónozása szükséges, például a következőképpen: [...stories] vagy Object.assign([], stories).

Zárószó:

Köszönjük, hogy eddig a részig is eljutottál! Itt még annyit tennénk hozzá, hogy mindezek az általunk összeszedett és fontosnak talált gondolatok, de biztosan ezer és egy más javaslatot találsz a világhálón (tudjuk, mert mi is szétnéztünk ott – voltak nagyon viccesek is), akár a technikai akár az általános felkészítő kérdésekre lennél kíváncsi. Bízunk azért benne, hogy ezek az útmutatások és kérdéspéldák hatékony segítséget nyújtanak egy 2023-as React fejlesztői interjú eredményes felkészüléséhez. Fontos megjegyezni, hogy az interjúk nem csak arra szolgálnak, hogy kipróbáld a tudásod, hanem hogy lehetőséget adjanak arra, hogy bemutasd személyiséged, problémamegoldó és alkalmazkodó képességeidet is. Sok sikert és magabiztosságot kívánunk az interjúkhoz!

Utóirat:

Bocsi a „kód” ismétlésért, 14* sikerült elkövetnem ^^