Senior Front End Engineer Interview Questions

2,005 senior front end engineer interview questions shared by candidates

Almost all the questions were logical & didn't seem out of place. One of the questions I quite like was how does one maintain CSS in large companies esp. when a lot of teams are working independently of each other in different products on a common code base.
avatar

Senior Front End Developer

Interviewed at Xero

3.5
Aug 20, 2014

Almost all the questions were logical & didn't seem out of place. One of the questions I quite like was how does one maintain CSS in large companies esp. when a lot of teams are working independently of each other in different products on a common code base.

Create a BarGraph component - The required interface for the componant is to accept the following props and render the UI in the image above: const DATA = [ { label: "A", value: 5 }, { label: "C", value: 2 }, { label: "B", value: 23 }, ]; const COLORS_PALETTE = ["#ff0000", "#ff8000", "#00ff80"]; Additional Requirements Graph Size - should be based on the width / height props (e.g. "100px", you can assume the provided values will be strings with px suffix). Graph Padding - A padding of 5px (vertical and horizontal) should exist between the graph-area's border and the columns. Column Height - Columns should indicate their value by their height, have a minimum height of 5px and the highest column value should fill the graph's height. Column Width Each column should have 8px of spacing to the columns near it, and they should fill the available graph width, while having a minimum width of 15px. Data points can be assumed to fit in the graph width. Data Points - Each data point has a label which is a single capital letter, and an non-negative number, e.g. { label: "A", value: 42 }. Labels - Should only be displayed for the X axis (under the graph), and not for the Y axis. Coloring - Column colors should be cyclic - first color for the first column, second for the second, and so on, until there are no more colors, and then the same order should be used again.
avatar

Senior Front End Developer

Interviewed at Claroty

4.2
Feb 14, 2024

Create a BarGraph component - The required interface for the componant is to accept the following props and render the UI in the image above: const DATA = [ { label: "A", value: 5 }, { label: "C", value: 2 }, { label: "B", value: 23 }, ]; const COLORS_PALETTE = ["#ff0000", "#ff8000", "#00ff80"]; Additional Requirements Graph Size - should be based on the width / height props (e.g. "100px", you can assume the provided values will be strings with px suffix). Graph Padding - A padding of 5px (vertical and horizontal) should exist between the graph-area's border and the columns. Column Height - Columns should indicate their value by their height, have a minimum height of 5px and the highest column value should fill the graph's height. Column Width Each column should have 8px of spacing to the columns near it, and they should fill the available graph width, while having a minimum width of 15px. Data points can be assumed to fit in the graph width. Data Points - Each data point has a label which is a single capital letter, and an non-negative number, e.g. { label: "A", value: 42 }. Labels - Should only be displayed for the X axis (under the graph), and not for the Y axis. Coloring - Column colors should be cyclic - first color for the first column, second for the second, and so on, until there are no more colors, and then the same order should be used again.

Viewing 611 - 620 interview questions

See Interview Questions for Similar Jobs

Glassdoor has 2,005 interview questions and reports from Senior front end engineer interviews. Prepare for your interview. Get hired. Love your job.