Front-end developers are responsible for building the parts of applications that users see and interact with. (In most cases, front-end development refers particularly to web applications as interpreted by a user’s browser.)
If we want to provide an engaging experience to our users, hiring good front-end developers is key.
Over time, web user interfaces (UIs) have become more interactive. They have also spread to new contexts, like mobile, wearables, and cars.
Within that, there are many more specific specializations, and new ones are appearing all the time. The general knowledge and skill set has also broadened, with many technologies being used across specializations.
So how can you know what’s important when it comes to hiring front-end developers?
The simpler and older of the two styles, this is used in apps like Gmail’s “Basic HTML” version and in most traditional web forums.
HTML and CSS. All front-end developers have to understand web markup (HTML) and cascading style sheets (CSS). These are the standard building blocks that web browsers interpret and present as visual UI elements. Front-end developers should know HTML5 and CSS3—which have been the standard versions for a while now—and know when to use their more recent features.
Responsive design. If we want to allow using web applications in mobile devices, the UI should adapt to mobile device environments. (Even if you don’t, your users may try it anyway.) Front-end developers need to know how to build and optimize web applications for so they are flexible when it comes to screen sizes, ratios, and orientations.
UI frameworks. Many times, front-end developers don’t need to build UI elements from scratch. UI frameworks allow for reusing already-created UI elements with defined style guides, compatible with desktop browsers and mobile devices.
Developers can use lightweight UI frameworks for setting up a grid system for the whole layout or more robust frameworks for including various UI elements.
A good front-end developer will know when to use UI frameworks, which are helpful especially for rapid prototyping.
CSS-transforming tools. Front-end developers should also know how to create valid cross-browser and mobile compatible style sheets effectively. This can avoid issues in production.
CSS by itself has limited capabilities for creating optimized style sheets, but CSS preprocessors such as LESS, Sass/SCSS, or Stylus provide a more advanced way of writing style sheets and compiling them into CSS.
Another category of CSS transforming tools are those like PostCSS. Its plugins allow the use of CSS preprocessors along with other task runners for analyzing and optimizing style sheets. While experience isn’t strictly required, it does indicate that a developer is staying current in ways that boost their productivity.
If the front-end developer you’re considering doesn’t know how to use CSS transforming tools, you can expect bloated style sheets with compatibility issues that take longer to fix.
2D and 3D graphics. UIs can contain dynamic and interactive graphics and visualizations, sometimes even in three dimensions.
Accessibility. People with certain disabilities sometimes have very limited ways in which they can interact with devices.
Hire a front-end developer who can remove disability barriers and extend UIs using ARIA accessibility attributes. They will be able to make your site much more usable via text-to-speech software, text-to-Braille hardware, and potentially other specific modifications.
Graphic design and typography. Web designers are responsible for choosing and creating visuals for web applications.
Front-end developers are responsible for ensuring that the whole design is working in web browsers. They should understand basics of graphic design and typography for digital products.
The output of web design can be modified in graphic editor software, and front-end developers should know how to use the output to make basic edits in graphic editor software, or better yet, using a browser’s developer tab to show changes exactly as they would appear.
UI and UX. UI and UX designers ensure that a user’s interaction with a product’s UI is simple, usable, and feasible in terms of web browser rendering capabilities.
Front-end developers are responsible for implementing UI and UX designers’ work. They should be familiar with user interface design best practices and know how to use the output of wireframing and mockup tools like Sketch and Balsamiq.
Search engine optimization (SEO.) If you want to address a wide or target audience, developers can use SEO techniques to make it easier to find your site when searching.
Front-end developers should know how to involve SEO principles in web markup to make web pages visible in search result lists.
Web template systems. Content management systems (CMSes) and web publishing platforms offer many built-in features for web applications. This invariably includes a web template system.
Front-end developers can use a template for the automatic generation of UI elements. If your project runs on a platform or CMS, front-end developers who are familiar with that platform and templating system have a big advantage, because they can develop your project’s UI faster and with less hassle.
Code versioning tools. Nowadays, it’s a given that your project will use a tool like Git or Mercurial to track the history of your project’s code.
Even if you don’t use code versioning tools—yet—you’ll want to find a front-end developer who is comfortable setting that up for you and implementing versioning best practices.
Without these tools, you will quickly hit a point in your project where developers need to see file history and the reason behind a change—but can’t.
Also, there’s a difference between making simple commits while working alone and knowing how to integrate changes in the context of a fast-paced development team. When you hire a front-end developer, more experience with source control—especially the flavor you intend to use—will allow them to integrate into a team much more easily.
Front-end Web Developer Interview Questions
What were the biggest compatibility issues you had to solve?
This gives the developer a chance to show their level of experience in the industry. If front-end developers have developed applications for a wider audience or for many years, they should come across compatibility issues among different web browsers.
The answer can also include development of responsive design for mobile devices.
What do you think is the best way for rapid prototyping and development when it comes to web applications?
A good opportunity to let them explain their favourite frameworks and tools. Developers can introduce UI frameworks as well as CSS-transforming and other tools that help them to streamline software development processes.
What are the main goals and motivations for using the latest standards of HTML5 and CSS3?
UI developers should know that new standard versions were designed to deliver media content (video, audio, interactive graphics) without additional plugins such as Flash, provide better cross-platform support for various devices, and implement semantic support for web pages, which has a significant impact on SEO.
Web applications can also use a multiple-page approach or a hybrid of the two. Based on the project, front-end developers should know which approach is appropriate for the project and how to implement it.
Networking protocols. An application’s front-end receives data from its back-end using networking protocols. Front-end developers need to understand the REST architectural style and standard networking protocols designed for web application environments.
Most web applications use the HTTP and/or HTTPS protocols and Ajax, and applications’ back-ends usually provide data through a REST API.
Sometimes, projects will require high interaction between the back-end and front-end—e.g., interactive games or dynamic media streams—and in these cases, your front-end developer will need to be comfortable working with more advanced protocols such as web sockets.
Security. Front-end developers should be familiar with web security concepts and how to integrate user authentication and authorization into an application’s front-end.
Advanced optimization. Complex front-end architectures can contain a lot of source code with redundant dependencies, a situation which requires additional optimization.
It can also happen that front-end developers have to start building front-end architecture without any support or data from an application’s back-end. In this case, they need to know how to design and develop their own API calls to mock (fake) the data that will later be provided from the back-end.
If this is true about your project, you may need to lean towards a full-stack developer, or at least one who has worked with a variety of web APIs and has a good sense of their best practices.
Front-end Engineer Interview Questions
What is the difference between single-page and multi-page applications? Which approach would you suggest for my project?
SPAs are able to redraw any part of the UI even with new data, without the need to reload all of the UI content. Multiple-page applications redraw the whole UI with every user action that submits or requests new data. Front-end developers should understand this concept and be able to explain to you which approach is suitable for the project and why.
How would you speed up and secure a single-page application?
This question gives the developer the chance to show their experience with developing SPAs. If a developer knows advanced optimization techniques such as preloading content or lazy loading, it means that they have experience with developing robust SPAs.
If they know how to secure SPAs, they should know how to develop an application’s front-end with multiple permissions and different user roles. This experience could be shown by a short previous project demonstration.
“Needle in a Haystack” No More
But many times, projects require an intersection of the two categories.
It can be very hard for someone who hasn’t been involved in software development to recognize what sort of developer experience is required for the project. But by using the Q&A in the article above, you will be able to recognize if a front-end developer understands and is able to communicate about fundamental concepts effectively.
You have your project’s requirements. Now you also know what skill set and knowledge you should focus on. It’s time to find your ideal front-end developer!