Ask HN: How to prepare for a Front-end Developer interview? • Hacker News Board

Re: Ask HN: How to prepare for a Front-end Developer interview?

#81

Post by gargarplex » Mon, Aug 15, 2016, 2:44 AM UTC

Understand HTTP (cookies, sessions, how HTTP works end to end at a basic level is fine– you should know about the lifecycle of an HTTP request including how it interacts with the server).

Understand CSS3 (including cross platform limitations, preprocessors and frameworks, responsive web, specificity, why you should inline styles for email, and things like the difference between inline, block, inline-block and flex layouts, be able to accurately and quickly code a PSD into HTML5+CSS3, basic photoshop/illustrator skills)

Understand HTML and be able to write Html5, from scratch on a whiteboard, that validates (html5, browser differences)

Understand JavaScript (closures, jquery, underscore, transpilers and polyfills, cross platform limitations, progressive enhancement and graceful degradation, and at least one framework, be it react, backbone, ember, angular or similar other, browser debugging tools)

Understand best practices for optimization (server and browser caching, concatenation, gzip minification, concurrent HTTP request limitations, CDNs, image sprites if and where appropriate, etc.)

Understand security risks (HTTPS, input validation, xss, cookie security issues, x-domain issues).

Understand build tools (grunt, gulp, etc.)

Re: Ask HN: How to prepare for a Front-end Developer interview?

#82

Post by smnplk » Mon, Aug 15, 2016, 2:47 AM UTC

corecoder wrote: post #18

Before Babel, I often used to ask about code organization/modularization, mostly to filter out candidates who haven't been on a big project and have only copied and pasted jQuery snippets together; today I'd ask if you use Babel modules and why/why not. As other people have said, closures will surely come out. A favorite of mine is array functions: map, forEach, filter. Also, promises, callbacks, workers. Finally, xh…

are JS closures already fixed ?

var a = 10; var fn = function (x) { return x + a}; fn(10); ==> 20 var a = 1; fn(10) ==> 11 //WAT ??

Is the above fixed with ES2015 ? Closures need to enclose values and not references.

Re: Ask HN: How to prepare for a Front-end Developer interview?

#83

Post by mathgeek » Mon, Aug 15, 2016, 2:50 AM UTC

danyim wrote: post #66

ricardobeat wrote: post #61

Earlier quoted context omitted.

Try writing that same thing without ES6.

I'm also in the process of interviewing for a front-end engineer position, so thank you for replying and providing feedback. I'm assuming it has to be written this way because the function being pushed was referencing i, which was within the scope of the closure. Turning it into an IIFE breaks out of that. Thoughts? // Assuming pre-ES6 function iterate(k) { var funcs = []; for(var i = 0; i

I'd probably ask you to do the printouts from within the function itself.

If you haven't already read them, I highly recommend the You Don't Know JS series of books. One of them covers this exact question.

Re: Ask HN: How to prepare for a Front-end Developer interview?

#84

Post by teknologist » Mon, Aug 15, 2016, 3:04 AM UTC

k__ wrote: post #41

The ones that hired me just asked if I can do the job ;)

I got one of my best roles like this. Admittedly there was also a part where I was asked to share my laptop's screen and after one look the guy said "ok you're hired."

Re: Ask HN: How to prepare for a Front-end Developer interview?

#85

Post by zeven7 » Mon, Aug 15, 2016, 3:15 AM UTC

danyim wrote: post #58

ShellfishMeme wrote: post #37

Earlier quoted context omitted.

I agree. We always put the little 'for loop that creates a list of functions that spit out the current number of the iteration' exercise first in all of our interviews. Generally, when people solved that one fast, they also did well in the rest of the interview and if they struggled there, they also had a hard time coming up with an elegant solution for most of the other tasks. What I also like about it is that a clo…

Would that exercise be the following? I'm not sure I understand what's being tested. const f = (k) => { const funcs = []; for(let i = 0; i i); } return funcs; } const test = f(4); console.log(test[0]()); // 0 console.log(test[1]()); // 1 console.log(test[2]()); // 2 console.log(test[3]()); // 3

Tip: You can stick to `const` when declaring `i` in the loop header (at least as far as the ES spec is concerned -- mileage may vary on current implementations / transpilers).

Re: Ask HN: How to prepare for a Front-end Developer interview?

#86

Post by DavidWanjiru » Mon, Aug 15, 2016, 3:19 AM UTC

I don't know how these things work, but I'd have thought showcasing your prior work goes a long way in determining if someone wants to hire you. A bit similar to how, if I wanted you to create an ad campaign for my product, I'd more interested in seeing other campaigns you'd done, more than anything else. To see how you quantified the problem and the solution you came up with. Isn't that what front end dev is?

Re: Ask HN: How to prepare for a Front-end Developer interview?

#87

Post by Imagenuity » Mon, Aug 15, 2016, 3:30 AM UTC

Understand Big O notation [1] and how to use more technical JavaScript features like .map [2] and .reduce [3].

I get asked these frequently, and it was never mentioned to me when I asked for advice on how to prepare. This may be specific to senior developer positions.

[1] https://en.wikipedia.org/wiki/Big_O

[2] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

[3] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

Re: Ask HN: How to prepare for a Front-end Developer interview?

#88

Post by minikomi » Mon, Aug 15, 2016, 4:01 AM UTC

corecoder wrote: post #18

Before Babel, I often used to ask about code organization/modularization, mostly to filter out candidates who haven't been on a big project and have only copied and pasted jQuery snippets together; today I'd ask if you use Babel modules and why/why not. As other people have said, closures will surely come out. A favorite of mine is array functions: map, forEach, filter. Also, promises, callbacks, workers. Finally, xh…

Can you clarify what you mean by xhr throttling? Implementing something like _.throttle to wrap requests?

Re: Ask HN: How to prepare for a Front-end Developer interview?

#89

Post by joeframbach » Mon, Aug 15, 2016, 4:16 AM UTC

theshadowmonkey wrote: post #60

justrossthings wrote: post #42

I'm a front-end dev going through the hiring process right now. Here's a list of some of the questions I have been asked in technical interviews: - What is a clojure? - What is a callback? - What is an IIFE? - How can you use scope to keep a copy of i in a loop? - What is going on when you click a link to go to a website? - Difference between classical inheritance vs prototypical - Difference between object-oriented…

you meant closure ?

also "prototypal"

Re: Ask HN: How to prepare for a Front-end Developer interview?

#90

Post by ehsanu1 » Mon, Aug 15, 2016, 4:29 AM UTC

danyim wrote: post #66

ricardobeat wrote: post #61

Earlier quoted context omitted.

Try writing that same thing without ES6.

I'm also in the process of interviewing for a front-end engineer position, so thank you for replying and providing feedback. I'm assuming it has to be written this way because the function being pushed was referencing i, which was within the scope of the closure. Turning it into an IIFE breaks out of that. Thoughts? // Assuming pre-ES6 function iterate(k) { var funcs = []; for(var i = 0; i

If you can figure that out during an interview, you're solid on the question. That's the gist of it, and knowing that you can use `let` to make it work is good too.