Position: UI Engineer 1 at Flipkart
Location: Bangalore, India
I applied directly on the flipkart careers portal.
Couple of weeks later, was contacted by recruiter that I have been shortlisted for UI Engineer hiring drive.
The process had 4 rounds of interview:
Machine Coding (~120 mins)
UI tech (~60mins)
PS/DS Round (~60mins)
HM Round (~40mins)
1] Round 1 was Machine coding round where I was given 90 mins to code the problem statement and then had 30mins of discussion on the same with the interview.
I was given to implement Frontend of a chat application, similar to web[dot]whatsapp[dot]com
There were some mandatory features and some bonus features which were optional.
Had to build it using Vanilla JavaScript and plain CSS. No framework/library allowed.
I wrote the code using classes (OOJS) and tried to make reusable components.
I was given an api endpoint url which returned mock data required. Basically it was array of objects which had contact details as well as message list.
{
"id": 1,
"title": "title",
"imageURL": "someUrl",
"orderId": "OD123",
"messageList": [
{
"messageId": "msg1",
"message": "Hi",
"messageType": "text"
},
{
"messageId": "msg2",
"message": "need assistance",
"messageType": "text"
}
]
},
{
"id": 2,
"title": "title2",
"imageURL": "someUrl2",
"orderId": "OD1234",
"messageList": []
},
]
Using this data, had to build the following features
left view / panel- contains scrollable list of contacts with image, title, date etc
right view / panel - on click of any contact open a chat window which shows previous messages as well as input to send messages that need to be persisted (used localStorage)
left panel has a search box which can be used to search contact by id and title
styling according to design which was shared (was very similar to whatsapp web)
Bonus features:
feature to attach images , files, videos etc to the chat
There were some more features which I am unable to recall at the moment.
2] Round 2: UI Tech round
This was scheduled the next day and went on for 60mins of discussion around HTML/CSS, JavaScript and Web API related questions.
Some questions I recall:
Was given a task where I had to write HTML and CSS for a grid of images where in one row there are 3 images. I used flexbox for this task. Follow up questions like what if the image sizes are not same.
What happens when you hit a domain/website in your browser.
How the Web works (good article on this available on mdn)
JavaScript Fundamentals and tricky output based questions which indirectly covered topics like closures, hoisting, var scope vs let,const scope, IIFE, callback vs promises vs async await, how to handle dependent promise logic / promise chaining.
Implement Function.prototype.bind polyfill
Http Methods and when to use them (GET, PUT,PATCH,POST, DELETE,OPTIONS).
display none vs visibility hidden
box model
Event loop, and how setTimeout and Promises are queued.
3] Round 3 PS/DS round
This was scheduled couple of days after Round2. In this round focus was mainly on DSA and Problem Solving (Using JavaScript), Time/Space Complexity Analysis
Question 1: String manipulation question [LC - Easy/Medium]. Was asked a follow up question which was to basically add this function to the Function prototype chain.
Question 2: Flatten Array for example Input: [[1,2],[[3,4]],[5]] Output: [1,2,3,4,5]
Question 3: Don't quite remember the exact question but it was related to DOM tree traversal.
4] Round 4 Hiring Manager Round
This round was scheduled on the same day after Round 3. This round was more of a discussion on my past experience and role/team at flipkart. Interviewer deep dived into my past projects and how I solved certain challenges. This round was relatively short around 35-40 mins.
After 1 week got to know that I was selected :)
I received offer letter after a month.