Hi guys, I just finished my onsite with Amazon last Friday and got rejection on this Tuesday. The reason why I failed is because I was totally exhausted when I had my fourth round, so I sucked. Obviously, the fourth round killed me. I did ok on other rounds, but I think some of the questions are very tricky and worthy to think about. The frozen time to reapply is about 1 year.
This role is a very front-end focused role, with some data structure and algorithm questions and some react designs. I will share all my thoughts and code in this post. There were four rounds. The first round was with an Senior Mobile Engineer with Amazon who mainly develops in Swift, Java and C#.
Round 1
LP + BQ questions
Technical:
System design:
Design a class to model the management hierachy of Amazon. Say that you have Jeff Bezos as CEO, and he has some SVP reporting to him. Each SVP will have their own VP reporting to them. And your job is to design a class to model this architecture.
Basically, this is to model a N-nary tree, but each person will have their own list of employees. I tried using a map first, but it turned out that I overthought this problem. Finally we came out a class like this
class Employee {
String name;
List<String> reportees;
Employee(String name) {
this.name = name;
this.reportees = new ArrayList<>();
}
}Sounds very simple right? One tip for somebody wants to interview with Amazon is that their technical problem is not that hard and they will not trick you. You don't need to overthink a lot and use a lot of sophisticated data structure or algorithm that you learn from Leetcode.
After this, I was ask to find the first deepest, aka the employee with lowest rank. This is just a DFS problem to find the deepest node.
Round 2
Pure BQ + LP with hiring manager. Talked very deeply with my experience and resume. Asked a lot of BQ questions.
Round 3
BQ and LP with two senior front end engineer.
Then two design problems. The first one was simple, but I didn't have time for the second one and I just talked through at the end. We talked a lot of pros and cons with Angular, React and Vue, including Redux and its architecture.
P1. Design a UI with a button, when you clicked it, it will increment the text by one. The default value is 0.
This one is pretty easy, so I just share my design with you if you are interested with React.
import React, { useState } from "react";
const App = () => {
const [times, setTimes] = useState(0);
const onClick = () => {
setTimes(times + 1);
}
return (
<button onClick={onClick}>{times}</button>
)
}
export default App;P2. The second problems is enhanced version. The UI will add a new button, with default value of 0 to the bottom of the UI and you also need to update the clicked times. I don't know if there are more optimized way to do this, but what I think is to add an ID to each button and render a list of buttons.
Here is my code
import React, { useState, Fragment } from "react";
const App = () => {
const [clickedTimes, setClickedTimes] = useState([{id : 0, times: 0}])
const onClick = event => {
// First add a new button to the UI. I will add a new object to the end of the state array and then make a copy of the rest using ... operator
setClickedTimes([...clickedTimes, {id : clickedTimes.length, times : 0}]);
// Then update the clicked times by 1 based on ID and array index
let targetTimes = clickedTimes[event.target.id].times;
clickedTimes[event.target.times] = targetTimes + 1;
}
return <Fragment>
{clickedTimes.map((item, index) => {
return <button key={index}
id={item.id}
onClick={onClick}>
{item.times}
</button>
})}
</Fragment>
}I don't think this is an optimized way to do. Please comment if you have better idea. I will highly appreciate. It does work on my machine.
Round 4
LP + BQ with a Senior Front end Engineer
This round was disaster. Some of the questions were beyong my range and basically I failed. I will discuss some of the side questions first then discuss the coding.
P1. How would you make your website accessible to people with disabilities, specifically with blind people?
P2. How would you handle browser adapability problem? What is some of your animations and HTML elements are not supported by a outdated browser?
P3. How would you make your application adjust sizes of different browsing devices?
Coding:
You are given three headers with hidden text beneath it. When you click a header, the text will show, but text on other headers will hide. Accomplish this by Vanilla JS + HTML + CSS. This is how I did it.
HTML
<div>
<h3 onClick={onClick}>Header 1</h3>
<p>Dummy content</p>
</div>
<div>
<h3 onClick={onClick}>Header 2</h3>
<p>Dummy content</p>
</div>
<div>
<h3 onClick={onClick}>Header 3</h3>
<p>Dummy content</p>
</div>JavaScript
// first clear all <p> elements' css display property to none, then set the current target to display: block
const onClick = event => {
document.querySelectorAll("p").forEach(node => {
node.style.display = "none";
});
event.target.parentNode.querySelector("p").style.display = "block"
}I was SO SO SO SO stupid to think through this. I was extremely exhausted during the whole 4 hour interview. So I basically failed this.
Tips for you guys:
Good luck guys, and good luck to me as well. Leave a comment if you like and happy coding!