Senior Software Engineer — Frontend Interview experience at Headout

Overview

The interview process for the Senior Software Engineer - Frontend position at Headout was designed to assess a candidate's technical skills and experience through a series of three rounds. These rounds covered JavaScript coding, system design, and a hiring manager interview. The goal was to evaluate the candidate's ability to build user-centric interfaces, solve complex problems, and demonstrate an ownership mindset.

Interview Rounds

Round 1: JavaScript Coding Challenge – Real-Time Movie Search & Filter (Vanilla JS)

This round focused on assessing the candidate's proficiency in vanilla JavaScript, HTML, and CSS. The candidate was tasked with building a movie search component with the following requirements:

• Rendering an unstyled list of movies.
• Implementing real-time search using substring matching.
• Adding basic styling to display movies as cards.
• Enabling genre-based filtering.
• Supporting subsequence matching (e.g., input 'hp' should match 'Harry Potter').

The candidate fetched movie data using fetch() on page load and stored it in memory. They created an input box and dropdown for genre filtering using plain HTML and added event listeners to update the filtered list on each change. The filtering logic was implemented using JavaScript loops and conditionals. Substring matching used movie.title.toLowerCase().includes(query), and subsequence matching utilized a custom function. Matched substrings were highlighted using a <span> tag with bold styling. The movie cards were styled with basic CSS, including poster images, movie titles, years, and genres.

Challenges included efficiently handling both substring and subsequence matching, maintaining UI responsiveness without frameworks, and structuring the code without module bundlers or build tools.

Round 2: System Design – Building Excel from Scratch

This round was a system design session focused on designing an Excel-like spreadsheet application, emphasizing data structures and performance. Key requirements included:

• Data Structure Design: Efficiently storing and retrieving cell values, supporting formatting at each cell, and handling formulas and references across the spreadsheet.
• Formula Support: Supporting complex expressions like =SUM(A1:A20, B1, C1:C22), including cell ranges, individual cell references, and multiple arguments inside a single function.
• Cell Dependencies: Automatically triggering recalculation of a cell (e.g., A1) when its dependent cells (e.g., B1 and C1) are updated.