The Most Common Front-End Interview Questions & Right Answers

While many jobs are now offered based on a candidate’s technical knowledge and demonstrable prowess, there is still usually the interview to overcome. Here’s how to overcome those tricky front-end interview questions and show off your people skills.

Unlocking tech talent stories

February 1, 2021

From the depths of 2020, the new year looks like a better bet for the technology industry and the many coders who may have stuck tight during COVID. Now there are more career opportunities out there, here’s a useful refresher of the type of front-end developer questions you might face and how to make a good impression on Zoom, Teams or in person.

Taking the test

Firstly, while you may be used to developing and coding in your current environment, part of the interview process might include taking a coding test or challenge. Common examples that you might be asked to work on might include:

“As discussed, here is a quick coding challenge for you. It’s important to note that it’s by no means a test…we just want to get a sense of how you write code and solve typical problems that you might face.

Here is a simple API that returns a JSON array. We would like you to use HTML, CSS and Javascript to read the API and display it in an organized way. Also, you should add a sorting mechanic to the front-end. Feel free to use any frameworks you would like to achieve the task.”

Here, the key is to read the request very clearly and understand what they are asking. Then create a list of the features that you are asked to build and tick them off as they are created to ensure you have met all the objectives.

Annotate any clever calls, links or tricks you use in the coding so they are clear to anyone who inspects what you create. Finally, avoid going overboard on showing off your skills, someone who can create a succinct and clear solution is all that the hirers will be looking for.

Coding

Common interview questions and answers

When it comes to a remote interview try to look smart and ensure your environment looks respectable. While you may prefer to code from your man cave or in bed, hirers will infer negative connotations from someone surrounded by messiness or a post-punk aesthetic. For in-person interviews, you should always look professional, regardless of the type of organization that is hiring, from startup to enterprise.

In both scenarios, you need to be prepared to answer the typical front-end developer curveballs they might throw at you.

  1. What are the main advantages of REST web services?

Some of the main advantages of use REST include:

  • A simple learning curve as REST web services use HTTP;
  • REST is flexible supporting multiple data transfer methods including images, JSON, XML and text;
  • It is lightweight and there is no client/server contract for loose-coupled implementations;
  • REST is easy to test using a browser.

2. Explain what is a Content Security Policy and how would you implement it?

CSPs are part of the HTTP header that prevents cross-site scripting (XSS) vulnerabilities. They allow site operators control over where site resources can be loaded from, disabling unsafe controls in JavaScript. CSP is mandatory for new sites and should be added to any high-risk existing sites, although these need to be analyzed on a case-by-case basis.

3. What is user-centred or user-centric design?

This is a process where the developers focus on what the end-users expect and want from a website, building the site around those needs. Developers should use an iterative design process with the design team to understand and create an accessible and usable end product that results in high satisfaction ratings.

4. When would you use jQuery?

jQuery is designed to make most JavaScript development tasks easier. I would use it for tasks such as cross-browser support, complex element selection, animation and event handling easier. jQuery helps to reduce development time but can reduce performance as an overhead.

5. What are the new elements in HTML5?

The main elements are canvas, video and audio tags that enable the simple addition of content. Canvas (introduced by Apple) is the most powerful as it allows for the creation of visuals on the fly using image elements, text and other graphics.

6. What is AngularJS and what are the benefits over jQuery?

AngularJS is a Model-View-ViewModel (MVVM) Framework that can do similar things to jQuery but is more structured, especially with more complex projects. As a library, jQuery does not define how to structure the code, while the angularJS framework imposes a structure on how to organize your code. So, if a project looks like a sizeable task, AngularJS becomes the preferred option.

7. What are the basic differences between the Long-Polling, Server-Sent Event and Websocket features?

  • Long-polling creates an HTTP request that remains open until it receives an update. Following the update, a new request is opened to wait for further updates.
  • A WebSocket protocol creates a constant, bi-directional communication between the server and the client.
  • Server-sent events are based on a long-lived HTTP connection, with updates continuously sent to the client to keep the connection alive.

8. What are the basic differences between web cookies, session storage, and local storage?

  • Cookies are compact data storage, up to 4K, for the browser, accessible through the server or browser.
  • Local Storage is a local store for the browser, capable of saving up to 10MB of data.
  • Session Storage is a temporary local store for the browser, up to 5MB but is cleared once the browser or session is closed.

9. What are your favourite HTML5/JSON/other features, how have you used them in projects?

These open-ended questions allow you to demonstrate your knowledge and expertise. The key is to think of an answer, on the spot, that demonstrates a task or situation beyond the usual and how you solved it with some lateral thinking or clever coding. Take more time on these answers than others as they can add up to extra credit during an interview.

There are many more questions and types of questions you can find and think up during your interview preparation, we covered some of the most common ones.

Remember: interviews can be stressful for the recruiter too. Do not rush your answers or try to show off too much to non-technical members. They will have dealt with many types of candidates, so don’t worry too much about nerves.

Now that you’re prepared, it’s time to start sending those applications for Front-end Jobs.


Chris Knight is a tech writer interested in mobile, digital business, automation, IT, smart homes and gadgets — anything with a GHz pulse.

0 Comments
Submit a Comment

Your email address will not be published. Required fields are marked *

Share This