linkedin Skip to Main Content
Categories

2 Top-Shelf Interview Questions to Ask Your Senior Front-End Engineering Candidates

Interviewing

Senior software engineers don’t come cheap. 

With the average compensation for this level of developer averaging about $167,000, making the wrong hire could be terrible news for your hiring budget – not to mention your team’s productivity and morale. 

The skills needed to become a senior front-end engineer are not trivial. There’s a reason they can command such high salaries, and can be so hard to find these days.

That’s why making sure you ask the right questions in a technical interview is so important.

For senior front-end engineers, that means focusing primarily on the complex business logic they’d be working on. 

The questions you form around this business logic should be open-ended. Most challenges senior engineers face on the job aren’t solved with a “yes” or “no” answer – they involve lots of discussion with tech leads and other senior engineers.

For example, at CoderPad, our product includes a handy form that allows you to create questions to use in interviews. We often ask senior-level engineers to mimic creating a form like this. Some of the business logic they have to consider:

  • How do they validate different fields for the correct data type?
  • How do they ensure required fields are filled in?
  • How do they ensure that field B, dependent on field A’s value, fills in with the correct default value?
  • What data structures are best suited for defining the shape and flow of the form?
  • How can they create the form such that it is flexible enough to handle future changes to field groupings?

Senior developers should also understand how different technologies fit into your application’s architecture and how they interact with the front end.

With that in mind, here are two technical questions that would be great for assessing the skills needed to be a senior front-end engineer.

SpaceX Launch List

This example asks candidates to use a GraphQL API to gather data from a website and display that data in the UI. In this case, the data display takes the form of a filterable table.  

Any roles that would involve data visualizations like dashboards, financial charts, or infographics (to name a few) would be a perfect fit for this kind of question. 

This challenge is particularly interesting in that candidates have to query a GraphQL API without the help of a library like Apollo. Many engineers take libraries like Apollo for granted. This exercise will challenge them to think about what happens behind the scenes of a library like the Apollo client. 

If the candidate isn’t sure about how this works, it is an excellent opportunity to do pair programming and possibly teach them about these concepts.

This question reflects a common task in front-end development – gather data from disparate sources using a GraphQL query/API request and combine them in a way the end user quickly understands.

As such, when you assess the candidate’s performance in answering this question, think about how the challenges they come across reflect the challenges they’d have on the job and how their priorities and working style fit with your team.

Some of the things to look for during an interview with this Launch List question:

  • Do they have trouble using the SpaceX API docs to build a query? (The API docs have a very friendly interface to build a query, which the candidate can then use in their solution)
  • Do they understand nested fields?
  • Do they address how caching/normalization might fit into their solution? Apollo has a cache under the hood that caches queries using the query literal and the query variables as the cache key.
  • Did they figure out how to populate the rocket filter? Do they attempt another query to get a list of rockets? Do they pluck the rockets from the launch list query results?
  • Do they understand paging, maintaining state for pages, and how to pass the additional query variables to the SpaceX API?
  • Did they consider text overflow with the potentially large details field in the table?

React File Tree Builder

This question tests a candidate’s ability to generate a complex UI from a simple input. 

Candidates are presented with a list of file paths and are asked to turn that into an arbitrarily-deep file tree explorer. If the candidate can solve the initial task of generating, sorting, and rendering the data structure, they are then asked to implement an “Add File” feature. 

This question is an excellent test for your senior engineering candidate’s ability to read and render data structures.

When it comes to assessing the candidate’s results, here are some criteria to make sure they’d be a good fit for the company:

  • How efficient is their algorithm? How many times do they loop over the files list?
  • How accurate is their solution? Are they sorting things correctly according to the requirements? Does the solution handle edge cases?
  • How do they get to the answer? Do they immediately know how to solve and just jump into writing code? If they don’t know the answer right away, do they know how to utilize appropriate resources (e.g., Google, StackOverflow, you, etc.) to find a suitable solution?
  • Do they test their code? 

Other interviewing resources

Selecting the right question for senior developer candidates is just one part of setting up an excellent interview operation.

Just like with junior and intermediate-level candidates, you also have to consider how to prepare for the interview, the best way to give candidates feedback, how you’re going to prevent potential cheating, and more.

Our blog’s Interviewing section extensively covers interviewing pro tips and best practices. Here are also a few we recommend to get you started: