Technical front-end interviews are difficult. That’s a fact. Not only do you need to have a solid grasp of computer science fundamentals, but also an understanding of things like web performance, build systems, and CSS layout engines.

While there are resources out there, I’ve found that there are only a few complete guides for helping you prepare for a front-end interview. So I decided to write a topic by topic outline that will hopefully help you ace your next interview.

Before the interview

So before your interview, ask your recruiter for the format of the interview. Some interviews might revolve around a whiteboard while others might use an online text editor like CoderPad. It’s important to know so you can practice in the environment that your interview is going to take place in.

Also, ask your recruiter for tips on what topics to focus on when preparing. The reason behind this is because in addition to front-end specific question, some companies will ask you traditional computer science questions about topics like searching and sorting algorithms.

Front-end concepts

HTML and CSS, Javascript, and Javascript design patterns are the key concepts that you will be tested on during an interview. Go through the list and make sure you are comfortable with each topic.

HTML and CSS is like the bread and butter of front-end development. During interviews, you will most likely be asked questions about the nuances of HTML and CSS. Also, be prepared to be asked to code up a layout based on a mockup.

Just in case you need an HTML and CSS refresher, here are a few basic concepts to look over.

In addition to these concepts, know about CSS preprocessors like SASS or LESS and their benefits. Also be familiar with CSS naming conventions like BEM and OOCSS.

Another important point is that interviewers look for candidates who champion CSS best practices. As a good reference, this guide written by a front-end at Medium provides insight into how Medium iterated to their current CSS architecture.

I mentioned earlier that some interviewers will ask you to recreate layouts in HTML and CSS. Practice doing so in a playground like CodePen. Check out Dribbble since it has lots of simple yet nice designs that would be fun to recreate.

Finally, as front-ends, we are so used to making changes in our editor and then verifying the change in our browser. Often times during interviews, you won’t have this luxury. When you’re preparing for your interview, try code most of your layout without looking at the result till the end.