Front End Engineer Interview Questions

Front End Engineer Interview Questions

Un Front end engineer si occupa dell'esperienza utente di un software o di un'app. Durante un colloquio, dovrai dimostrare di comprendere i principi del UX/UI design, di voler contribuire alla realizzazione di un codice ottimizzato per l'offerta di prodotti e di voler collaborare con i back-end engineer alla risoluzione dei problemi. Aspettati domande sulla tua esperienza tecnica e di design, nonché sulle tue competenze di gestione dei membri del team.

Domande tipiche dei colloqui per Front end engineer e come rispondere

Question 1

Domanda 1: Qual è il flusso di lavoro o lo stile di gestione che preferisci?

How to answer
Come rispondere: Descrivi quali strumenti e metodologie usi durante lo sviluppo di un prodotto. Parla delle strategie che usi per lavorare con un'ampia varietà di stakeholder, tra cui clienti, reparto vendite e marketing e back-end engineer. Usa esempi specifici per mostrare come il tuo flusso di lavoro ha avuto successo ed esprimi anche la volontà di adattarti e cambiare se necessario.
Question 2

Domanda 2: Come gestisci le fasi di test, le revisioni e il controllo delle versioni?

How to answer
Come rispondere: Gran parte del ruolo di Front end engineer riguarda quei dettagli minuziosi che rendono fluida l'esperienza dell'utente. Evidenzia che capisci l'importanza di un codice pulito e corretto, dei protocolli di test e della gestione delle versioni. Usa esempi di metodologie che hai implementato e fornisci dettagli sui problemi che sei stato in grado di gestire o risolvere.
Question 3

Domanda 3: Cosa ti entusiasma di più nell'area UX/UI?

How to answer
Come rispondere: Una domanda come questa ti offre l'opportunità di dimostrare che sei appassionato di ingegneria front end. Spiega come integri il design centrato sull'utente nei tuoi progetti e le filosofie a cui ti ispiri. Specifica i libri o gli articoli che hai letto e di cui hai apprezzato i contenuti. Se possibile, parla dei cambiamenti che prevedi e di come secondo te il design e la tecnologia si adatteranno a questi cambiamenti.

21,103 front end engineer interview questions shared by candidates

Given an input array and another array that describes a new index for each element, mutate the input array so that each element ends up in their new index. Discuss the runtime of the algorithm and how you can be sure there won't be any infinite loops.
avatar

Front End Engineer

Interviewed at Meta

3.6
Apr 8, 2013

Given an input array and another array that describes a new index for each element, mutate the input array so that each element ends up in their new index. Discuss the runtime of the algorithm and how you can be sure there won't be any infinite loops.

Given input: // could be potentially more than 3 keys in the object above items = [ {color: 'red', type: 'tv', age: 18}, {color: 'silver', type: 'phone', age: 20} ... ] excludes = [ {k: 'color', v: 'silver'}, {k: 'type', v: 'tv'}, .... ] function excludeItems(items, excludes) { excludes.forEach(pair => { items = items.filter(item => item[pair.k] === item[pair.v]); }); return items; } 1. Describe what this function is doing... 2. What is wrong with that function ? 3. How would you optimize it ?
avatar

Front End Engineer

Interviewed at Meta

3.6
Nov 27, 2017

Given input: // could be potentially more than 3 keys in the object above items = [ {color: 'red', type: 'tv', age: 18}, {color: 'silver', type: 'phone', age: 20} ... ] excludes = [ {k: 'color', v: 'silver'}, {k: 'type', v: 'tv'}, .... ] function excludeItems(items, excludes) { excludes.forEach(pair => { items = items.filter(item => item[pair.k] === item[pair.v]); }); return items; } 1. Describe what this function is doing... 2. What is wrong with that function ? 3. How would you optimize it ?

1. In JavaScript, write a function that takes an array as input that can contain both ints and more arrays (which can also contain an array or int) and return the flattened array. ex. [1, [2, [ [3, 4], 5], 6]] => [1, 2, 3, 4, 5, 6] 2. Using HTML and CSS, show how you would create an image that would display another image (aligned to the bottom, right) when the user hovers over the image. ex. The Facebook "edit profile picture" icon
avatar

Front End Engineer

Interviewed at Meta

3.6
Feb 21, 2014

1. In JavaScript, write a function that takes an array as input that can contain both ints and more arrays (which can also contain an array or int) and return the flattened array. ex. [1, [2, [ [3, 4], 5], 6]] => [1, 2, 3, 4, 5, 6] 2. Using HTML and CSS, show how you would create an image that would display another image (aligned to the bottom, right) when the user hovers over the image. ex. The Facebook "edit profile picture" icon

Given a grid of characters output a decoded message. The message for the following would be IROCKA. (diagonally down right and diagonally up right if you can't go further .. you continue doing this) I B C A L K A D R F C A E A G H O E L A D
avatar

Front End Engineer

Interviewed at Meta

3.6
May 28, 2015

Given a grid of characters output a decoded message. The message for the following would be IROCKA. (diagonally down right and diagonally up right if you can't go further .. you continue doing this) I B C A L K A D R F C A E A G H O E L A D

If you were building a search tool and wanted search results to pop up as you typed but the server call was taxing, write a function that gets called on every key down but calls the server when the user stops typing for 400ms.
avatar

Front End Engineering Intern

Interviewed at Meta

3.6
Jan 13, 2015

If you were building a search tool and wanted search results to pop up as you typed but the server call was taxing, write a function that gets called on every key down but calls the server when the user stops typing for 400ms.

// Given var endorsements = [ { skill: 'css', user: 'Bill' }, { skill: 'javascript', user: 'Chad' }, { skill: 'javascript', user: 'Bill' }, { skill: 'css', user: 'Sue' }, { skill: 'javascript', user: 'Sue' }, { skill: 'html', user: 'Sue' } ]; getSkills = (endorsements) => { // Result // [ // { skill: 'javascript', user: ['Chad', 'Bill', 'Sue'], count: 3 }, // { skill: 'css', user: ['Sue', 'Bill'], count: 2 }, // { skill: 'html', user: ['Sue'], count: 1 } // ]; } see this image: http://i.imgur.com/UIeB3n4.png
avatar

Front End Developer

Interviewed at LinkedIn

3.8
Jan 8, 2019

// Given var endorsements = [ { skill: 'css', user: 'Bill' }, { skill: 'javascript', user: 'Chad' }, { skill: 'javascript', user: 'Bill' }, { skill: 'css', user: 'Sue' }, { skill: 'javascript', user: 'Sue' }, { skill: 'html', user: 'Sue' } ]; getSkills = (endorsements) => { // Result // [ // { skill: 'javascript', user: ['Chad', 'Bill', 'Sue'], count: 3 }, // { skill: 'css', user: ['Sue', 'Bill'], count: 2 }, // { skill: 'html', user: ['Sue'], count: 1 } // ]; } see this image: http://i.imgur.com/UIeB3n4.png

Write an emitter class: /* emitter = new Emitter(); // 1. Support subscribing to events. sub = emitter.subscribe('event_name', callback); sub2 = emitter.subscribe('event_name', callback2); // 2. Support emitting events. // This particular example should lead to the `callback` above being invoked with `foo` and `bar` as parameters. emitter.emit('event_name', foo, bar); // 3. Support unsubscribing existing subscriptions by releasing them. sub.release(); // `sub` is the reference returned by `subscribe` above */
avatar

Front End Engineer

Interviewed at Meta

3.6
Nov 17, 2016

Write an emitter class: /* emitter = new Emitter(); // 1. Support subscribing to events. sub = emitter.subscribe('event_name', callback); sub2 = emitter.subscribe('event_name', callback2); // 2. Support emitting events. // This particular example should lead to the `callback` above being invoked with `foo` and `bar` as parameters. emitter.emit('event_name', foo, bar); // 3. Support unsubscribing existing subscriptions by releasing them. sub.release(); // `sub` is the reference returned by `subscribe` above */

Viewing 1 - 10 interview questions

Glassdoor has 21,103 interview questions and reports from Front end engineer interviews. Prepare for your interview. Get hired. Love your job.