diff --git a/app/api/seed-experiences/route.ts b/app/api/seed-experiences/route.ts index 7355085..4258a1f 100644 --- a/app/api/seed-experiences/route.ts +++ b/app/api/seed-experiences/route.ts @@ -3,16 +3,17 @@ import { createClient } from '@supabase/supabase-js'; import seedData from '@/data/seed-experiences.json'; /** - * One-time seed endpoint to insert 49 scraped interview experiences. + * One-time seed endpoint to insert 29 fully complete interview experiences. + * Each entry has title, author, tags, summary, AND formatted_content (full article body). + * * Requires CRON_SECRET auth and SUPABASE_SERVICE_ROLE_KEY. * * Usage: POST /api/seed-experiences * Header: Authorization: Bearer * - * After running successfully, you can delete this route. + * After running successfully, delete this route + data/seed-experiences.json. */ export async function POST(request: Request) { - // Auth check const authHeader = request.headers.get('authorization'); if (authHeader !== `Bearer ${process.env.CRON_SECRET}`) { return NextResponse.json({ error: 'Unauthorized' }, { status: 401 }); @@ -30,28 +31,31 @@ export async function POST(request: Request) { .from('scraped_experiences') .upsert( { - title: exp.title, - original_url: exp.original_url, - source: exp.source, - author: exp.author, - published_at: exp.published_at || new Date().toISOString(), - tags: exp.tags || [], - summary: exp.summary || '', + title: (exp as any).title, + original_url: (exp as any).original_url, + source: (exp as any).source, + author: (exp as any).author, + published_at: (exp as any).published_at || new Date().toISOString(), + tags: (exp as any).tags || [], + summary: (exp as any).summary || '', + formatted_content: (exp as any).formatted_content || '', + slug: (exp as any).slug || '', metadata: {}, status: 'approved', + ai_processed: true, }, - { onConflict: 'original_url', ignoreDuplicates: true } + { onConflict: 'original_url', ignoreDuplicates: false } ); if (error) { - results.errors.push(`${exp.title}: ${error.message}`); + results.errors.push(`${(exp as any).title}: ${error.message}`); } else { results.inserted++; } } return NextResponse.json({ - message: `Seeded ${results.inserted} experiences (${results.errors.length} errors)`, + message: `Seeded ${results.inserted} complete experiences (${results.errors.length} errors)`, total_in_file: seedData.length, ...results, }); diff --git a/data/seed-experiences.json b/data/seed-experiences.json index b16e41c..44800e6 100644 --- a/data/seed-experiences.json +++ b/data/seed-experiences.json @@ -1,106 +1,4 @@ [ - { - "title": "Capgemini Frontend Developer Interview Experience (20 LPA) \u2014 JavaScript, React & Logic Questions", - "original_url": "https://medium.com/@mohnishdev/capgemini-frontend-developer-interview-experience-20-lpa-javascript-react-logic-questions-d628891082c1", - "source": "medium", - "author": "Mohnish Sharma", - "published_at": "2026-06-07T11:26:21+00:00", - "tags": [ - "react", - "frontend-interviews", - "javascipt", - "react-interview-question", - "capgemini" - ], - "summary": "", - "slug": "capgemini-frontend-developer-interview-experience-20-lpa-javascript-react-logic-", - "status": "approved" - }, - { - "title": "MakeMyTrip(MMT) Frontend Interview Experience (3+ years)", - "original_url": "https://medium.com/@kumariabhinisha1999/makemytrip-mmt-frontend-interview-experience-3-years-e6ddf2fe0dfd", - "source": "medium", - "author": "Abhinisha Kumari", - "published_at": "2026-06-04T11:23:53+00:00", - "tags": [ - "frontend-interviews", - "makemytrip", - "javascript", - "interview-experience", - "react" - ], - "summary": "", - "slug": "makemytripmmt-frontend-interview-experience-3-years", - "status": "approved" - }, - { - "title": "My First Interview in 3 Years \u2014 Senior Software Engineer (Frontend) at Headout", - "original_url": "https://medium.com/@yashpreetbathla/my-first-interview-in-3-years-senior-software-engineer-frontend-at-headout-4a6884ed4b07", - "source": "medium", - "author": "Yashpreet Bathla", - "published_at": "2026-05-25T19:40:54+00:00", - "tags": [ - "interview", - "front-end-development", - "frontend-interviews", - "interview-questions", - "headout" - ], - "summary": "", - "slug": "my-first-interview-in-3-years-senior-software-engineer-frontend-at-headout", - "status": "approved" - }, - { - "title": "Headout Frontend Interview \u2014 Real Questions, Machine Coding & System Thinking", - "original_url": "https://medium.com/@bhatia.vansh56/headout-frontend-interview-real-questions-machine-coding-system-thinking-c4e61b97ce18", - "source": "medium", - "author": "PB08", - "published_at": "2026-05-03T08:05:54+00:00", - "tags": [ - "software-development", - "software-engineering", - "frontend-interviews", - "frontend", - "job-interview" - ], - "summary": "", - "slug": "headout-frontend-interview-real-questions-machine-coding-system-thinking", - "status": "approved" - }, - { - "title": "Slice Frontend SDE-1 Interview Experience \u2014 DSA + Deep Frontend + System Design", - "original_url": "https://medium.com/@bhatia.vansh56/slice-frontend-sde-1-interview-experience-dsa-deep-frontend-system-design-2a17c1f124cf", - "source": "medium", - "author": "PB08", - "published_at": "2026-05-03T07:49:41+00:00", - "tags": [ - "software-engineering", - "software-development", - "job-interview-preparation", - "frontend-interviews", - "frontend-development" - ], - "summary": "", - "slug": "slice-frontend-sde-1-interview-experience-dsa-deep-frontend-system-design", - "status": "approved" - }, - { - "title": "Exprience Angular Interview Questions That Asked Me From TCS, Infosys & Capgemini", - "original_url": "https://medium.com/@onkar20/50-angular-interview-questions-that-banned-me-from-tcs-infosys-capgemini-until-i-fixed-these-7e2c11efcb1f", - "source": "medium", - "author": "Coder_Ninja", - "published_at": "2026-04-26T15:50:30+00:00", - "tags": [ - "js-interview-questions", - "anguler-interview-questio", - "frontend-interviews", - "html-interview-questions", - "css-interview-questions" - ], - "summary": "", - "slug": "exprience-angular-interview-questions-that-asked-me-from-tcs-infosys-capgemini", - "status": "approved" - }, { "title": "Goibibo Frontend Interview Experience | SSE-2", "original_url": "https://medium.com/frontend-army/goibibo-frontend-interview-experience-sse-2-a8573358bff4", @@ -114,9 +12,10 @@ "interview-experience", "reactjs" ], - "summary": "", + "summary": "June 7, 2026 Goibibo Frontend Interview Experience | SSE-2 Recently, I interviewed for an SSE-2 Frontend role at GoiBibo. The interview process was heavily focused on JavaScript fundamentals, React\u2026...", "slug": "goibibo-frontend-interview-experience-sse-2", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

June 7, 2026

Goibibo Frontend Interview Experience | SSE-2

Recently, I interviewed for an SSE-2 Frontend role at GoiBibo. The interview process was heavily focused on JavaScript fundamentals, React\u2026

\"\"

Gourav Hammad

3 min read

Recently, I interviewed for an SSE-2 Frontend role at GoiBibo. The interview process was heavily focused on JavaScript fundamentals, React machine coding, frontend low-level design, and debugging skills.

\n

What I found particularly interesting was that every round was practical and frontend-oriented. Instead of focusing only on DSA, the interviewers evaluated real-world engineering skills such as asynchronous programming, component design, state management, scalability, and debugging existing codebases.

\n

The process consisted of four rounds.

\n

Round 1: JavaScript & React Fundamentals

\n

This round focused on JavaScript concepts, asynchronous programming, and React development.

\n

Question 1: Flatten a Nested Array

\n

Given:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Input: [1, [2, 3], [4, [5, 6]]]\nOutput: [1, 2, 3, 4, 5, 6]
\n\t\t\t\t\t\t\t
Input: [1, [2, 3], [4, [5, 6]]]\nOutput: [1, 2, 3, 4, 5, 6]
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

The interviewer asked me to implement the solution:

\n
    \n
  • Using recursion
    • \n
  • Without using recursion
    • \n
\n

The discussion revolved around:

\n
    \n
  • Recursive traversal
    • \n
  • Stack-based approaches
    • \n
  • Time and space complexity
    • \n
  • Edge cases involving deeply nested arrays
    • \n
\n

Question 2: Implement promiseAllSync

\n

The interviewer provided a function that returned promises with different completion times and asked me to implement a custom function similar to Promise.all.

\n

Requirements:

\n
    \n
  • Execute promises sequentially
    • \n
  • Preserve output order
    • \n
  • Do not use async/await
    • \n
  • Use Promise chaining only
    • \n
\n

This question tested:

\n
    \n
  • Promise internals
    • \n
  • Chaining
    • \n
  • Async execution flow
    • \n
  • Error handling
    • \n
\n

Question 3: React Search Component

\n

Build a search component in React that:

\n
    \n
  • Calls an API while typing
    • \n
  • Shows matching products
    • \n
  • Starts searching only after 3 characters
    • \n
  • Displays results in a list
    • \n
\n

API:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
fetch(\"https://dummyjson.com/products/search?q=phone\")
\n\t\t\t\t\t\t\t
fetch(\"https://dummyjson.com/products/search?q=phone\")
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Topics discussed:

\n
    \n
  • Debouncing
    • \n
  • API optimization
    • \n
  • Loading states
    • \n
  • Error handling
    • \n
  • User experience considerations
    • \n
\n

Hey New Readers \ud83d\udc4b

\n

If you're new here, make sure to check out my Frontend Army publication, where I have published 50+ detailed Frontend interview experiences, Top ReactJS, JavaScript questions, and many more.

\n\n \n \n \"None\"\n\n

Great resource for anyone preparing for Frontend Engineer interviews \ud83d\ude80

\n

Round 2: Machine Coding / Frontend LLD

\n

This round focused on practical React development and frontend architecture.

\n

Question 1: Sequential Progress Bars

\n

Build a React application where:

\n
    \n
  • Clicking Add creates a new progress bar
    • \n
  • Each progress bar takes approximately 2 seconds to complete
    • \n
  • Only one progress bar can run at a time
    • \n
  • Multiple bars can be added while another is running
    • \n
  • Newly added bars should enter a queue
    • \n
  • Bars must execute sequentially
    • \n
\n

The interviewer was looking for:

\n
    \n
  • Queue management
    • \n
  • React state handling
    • \n
  • Timer management
    • \n
  • Side effects
    • \n
  • Clean component architecture
    • \n
\n

The challenge was not the UI itself but designing a robust queue system.

\n

Question 2: File Explorer

\n

Build a file explorer similar to VS Code.

\n

Requirements:

\n

Initial State

\n

Display a single button:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Create src
\n\t\t\t\t\t\t\t
Create src
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

When clicked:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
src
\n\t\t\t\t\t\t\t
src
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

should be created as the root folder.

\n

Folder Operations

\n

Each folder should support:

\n
    \n
  • Expand / collapse
    • \n
  • Add a new file
    • \n
  • Add a new folder
    • \n
\n

Nested Structure

\n

The structure should support unlimited nesting, such as:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
src\n \u251c\u2500\u2500 components\n \u2502    \u251c\u2500\u2500 Button.jsx\n \u2502    \u2514\u2500\u2500 Modal.jsx\n \u2514\u2500\u2500 pages\n      \u2514\u2500\u2500 Home.jsx
\n\t\t\t\t\t\t\t
src\n \u251c\u2500\u2500 components\n \u2502    \u251c\u2500\u2500 Button.jsx\n \u2502    \u2514\u2500\u2500 Modal.jsx\n \u2514\u2500\u2500 pages\n      \u2514\u2500\u2500 Home.jsx
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Selection

\n

Clicking a file should visually highlight it.

\n

This problem tested:

\n
    \n
  • Recursive rendering
    • \n
  • Tree data structures
    • \n
  • Component composition
    • \n
  • State management
    • \n
  • Frontend architecture
    • \n
\n

This was one of the most interesting frontend LLD questions I've seen.

\n

Round 3: Advanced JavaScript & Component Design

\n

Question 1: Dynamic Currying

\n

Implement:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const sum = generateSum(4);\nconsole.log(sum(1)(2)(3)(4)); // 10\n\nconst sum2 = generateSum(2);\nconsole.log(sum2(5)(2)); // 7
\n\t\t\t\t\t\t\t
const sum = generateSum(4);\nconsole.log(sum(1)(2)(3)(4)); // 10\n\nconst sum2 = generateSum(2);\nconsole.log(sum2(5)(2)); // 7
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

After implementing the solution, the interviewer extended the problem and asked me to:

\n
    \n
  • Rewrite it using bind
    • \n
  • Use call and apply
    • \n
  • Utilize this keyword
    • \n
\n

The discussion focused on:

\n
    \n
  • Closures
    • \n
  • Function currying
    • \n
  • Function binding
    • \n
  • Execution context
    • \n
  • Higher-order functions
    • \n
\n

Question 2: Pagination Component

\n

Build:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
<Pagination\n  currPage={1}\n  totalPage={10}\n  onPageClick={() => {}}\n/>
\n\t\t\t\t\t\t\t
<Pagination\n  currPage={1}\n  totalPage={10}\n  onPageClick={() => {}}\n/>
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Rules:

\n
    \n
  • Always show the first page
    • \n
  • Always show the last page
    • \n
  • Show current page
    • \n
  • Show current page \u2014 1
    • \n
  • Show current page + 1
    • \n
  • Show \"\u2026\" whenever pages are skipped
    • \n
\n

Examples:

\n

Current Page = 1

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
1 2 ... 10
\n\t\t\t\t\t\t\t
1 2 ... 10
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Current Page = 5

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
1 ... 4 5 6 ... 10
\n\t\t\t\t\t\t\t
1 ... 4 5 6 ... 10
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Current Page = 9

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
1 ... 8 9 10
\n\t\t\t\t\t\t\t
1 ... 8 9 10
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

The interviewer focused heavily on:

\n
    \n
  • Edge cases
    • \n
  • Reusable component design
    • \n
  • Rendering logic
    • \n
  • User experience
    • \n
\n

Round 4: Hiring Manager Round

\n

This round was very different from the previous rounds.

\n

Instead of writing new code, I was given an existing repository with multiple issues.

\n

Question 1: Debug and Optimize

\n

The interviewer shared a codebase and asked me to:

\n
    \n
  • Identify bugs
    • \n
  • Fix issues
    • \n
  • Improve performance
    • \n
  • Optimize rendering
    • \n
\n

I was able to solve the problem in approximately 20 minutes.

\n

However, the interviewer expected the issue to be identified and fixed within 5 minutes.

\n

During the discussion, it became clear that debugging speed was being evaluated as much as correctness.

\n

Question 2: Debug Logger Middleware

\n

As a follow-up, I was asked to implement a debugging logger middleware for the same application.

\n

I completed this task within about 5 minutes.

\n

However, the interviewer had already formed an opinion based on the first debugging exercise.

\n

The round ended shortly afterward.

\n

Final Verdict

\n

Rejected. No detailed feedback was provided.

\n

While preparing for interviews, I came across a platform called PracHub, where I found the questions and solutions really helpful. You should check it out, it's definitely worth exploring.

\n

Final Thoughts

\n

Overall, the Goibibo SSE-2 Frontend interview process was challenging but highly relevant to day-to-day frontend engineering.

\n

The interview focused on:

\n
    \n
  • JavaScript depth
    • \n
  • React architecture
    • \n
  • Machine coding
    • \n
  • Frontend low-level design
    • \n
  • Debugging and optimization
    • \n
\n

While the final outcome was a rejection, the interview itself was a valuable learning experience and highlighted the growing importance of practical frontend engineering skills beyond traditional coding questions.

" }, { "title": "Cult.fit Frontend Interview Experience | SDE-2", @@ -131,24 +30,10 @@ "javascript", "interview" ], - "summary": "", + "summary": "June 5, 2026 Cult.fit Frontend Interview Experience | SDE-2 I recently interviewed for an SDE-2 Frontend role at Cult.fit. While the technical rounds were positive and I received encouraging...", "slug": "cultfit-frontend-interview-experience-sde-2", - "status": "approved" - }, - { - "title": "Chargebee Software Engineer Interview Experience", - "original_url": "https://medium.com/@tahmeer/chargebee-software-engineer-interview-experience-7bba86436e3e", - "source": "medium", - "author": "Tahmeer Pasha", - "published_at": "2026-06-02T07:16:38+00:00", - "tags": [ - "interview-experience", - "software-engineering", - "careers" - ], - "summary": "", - "slug": "chargebee-software-engineer-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

June 5, 2026

Cult.fit Frontend Interview Experience | SDE-2

I recently interviewed for an SDE-2 Frontend role at Cult.fit. While the technical rounds were positive and I received encouraging feedback\u2026

\"\"

Gourav Hammad

2 min read

I recently interviewed for an SDE-2 Frontend role at Cult.fit. While the technical rounds were positive and I received encouraging feedback from interviewers, the overall process turned out to be one of the longest interview experiences I've had.

\n

I'm sharing this experience to help others understand what the process looked like and to discuss some questions around hiring timelines, role closures, and relocation-based decisions.

\n

Round 1: Frontend Technical Interview

\n

Interviewer: Senior Software Engineer

\n

The round started with a detailed discussion about the projects mentioned on my resume. The interviewer explored architectural decisions, frontend challenges, and my overall ownership in those projects.

\n

Topics covered included:

\n
    \n
  • JavaScript fundamentals
    • \n
  • Event Loop
    • \n
  • Async programming
    • \n
  • Execution order
    • \n
  • Promise-related concepts
    • \n
\n

I was also asked two JavaScript coding questions.

\n

The discussion was interactive and focused more on understanding my problem-solving approach rather than simply reaching the final answer.

\n

Hey New Readers \ud83d\udc4b

\n

If you're new here, make sure to check out my Frontend Army publication \u2014 a collection of 50+ detailed Frontend interview experiences covering JavaScript, ReactJS, Machine Coding, System Design, DSA, and real interview insights from top tech companies.

\n

Great resource for anyone preparing for Frontend Engineer interviews \ud83d\ude80

\n

Round 2: Machine Coding

\n

Interviewer: Engineering Lead

\n

The second round began with another deep dive into my previous projects.

\n

The machine coding task was:

\n

Build a Reusable Dropdown Component

\n

The implementation itself was only one part of the discussion. The interviewer spent significant time evaluating:

\n
    \n
  • Component design decisions
    • \n
  • Edge cases
    • \n
  • Accessibility considerations
    • \n
  • State management
    • \n
  • Performance optimizations
    • \n
  • Scalability of the component
    • \n
\n

The conversation felt very similar to discussions that happen during actual frontend development reviews.

\n

Overall, both technical rounds went extremely well.

\n

One interviewer specifically mentioned that my understanding of core JavaScript fundamentals was strong, which gave me confidence about the process.

\n

The Long HR Gap

\n

After completing the technical rounds, communication stopped for a significant period.

\n

I followed up multiple times and eventually learned that I had been reassigned to a different HR representative.

\n

The new HR informed me that the next step would be a Hiring Manager round, which was described as the final round before a Bar Raiser discussion.

\n

Unfortunately, that round was rescheduled twice due to the interviewer's availability and medical reasons.

\n

Hiring Manager Round

\n

When the Hiring Manager round finally happened, the discussion took an unexpected direction.

\n

Instead of focusing on frontend engineering, architecture, or technical depth, most of the conversation revolved around relocation and retention concerns.

\n

During the discussion, I learned that:

\n
    \n
  • The original position I had interviewed for had already been filled.
    • \n
  • I was being evaluated for a different team.
    • \n
  • That team had only one open position available.
    • \n
\n

Concerns Raised

\n

At the time:

\n
    \n
  • I was working in a hybrid setup with a Noida-based company.
    • \n
  • The Cult.fit role was also hybrid, but based in Bangalore.
    • \n
\n

The Hiring Manager expressed concerns that:

\n
    \n
  • I might not be comfortable relocating.
    • \n
  • I could potentially switch jobs again in the near future.
    • \n
  • The team might have to restart the hiring process.
    • \n
\n

I explained that my motivation for interviewing was:

\n
    \n
  • Working on systems operating at Cult.fit scale.
    • \n
  • Learning opportunities.
    • \n
  • Career growth.
    • \n
  • Exposure to high-scale frontend engineering challenges.
    • \n
\n

However, the discussion felt less like an evaluation of my technical capabilities and more like an attempt to assess whether I would remain with the team long-term.

\n

While preparing for interviews, I came across a platform called PracHub, where I found the questions and solutions really helpful. You should check it out, it's definitely worth exploring.

\n

Final Outcome

\n

Verdict: Rejected

\n

While no explicit feedback was provided, the overall impression was that the rejection was driven primarily by:

\n
    \n
  • Relocation concerns
    • \n
  • Retention assumptions
    • \n
\n

rather than technical performance.

" }, { "title": "Okta SDE-2 Frontend Interview Experience | SDE-2", @@ -163,9 +48,10 @@ "reactjs", "frontend" ], - "summary": "", + "summary": "June 2, 2026 Okta SDE-2 Frontend Interview Experience | SDE-2 The interview process was focused on three major areas: Gourav Hammad 3 min read Download article Contents 40 1 Interview Overview 2...", "slug": "okta-sde-2-frontend-interview-experience-sde-2", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

June 2, 2026

Okta SDE-2 Frontend Interview Experience | SDE-2

The interview process was focused on three major areas:

\"\"

Gourav Hammad

3 min read

    \n
  • ReactJS fundamentals and component design
    • \n
  • Core JavaScript concepts and browser internals
    • \n
  • Frontend System Design
    • \n
\n

What stood out to me was that the interviewers were less interested in whether I could simply build a working UI and more interested in understanding how deeply I understood JavaScript, React internals, performance optimization, and architectural trade-offs.

\n

Although I was ultimately rejected, the interview highlighted several areas that every Frontend Engineer preparing for SDE-2 roles should master.

\n

Interview Overview

\n

Company: Okta\nRole: Software Development Engineer 2 (Frontend)\nExperience Level: SDE-2\nInterview Mode: Online\nVerdict: Rejected

\n

Round 1: ReactJS & JavaScript Deep Dive

\n

The first round consisted of a React machine coding exercise followed by an extensive JavaScript discussion.

\n

React Machine Coding Problem

\n

Dynamic Grid with Incremental Values

\n

The interviewer provided a pre-configured React environment and asked me to build a dynamic grid application.

\n

Problem Statement

\n

The application should accept a number n from an input box and render an n \u00d7 n grid.

\n

Grid Behavior

\n

Initially:

\n
    \n
  • All cells are empty
    • \n
\n

When clicking an empty cell:

\n
    \n
  • Fill it with max(existingValues) + 1
    • \n
\n

When clicking an already filled cell:

\n
    \n
  • Update it with max(existingValues)
    • \n
\n

Example

\n

Initial State:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
_ _ _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t\t
_ _ _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Click the first cell:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
1 _ _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t\t
1 _ _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Click another empty cell:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
1 2 _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t\t
1 2 _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Click the first cell again:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
2 2 _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t\t
2 2 _\n_ _ _\n_ _ _
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

What The Interviewer Was Evaluating

\n

This question looked simple initially, but the real evaluation criteria were much deeper.

\n

React Fundamentals

\n
    \n
  • Component architecture
    • \n
  • State management
    • \n
  • Event handling
    • \n
  • Rendering logic
    • \n
\n

Performance Optimization

\n

The interviewer specifically discussed:

\n
    \n
  • Avoiding unnecessary re-renders
    • \n
  • Efficient computation of maximum values
    • \n
  • Derived state vs stored state
    • \n
  • React rendering behavior
    • \n
\n

Code Structure

\n

The interviewer expected:

\n
    \n
  • Modular components
    • \n
  • Clean separation of concerns
    • \n
  • Readable code
    • \n
  • Scalable implementation
    • \n
\n

One important lesson from this round was that interviewers often care more about design decisions and trade-offs than simply producing a working solution.

\n

JavaScript Deep Dive

\n

After the React exercise, the discussion shifted entirely toward JavaScript fundamentals.

\n

This section was significantly more challenging than the coding problem itself.

\n

Topics Covered

\n

Event Loop

\n

Questions included:

\n
    \n
  • How JavaScript executes code
    • \n
  • Call stack behavior
    • \n
  • Callback queue
    • \n
  • Event loop execution order
    • \n
\n

Microtasks vs Macrotasks

\n

Discussion around:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Promise.resolve().then(...)\nsetTimeout(...)
\n\t\t\t\t\t\t\t
Promise.resolve().then(...)\nsetTimeout(...)
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Questions focused on:

\n
    \n
  • Execution order
    • \n
  • Why Promises execute before timers
    • \n
  • How microtask queues are processed
    • \n
\n

Async vs Defer

\n

The interviewer asked:

\n
    \n
  • What happens when a browser encounters script tag
    • \n
  • Difference between async and defer
    • \n
  • Impact on page rendering
    • \n
\n

Async/Await vs Then/Catch

\n

Topics discussed:

\n
    \n
  • Internal working of async functions
    • \n
  • Promise wrapping
    • \n
  • Error propagation
    • \n
  • Readability vs implementation
    • \n
\n

Memory Management

\n

This was one of the areas where the discussion became deeper.

\n

Questions included:

\n
    \n
  • Garbage Collection
    • \n
  • Memory leaks
    • \n
  • Closures causing retained memory
    • \n
  • Detached DOM nodes
    • \n
  • Common memory issues in frontend applications
    • \n
\n

Debouncing & Throttling

\n

The interviewer wasn't interested in textbook definitions.

\n

Instead, they asked:

\n
    \n
  • Real-world use cases
    • \n
  • Search bars
    • \n
  • Infinite scrolling
    • \n
  • Resize handlers
    • \n
  • API optimization
    • \n
\n

Synchronous vs Asynchronous APIs

\n

Discussion included:

\n
    \n
  • Browser APIs
    • \n
  • Network requests
    • \n
  • Rendering behavior
    • \n
  • Thread blocking
    • \n
\n

Browser Internals

\n

The interviewer explored:

\n
    \n
  • What happens after an API call
    • \n
  • How browsers process asynchronous tasks
    • \n
  • Interaction between JavaScript runtime and browser APIs
    • \n
\n

Hey New Readers \ud83d\udc4b

\n

If you're new here, make sure to check out my Frontend Army publication, which is a collection of 55+ detailed Frontend interview experiences covering JavaScript, ReactJS, Machine Coding, System Design, DSA, and real interview insights from top tech companies.

\n

Great resource for anyone preparing for Frontend Engineer interviews \ud83d\ude80

\n

Round 2: Frontend System Design

\n

The second round focused on frontend architecture and scalability.

\n

Problem Statement

\n

Design a content publishing platform where:

\n

Admins

\n

Can:

\n
    \n
  • Create articles
    • \n
  • Publish articles
    • \n
  • Store content as Markdown files
    • \n
\n

Users

\n

Can:

\n
    \n
  • Browse articles
    • \n
  • Search content
    • \n
  • Read articles efficiently
    • \n
\n

The platform should be scalable and performant.

\n

Discussion Areas

\n

The interviewer intentionally kept the requirements broad and expected me to drive the discussion.

\n

Role-Based Access Control

\n

Different permissions for:

\n

Admins

\n
    \n
  • Create content
    • \n
  • Edit content
    • \n
  • Publish content
    • \n
\n

Readers

\n
    \n
  • Read-only access
    • \n
\n

Discussion involved:

\n
    \n
  • Authentication
    • \n
  • Authorization
    • \n
  • Access boundaries
    • \n
\n

Markdown Storage & Rendering

\n

The interviewer explored:

\n
    \n
  • Why Markdown was chosen
    • \n
  • Rendering approaches
    • \n
  • Security concerns
    • \n
  • Content processing strategies
    • \n
\n

Client-Side vs Server-Side Rendering

\n

We discussed trade-offs between:

\n

CSR

\n

Advantages:

\n
    \n
  • Faster interactions
    • \n
  • Simpler deployments
    • \n
\n

Challenges:

\n
    \n
  • SEO
    • \n
\n

SSR

\n

Advantages:

\n
    \n
  • Better SEO
    • \n
  • Faster initial content visibility
    • \n
\n

Challenges:

\n
    \n
  • Higher server cost
    • \n
\n

CDN Discussion

\n

An interesting discussion involved whether CDN usage is even necessary for Markdown-based content.

\n

Topics covered:

\n
    \n
  • Static asset delivery
    • \n
  • Edge caching
    • \n
  • Performance gains
    • \n
  • Cost considerations
    • \n
\n

SEO & Discoverability

\n

Questions included:

\n
    \n
  • How search engines discover articles
    • \n
  • Sitemap generation
    • \n
  • Indexing strategies
    • \n
  • Metadata handling
    • \n
\n

Feed Delivery & Pagination

\n

Discussion around:

\n
    \n
  • Infinite scroll
    • \n
  • Pagination
    • \n
  • Content fetching strategies
    • \n
  • Caching mechanisms
    • \n
\n

Capacity Estimation

\n

The interviewer also asked for rough estimates around:

\n
    \n
  • Daily article creation
    • \n
  • Average Markdown size
    • \n
  • Concurrent readers
    • \n
  • Traffic expectations
    • \n
\n

The goal wasn't perfect numbers.

\n

The goal was to understand how engineers reason about scale.

\n

Final Verdict

\n

Unfortunately, I was not selected for the next stage.

\n

Although the React implementation and system design discussion went reasonably well, the primary feedback was around JavaScript fundamentals.

\n

The interviewers were looking for deeper expertise in:

\n
    \n
  • Async execution
    • \n
  • Event Loop
    • \n
  • Promise internals
    • \n
  • Memory management
    • \n
  • Browser behavior
    • \n
\n

Final Thoughts

\n

The Okta SDE-2 Frontend interview process was a strong reminder that senior frontend engineering is much more than building React components.

\n

Modern frontend interviews increasingly focus on:

\n
    \n
  • JavaScript internals
    • \n
  • Browser behavior
    • \n
  • Performance engineering
    • \n
  • System Design
    • \n
  • Architectural thinking
    • \n
\n

If you're preparing for SDE-2 Frontend roles, invest significant time in mastering JavaScript fundamentals. In many cases, that knowledge becomes the deciding factor between clearing and missing the next round.

" }, { "title": "Harness Senior Software Engineer ( Frontend ) Interview Experience \u2014 All 8 Rounds, Questions", @@ -180,9 +66,10 @@ "interview-experience", "javascript" ], - "summary": "", + "summary": "May 31, 2026 Harness Senior Software Engineer ( Frontend ) Interview Experience \u2014 All 8 Rounds, Questions Yashpreet Bathla 10 min read Download article Contents 16 1 Harness Senior Frontend Engineer...", "slug": "harness-senior-software-engineer-frontend-interview-experience-all-8-rounds-ques", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

May 31, 2026

Harness Senior Software Engineer ( Frontend ) Interview Experience \u2014 All 8 Rounds, Questions

\"\"

Yashpreet Bathla

10 min read

Harness Senior Frontend Engineer Interview Experience \u2014 All 8 Rounds, Questions & a 3.5-Year Comeback

\n

My 8-round journey to becoming a Senior Software Engineer (Frontend) at Harness \u2014 and what it taught me about persistence, preparation, and people.

\n

Let me start with a memory

\n

3.5 years ago, I applied to Harness for the first time.

\n

I was excited. I thought I was ready. I went through the rounds, gave it my best, and got a polite \"thank you, but no.\"

\n

I remember sitting on my bed that evening, scrolling through my own resume, wondering what I did wrong.

\n

Was it the DSA? Was it the system design? Was it the way I explained my project? Was it just\u2026 me?

\n

I closed my laptop, told myself \"there'll be other companies,\" and moved on.

\n

But here's the thing about a \"no\" from a company you really admired \u2014 it doesn't fully leave you. It tucks itself into a small corner of your brain and waits there. Sometimes quietly. Sometimes loudly.

\n

And every time you see something cool come out of that company, that tiny voice goes:

\n
\n

\"Imagine if you had cracked it.\"

\n
\n

3.5 years later, I decided to give it another shot.

\n

Spoiler: it worked. \u2705

\n

But the journey to get there is the story I actually want to tell.

\n

A bit about me (and where I was coming from)

\n

If you've read my previous post about my Headout interview experience, you already know I had spent 3 years at Tessell before stepping back into the interview world.

\n

Headout was my comeback round \u2014 and even though I got rejected there, it was one of the most clarifying experiences of my career. It told me exactly where my gaps were:

\n
    \n
  • Frontend system design depth
    • \n
  • TypeScript fundamentals
    • \n
  • Speaking clearly under pressure
    • \n
\n

After Headout, I went back to the drawing board. Practiced harder. Built more. Read more. Solved more.

\n

And then\u2026 I applied to Harness.

\n

The same company that had said no 3.5 years ago.

\n

This time, I wasn't naive. I wasn't going in hoping things would go well. I was going in prepared \u2014 or at least, more prepared than the version of me from 2021.

\n

The call that started it all

\n

When the recruiter reached out, my first reaction was a strange mix of excitement and d\u00e9j\u00e0 vu.

\n

\"Wait. Harness? Again? Are we really doing this?\"

\n

But this time the energy was different. I was different.

\n

And what made the start of the process incredibly smooth was the recruitment team. Two recruiters. Both genuinely supportive. Both clear about timelines, expectations, and feedback at every step.

\n

If you've ever interviewed at a company where the recruiter ghosts you for 2 weeks between rounds, you'll understand why this mattered so much.

\n
\n

Harness made the process feel like a journey with you, not a hurdle course for you.

\n
\n

The interview pipeline turned out to be 8 rounds long. I won't lie \u2014 when I first heard that number, I gulped. But once I started, every round had a clear purpose. Nothing felt like filler.

\n

Let me walk you through each one \ud83d\udc47

\n

\ud83d\ude80 Pre-screen \u2014 The Recruiter Round

\n

This one was relatively chill compared to the Headout recruiter round. Background, motivations, why Harness, some quick discussion on previous work.

\n

Nothing felt grilling, but I could tell they were paying close attention to why I wanted to be at Harness specifically.

\n

Lesson learned from Headout: I came prepared with a real, well-thought-out answer for \"why this company.\" No fluff. No LinkedIn-bio phrases.

\n

It went well. Onwards.

\n

\ud83e\uddd1\u200d\ud83d\udcbc Round 1 \u2014 Engineering Manager

\n

This round was about me. Not in a shallow way \u2014 in a genuinely curious way.

\n

The EM asked:

\n
    \n
  • About my work and most impactful contributions
    • \n
  • Times when I was stuck on something \u2014 what was my strategy?
    • \n
  • What I'm looking forward to in a new company and team
    • \n
\n

There were no trick questions. No \"tell me about a time you failed and what you learned and why we should still hire you despite that failure\" gotchas.

\n

It was honest. He asked, I answered, we discussed.

\n
\n

The best technical leaders ask questions that aren't trying to trip you up \u2014 they're trying to understand how you think.

\n
\n

This round set the tone. I walked away feeling like I'd just had a great coffee conversation, except it was a job interview and I was sweating slightly.

\n

\ud83d\udcbb Round 2 \u2014 DSA + JavaScript

\n

Three coding problems. Let's break them down.

\n

Q1: Pattern matching

\n

Given a pattern like \"abcd\" and a string like \"axxxbbxxxccxd\", check if the characters of the pattern appear in the string in the same order (not necessarily contiguous).

\n

The trick was to track positions in a hashmap and walk through the string while validating order.

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
function patternMatching(pattern, str) {\n  const hashMap = new Map();\n  for (let i = 0; i < pattern.length; i++) {\n    hashMap.set(pattern[i], i);\n  }\n  let lastIndex = -1;\n  for (let ch of str) {\n    if (!hashMap.has(ch)) continue;\n    const idx = hashMap.get(ch);\n    if (idx < lastIndex) return false;\n    lastIndex = idx;\n  }\n  return true;\n}jav
\n\t\t\t\t\t\t\t
function patternMatching(pattern, str) {\n  const hashMap = new Map();\n  for (let i = 0; i < pattern.length; i++) {\n    hashMap.set(pattern[i], i);\n  }\n  let lastIndex = -1;\n  for (let ch of str) {\n    if (!hashMap.has(ch)) continue;\n    const idx = hashMap.get(ch);\n    if (idx < lastIndex) return false;\n    lastIndex = idx;\n  }\n  return true;\n}jav
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Given a number, find the next palindrome that's strictly greater than it.

\n

Sounds simple. Edge cases are not. (Looking at you, numbers like 999 and 12921.)

\n

Q2: Next palindrome

\n

Given a number, find the next palindrome that's strictly greater than it.

\n

Sounds simple. Edge cases are not. (Looking at you, numbers like 999 and 12921.)

\n

Q3: Chainable calc function

\n

Implement a calc function such that:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
calc(8).sum(3).mul(3).val(); // 33
\n\t\t\t\t\t\t\t
calc(8).sum(3).mul(3).val(); // 33
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

A classic test of closures and method chaining. The kind of question that looks easy until you start typing.

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
function calc(num) {\n  let value = num;\n  return {\n    sum(n) { value += n; return this; },\n    mul(n) { value *= n; return this; },\n    val() { return value; }\n  };\n}
\n\t\t\t\t\t\t\t
function calc(num) {\n  let value = num;\n  return {\n    sum(n) { value += n; return this; },\n    mul(n) { value *= n; return this; },\n    val() { return value; }\n  };\n}
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

This round was a vibe check on both algorithmic thinking and JS fluency. I enjoyed it.

\n

\ud83e\uddee Round 3 \u2014 DSA Deep Dive

\n

One problem, but they wanted depth:

\n
\n

Given an array, split it into two parts such that the absolute difference between their sums is minimum. Return both parts.

\n
\n

For example, [2, 3, 4, 1] \u2192 split at index 1 \u2192 [2, 3] and [4, 1] \u2192 both sums are 5 \u2192 diff is 0.

\n

The classic prefix-sum + comparison approach. But the discussion went into:

\n
    \n
  • How would you handle very large arrays?
    • \n
  • What if elements could be negative?
    • \n
  • What's the time vs space tradeoff?
    • \n
\n

It wasn't just \"solve it.\" It was \"solve it, and then defend it.\"

\n

\ud83d\udd25 Round 4 \u2014 Machine Coding + JS Follow-up

\n

Now we're entering the gauntlet.

\n

The machine coding problem:

\n

Build an n x n matrix memory pattern game. In vanilla JS and plain CSS. No frameworks. No libraries.

\n

The requirements:

\n
    \n
  1. Random blocks light up in a specific pattern
    2. \n
  2. After the pattern is shown, the user has 10 seconds to click the same blocks in the same order
    3. \n
  3. After 10 seconds (or when the user finishes), reveal correctness \u2014 green for right, red for wrong
    4. \n
  4. Bonus: animate the order of clicks at the end
    5. \n
\n

I want to be honest here. This was one of the hardest machine coding rounds I've ever attempted.

\n

The complexity isn't in any single piece. It's in juggling all of them together:

\n
    \n
  • Random pattern generation
    • \n
  • Timer logic
    • \n
  • Capturing user clicks in order
    • \n
  • Comparing user input vs the original pattern
    • \n
  • Visual feedback with state management
    • \n
  • Animation for the final reveal
    • \n
\n

All without a framework's state management to lean on.

\n

What saved me was a YouTube video I'd watched a while back \u2014 Yomesh Gupta's Uber machine coding session on a similar pattern game. I had practiced something close to it in React once. I hadn't done it in vanilla JS, but at least I knew the shape of the problem.

\n
\n

Preparation isn't just about solving 100 questions. Sometimes it's about having seen the kind of problem before.

\n
\n

I got through most of it. Not perfectly, but enough.

\n

The JS follow-up:

\n

Implement an async recursive function to find all files in a file system that match a regex pattern.

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
async function findFilesWithPattern(fs, pattern, currentPath = \"\") {\n  const fullPath = `${currentPath}/${fs.name}`;\n  if (fs.type === \"file\") {\n      return pattern.test(fs.name) ? [fullPath] : [];\n    }\n    const results = await Promise.all(\n      fs.children.map(child => findFilesWithPattern(child, pattern, fullPath))\n    );\n    return results.flat();\n }
\n\t\t\t\t\t\t\t
async function findFilesWithPattern(fs, pattern, currentPath = \"\") {\n  const fullPath = `${currentPath}/${fs.name}`;\n  if (fs.type === \"file\") {\n      return pattern.test(fs.name) ? [fullPath] : [];\n    }\n    const results = await Promise.all(\n      fs.children.map(child => findFilesWithPattern(child, pattern, fullPath))\n    );\n    return results.flat();\n }
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Recursion + async + Promise.all + flat. A nice little appetizer after the main course.

\n

\u269b\ufe0f Round 5 \u2014 React + Project Deep Dive + DSA

\n

This round felt like three rounds compressed into one.

\n
    \n
  • React concept deep dive (rendering patterns, state management, when to lift state, when to colocate)
    • \n
  • Project deep dive \u2014 actual technical depth in things I'd built
    • \n
  • Some frontend system design discussions
    • \n
  • And then, just for fun, a gas station DSA problem (the classic \"find the starting index for a circular route\" question)
    • \n
\n

By the end of this round, my brain felt like it had run a half-marathon. And I still had three more rounds to go.

\n

After this round, they invited me for an in-person F2F interview.

\n

I'd never had an in-person interview before. Ever. This was going to be interesting.

\n

\ud83d\udda5\ufe0f Round 6 \u2014 F2F Machine Coding (In-Office)

\n

I walked into the office. Two interviewers. One conference room. A giant TV. My laptop screen projected on it for everyone to see.

\n

If you've never done in-person whiteboarding or coding while two people watch your screen on a 65-inch display, let me tell you \u2014 every typo feels like a felony.

\n

The task:

\n
\n

Build a GitHub Pull Request page in React, as close to the real one as you can. Search, listing, status pills, comments, the whole thing.

\n
\n

But before writing a single line of code, I had to discuss:

\n
    \n
  • How would I structure the data?
    • \n
  • How would I fetch it?
    • \n
  • What's the component breakdown?
    • \n
  • Where are the common components?
    • \n
  • What state lives where?
    • \n
\n

I started by sketching the UI structure on a notepad, explaining my thinking out loud, and then began building.

\n

It went well. Not perfect \u2014 I had to make tradeoffs on what to ship vs. what to discuss. But I felt aligned with the interviewers throughout.

\n

Then came the BFS/DFS whiteboard question:

\n
\n

Given an HTML node, delete all its siblings but not itself. Walk us through your approach, edge cases, and a dry run.

\n
\n

It was my first ever in-person whiteboarding session. Marker in hand. Two engineers watching. No IDE to autocomplete me out of mistakes.

\n

We discussed approaches \u2014 DFS vs BFS \u2014 edge cases (what if no parent? what if no siblings?), and I dry-ran my pseudo code on the whiteboard.

\n
\n

Whiteboarding is genuinely different from typing on a screen. You can't backspace. You can't just hit \"format.\" You have to think before you write.

\n
\n

By the end of this round, I was mentally fried but oddly proud of myself. I had survived my first F2F.

\n

\ud83e\udd1d Round 7 \u2014 Head of Engineering (India)

\n

This was a more relaxed conversation. Career journey. Experience. Work culture. What I valued in a workplace.

\n

No technical grilling. Pure culture-fit.

\n

He was warm, curious, and asked thoughtful questions about my journey at Tessell, what I learned, what I'd repeat, what I'd avoid.

\n

Sometimes the most important interviews are the ones that look the least intense on paper.

\n

\ud83c\udfaf Round 8 \u2014 Director of Engineering

\n

And then came the final boss.

\n

This was a combined HLD + culture-fit round, and honestly? It became one of the most memorable conversations of my entire interview journey.

\n

He started with a curveball:

\n
\n

\"The GitHub PR page you built earlier today \u2014 if you were to build it again right now, would you change anything? If yes, what? If no, why?\"

\n
\n

I sat with the question for a second.

\n

Then I walked him through what I'd reconsider with hindsight \u2014 data layer choices, component boundaries, caching strategies, things I hadn't optimized for. We went deep on it. He challenged. I defended. He pushed. I refined.

\n

It wasn't combative. It was collaborative. The kind of design discussion you'd have with a senior engineer on your team, not an interviewer.

\n

And then, near the end, he shared his own story.

\n

How he started as a frontend engineer years ago. How he moved to fullstack. How that journey eventually led him to becoming the Director of Engineering at Harness. The teams they were building. The product vision. The kind of work I might join.

\n
\n

He had 100% transparency about everything. What teams were doing. What problems they were solving. What I might enjoy. What might not be a great fit. I left that call genuinely inspired.

\n
\n

And it was at this exact moment that something clicked for me.

\n

This is why Harness has such great engineers. This is why their engineering culture is so strong.

\n

It's not just about the questions they ask or the bar they set. It's about the people who run those interviews \u2014 the depth of conversation, the quality of their thinking, the way they treat candidates with respect and honesty even before any offer is on the table.

\n

The culture you experience as a candidate is usually a reflection of the culture you'll get as an employee.

\n

And Harness? Their interview process was their culture, on display.

\n

Kudos to them. Truly. \ud83d\ude4c

\n

The verdict

\n

A few days later, the offer came through.

\n

I read it. Then I read it again. Then I read it one more time just to be sure.

\n

And then I sat back, took a long breath, and let it sink in.

\n
\n

The same company that had said no 3.5 years ago had said yes. The kid who closed his laptop and told himself \"there'll be other companies\" \u2014 he was now sitting on an offer from that very company.

\n
\n

I'd be lying if I said I didn't get a little emotional.

\n

It wasn't just about the offer. It was about everything the 3.5-year gap had taught me. The hours of practice. The failed interviews. The Headout rejection that gave me a roadmap. The countless YouTube videos. The vanilla JS practice sessions. The TypeScript deep dives.

\n

It all came together.

\n

My biggest learnings from this journey \ud83d\udcda

\n

1. A \"no\" is not the end. It's a redirection.

\n

The 3.5-year-old rejection didn't break my career. It shaped it. If I'd gotten in back then, I'd never have built the depth I have now.

\n

2. Preparation compounds.

\n

Every machine coding session, every DSA problem, every system design discussion you do \u2014 they're deposits in a bank. You don't see the balance growing. Until one day, the balance is exactly what you need.

\n

3. Watch real-world machine coding videos.

\n

Yomesh Gupta's content on Uber-style machine coding rounds genuinely helped me. Seeing how experienced engineers approach these problems is different from solving LeetCode.

\n

4. In-person interviews are a different sport.

\n

If you're early in your career and have only done remote interviews, simulate an in-person one. Practice whiteboarding with a friend. Talk through your code out loud. It changes everything.

\n

5. The interviewer's tone tells you about the company's culture.

\n

If your interviewer is curious, kind, transparent, and thoughtful \u2014 chances are, that's what working there is like. Pay attention.

\n

6. Persistence isn't loud. It's quiet.

\n

It's not \"never giving up\" in some movie-trailer way. It's just showing up again, slightly better than the last time. And then again. And again.

\n

Closing thoughts

\n

To the Harness team \u2014 thank you. From both recruiters who held my hand through the process, to every engineer, manager, and leader who interviewed me. This was a long journey, but every single round felt thoughtful, well-designed, and respectful.

\n

Going through this process, I finally understood why Harness has the engineering reputation it does. Their bar isn't just high \u2014 it's high in a way that's meaningful. The conversations are real. The transparency is real. The respect for candidates is real.

\n

And to anyone reading this who has a rejection from a dream company sitting in their inbox right now \u2014

\n
\n

Don't let that \"no\" be your last word. Let it be your first chapter.

\n
\n

The next version of you might just walk in and crack it.

\n

I did.

\n

And honestly? It was worth every minute of the wait. \ud83d\ude80

\n

If this helped you in any way, or if you're prepping for a similar journey \u2014 feel free to reach out. Always happy to chat about interviews, comebacks, or the strange feeling of getting an offer from a company that once said no. \u2728

\n

Liked this? A few claps \ud83d\udc4f would mean a lot. Follow for more honest interview write-ups \u2014 DevRev, Adobe, Confluent and more coming soon.

" }, { "title": "Frontend Interview Experience in Flipkart (UI 2)", @@ -195,9 +82,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "April 21, 2025 Frontend Interview Experience in Flipkart (UI 2) Introduction Abhishek Agarwal 2 min read Download article Contents 7 1 Round 1: Machine Coding (Vanilla JS \u2014 Live Coding) 2 Round 2 :...", "slug": "2-frontend-interview-experience-in-flipkart-ui-2", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

April 21, 2025

Frontend Interview Experience in Flipkart (UI 2)

Introduction

\"\"

Abhishek Agarwal

2 min read

Recently, I had the opportunity to go through the interview process at Flipkart for the position of UI Engineer 2 (Senior Frontend Developer). The experience was a rollercoaster \u2014 combining hands-on coding, architectural deep dives, and in-depth system knowledge. This article is a breakdown of all the rounds, my learnings, and key takeaways. All the rounds were taken by 2 panel members.

\n

Round 1: Machine Coding (Vanilla JS \u2014 Live Coding)

\n

This round was conducted on a live video call with around 30 candidates. All the candidates were given the same problem statement to build a eCommerce platform within 2 hours. Requirement consisted of making Category and Products List, Cards, Render Tabs, multiple wish list along with proper CSS.

\n

Round 2 : Machine Coding Review + Technical Concepts

\n

This round started with code review of the complete code in previous round. I was asked to explain each line of code and there were a lot of questions about how I approached a certain part of the code. Talked about Functional and Class Based approach. Discussed Performance Optimisations based on structure, logic and DOM manipulations. Asked to create a function for debounce. Discussed Pagination and Infinite Scrolling as well as Virtualisation. Also discussed on CSR vs SSR, React vs Next and in depth discussion on React Hooks, Diffing Algorithms working.

\n

Round 3 : UI Technical Concepts

\n
    \n
  1. An API is given which is unstable which either resolves 10ms or 1sec. Need to create a Circuit Breaker which will wait for 300ms and if API is resolved within the timeframe we return the data otherwise we throw an error or retry.
    2. \n
  2. Polyfill for Reduce Method.
    3. \n
  3. Discussion on CSRF Token and other Security Vulnerabilities
    4. \n
  4. Discussion on Cookies and Auth Tokens
    5. \n
  5. Garbage Collection and Weak Map in JavaScript.
    6. \n
  6. Hoisting & Closures in depth discussion.
    7. \n
  7. Discussion on Performance -> Web Vitals, RequestIdleCallback, Prefetch, Preconnect, Preload, Tree Shaking, Dynamic Chunking, Breaking Long Tasks.
    8. \n
\n

Round 4 : Data Structures and Algorithms

\n

Question 1 : Merge Intervals Variation\nQuestion 2 : Character Array Compression (aabb -> a2b2)

\n

Round 5 : Hiring Manager Round

\n

This was a deep introspection round focusing on soft skills, leadership, product thinking, and long-term vision.

\n
    \n
  1. UI Library -> Why I built it, use cases, where I hosted it, public vs private npm packages, handle secrets / credentials in public packages.
    2. \n
  2. Design a reusable and scalable input field.
    3. \n
  3. Metrics to track for a good UI Library.
    4. \n
  4. How will you create a Login System -> Complete Journey from Product Requirement to Production. How will the discussion begin, how will architecture be decided, how will I handle changes, make sure its scalable. How will API's flow across the system.
    5. \n
  5. Server-side event storm handling: Short Polling, WebSockets, Throttling
    6. \n
  6. Web Vitals Discussion -> CLS, LCP, INP, TBT
    7. \n
  7. How will you handle Error Logging, what metrics to look for.
    8. \n
  8. Personal goals: Why Flipkart, my 5-year plan, and daily agile routines, 2 things you like/dislike about current organisation.
    9. \n
\n

Round 6 : Debugging and Problem Solving in React

\n

Was given a component fetching a list from an API with bugs. Had to identify and resolve those bugs. Then on the fly requirements were given and I was also expected to move forward with requirements in a Product Sense.

\n
    \n
  1. Added Pagination and made it scalable for filtering and sorting.
    2. \n
  2. Implemented Virtualisation
    3. \n
  3. Added Debounce
    4. \n
  4. Added useMemo and useCallbacks
    5. \n
  5. Added Abort Controllers
    6. \n
  6. Added Filtering and reduced re-renders
    7. \n
  7. Discussed on Infinite Scrolling and Virtualisation
    8. \n
  8. Added Timeouts and Intervals with Pause and Resume functionality for API, also added debounce on API.
    9. \n
  9. How does the Web Works from DNS hit to Rendering. This was expected to be an extremely in depth discussion.
    10. \n
  10. How Diffing Algorithm internally works.
    11. \n
  11. Async | Defer and how different script types affect script load order.
    12. \n
  12. Multiple scripts with different timings and async defer flags were given. I was expected to tell the order of execution of those scripts.
    13. \n
\n

Verdict: Selected

\n

Final Thoughts

\n

The process was extremely rigorous, challenging, and rewarding. Flipkart's interview journey truly tests every facet of Frontend Engineering \u2014 from deep JavaScript fundamentals and web security to authentication flows, real-world feature building, and thinking about architecture in a reusable, scalable way. It's not just about writing code \u2014 it's about building for scale, performance, and great user experience.

" }, { "title": "My Flipkart UI-2 Frontend Interview Experience: 2025", @@ -210,24 +98,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "August 17, 2025 My Flipkart UI-2 Frontend Interview Experience: 2025 Hey folks! \ud83d\udc4b Welcome to my second vlog. If you\u2019re prepping for frontend interviews \u2014 especially ones centred on JavaScript and...", "slug": "5-my-flipkart-ui-2-frontend-interview-experience-2025", - "status": "approved" - }, - { - "title": "Preparing for My Amazon Front End Engineer Interview", - "original_url": "https://spencerlepine.medium.com/preparing-for-my-amazon-front-end-engineer-interview-321e8894abf3", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:42:36.952226", - "tags": [ - "Amazon", - "frontend", - "interview" - ], - "summary": "", - "slug": "1-preparing-for-my-amazon-front-end-engineer-interview", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

August 17, 2025

My Flipkart UI-2 Frontend Interview Experience: 2025

Hey folks! \ud83d\udc4b\nWelcome to my second vlog. If you\u2019re prepping for frontend interviews\u200a\u2014\u200aespecially ones centred on JavaScript and React \u2014\u2026

\"\"

Karuna Kumari

2 min read

Hey folks! \ud83d\udc4b\nWelcome to my second blog. If you're prepping for frontend interviews \u2014 especially ones centred on JavaScript and React \u2014 this story is for you.

\n

Let's dive into my experience with the Flipkart UI-2 interview process: a rollercoaster ride of coding, design, and product thinking that truly stretched my skills.

\n

Application: Where It All Began

\n

I stumbled onto the opportunity via a LinkedIn post from a Flipkart recruiter. Filling out their Google Form felt like the usual \"let's-see-what-happens\" move.\nA week went by \u2014 then boom, an email arrived: Invitation for the Machine Coding Round!

\n

Round 1: Machine Coding Challenge

\n
    \n
  • Format: Google Meet, 90 minutes(don't remember the exact time)
    • \n
  • Task: Build an app from scratch. Only vanilla JavaScript, HTML, and CSS \u2014 no frameworks, no libraries.
    • \n
\n

I attended a briefing session where the rules and expectations were clearly explained. Once we received the problem statement, it was time to get to work. The main focus was on delivering fully functional features \u2014 make sure the app runs smoothly, then zip your files and submit them through the provided form.

\n

Pro Tip: Focus on a functional app first, polish second. Clean, modular code is your friend.

\n

Round 2: Code Review

\n

Got a call for the code review round later that same day, where Flipkart engineers walked me through my solution: they asked me to explain my implementation, discussed JavaScript fundamentals, and requested demos for any optional features I had skipped.

\n

A double test of your technical logic and your ability to communicate it.

\n

Round 3: Data Structures & Algorithms

\n

Two problems, classic interview fare:

\n
    \n
  • LRU Cache (Least Recently Used mechanism)
    • \n
  • House Robber (Dynamic Programming problem)
    • \n
\n

It's not just about solving \u2014 it's about clean code, handling edge cases, and optimising.

\n

Round 4: UI-Tech

\n

This was a deep dive into real-world front-end skills:

\n
    \n
  • JS questions covering Promises, event loop behaviour, and console logs output-based questions
    • \n
  • Write a polyfill for Array.prototype.reduce
    • \n
  • Implement a UI scenario in plain JS (still no frameworks!)
    • \n
  • Switch to React: explain & live-code a Higher-Order Component
    • \n
\n

Truly a mix of theory and hands-on skills.

\n

Round 5: Product Sense \u2014 Hiring Manager

\n

Here, the challenge was to design an internal tool for a flight management dashboard.\nIt wasn't just about what to build, but why and how \u2014 thinking about user needs and translating that to features.

\n

This process was intense, humbling, and packed with learning. If you're aiming for similar roles, here's what helped me:

\n
    \n
  • Master the basics of vanilla JS
    • \n
  • Code under time pressure
    • \n
  • Keep your solutions modular and clear
    • \n
  • Communicate your ideas confidently
    • \n
\n

Thanks for joining me on this journey! If you found this helpful, clap, share, and follow for more interview stories and tips.\nSee you in the next post \u2014 keep crushing those interviews! \ud83d\ude80

" }, { "title": "Software Engineer 2 UI Interview at Microsoft", @@ -240,9 +114,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Hello there, For those who don't know me, do check out my website and my other blogs . I recently accepted Microsoft's offer for Software Engineer II at IDC, Bangalore. I realized a blog about this...", "slug": "3-software-engineer-2-ui-interview-at-microsoft", - "status": "approved" + "status": "approved", + "formatted_content": "

Hello there,

\n\n

For those who don't know me, do check out my website and my other blogs.

\n\n

I recently accepted Microsoft's offer for Software Engineer II at IDC, Bangalore. I realized a blog about this might help a few :)

\n\n

\n\n

In this post, I'll take you through my preparation, strategies, interview rounds, and things to look out for in each round. This will be in a Q&A format.

\n\n

Disclaimer:
\nThe following incidents are completely based on my view and what I have observed from my experience and it might vary from one individual to the other.

\n\n

\n \n \n Firstly, why do I have to write this in a blog?\n

\n\n\n\n

\n \n \n How did I apply?\n

\n\n

I had my profile listed in Instahyre, a famous job search portal in India, with the Actively looking for opportunities option enabled. One evening, I got a call from a person (working in a third-party headhunting firm on behalf of Microsoft) asking if I am interested in the role. And it began...

\n\n

\n \n \n How did I Prepare?\n

\n\n

I was attending a few other interviews prior to the above interview call. So when I got the call I was almost in a good position to attend the interview. As it was for the Frontend Engineer role I brushed up on JS basics, Web Performances, my current projects, and Leetcode. I did about 240+ Leetcode Questions by the time I gave the Interview. (It might just be 0 for someone :P). I highly advise anyone attending FE interview at Microsoft or any top MNCs(Amazon, Google,...) and many other top Startups(Rubrik, Flipkart,...) to have enough knowledge on Data Structures and Algorithm. There is no escaping from DS & Algo as it is considered heavily to rate your problem-solving skills. Attaching my leetcode profile here for reference. Feel free to follow.

\n\n

\n \n \n Resources for Frontend?\n

\n\n\n\n

\n \n \n Do I get to know which team I am being hired before giving the interview?\n

\n\n

If you are part of a massive Interview Drive, you will have to wait until you meet your potential Hiring Manager(sometimes even the one taking your Managerial Round won't be your actual HM). However, you might get to know the product in which you will be working on before the interview(Azure, Office365, etc).

\n\n

\n \n \n How do I know which Level I am being hired for?\n

\n\n

From what I have observed and read about, Microsoft does not assign you a Level based on your years of experience. I have seen a lot of posts in blind, leetcode, etc where 8YOE are given L61 and 4YOE are given L62. So, it all boils down to how well you performed in your interview.

\n\n

\n \n \n Okay enough, tell me about the rounds already!\n

\n\n

Due to COVID-19, all interviews happened virtually through Microsoft Teams.

\n\n

\n \n \n Round 1 (Machine Coding): (2 hours)\n

\n\n

As a Frontend Engineer, I was expected to start with a machine coding round where I was given a problem statement which I have to complete in 2 hours. If you have any doubts regarding the problem you can ask the interviewer. You might be given a zip containing initial boilerplate.

\n\n

Example Questions:

\n\n
\n
\n\n - Design an Email Client like MS Outlook.\n - Create a chat interface like MS teams.\n - Create a Notification interface like MS teams.\n\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n

Things to look out for:

\n\n\n\n

\n \n \n Round 2 (Javascript): (1 hour)\n

\n\n

Here I was evaluated on my Javascript knowledge.

\n\n

For the first 10 minutes, from the code that I wrote earlier in my machine coding round, I was asked to discuss the following:

\n\n\n\n

Review your code and prepare for these questions before you enter the next round.

\n\n

After this, it was full-on javascript questions, where I was asked to write a polyfill for some js APIs introduced in ES6 or ES2020. For me, it was to write a Promise polyfill.

\n\n

Adding to the above question I was asked to implement the following.

\n\n
\n
\n\nPromise based memoization with a given cache size behaving\nas an LRU cache with an expiry time and auto cache burst\n\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n

Here I was grilled on my JS knowledge on async, promises, higher-order components, etc.

\n\n

\n \n \n Round 3 (Design / HLD + LLD /): (1 hour)\n

\n\n

In this round I was asked to design a ChessBoard, as I don't know how to play chess\ud83d\ude05\ud83d\ude05, I told the interviewer and he modified the question to,

\n\n
\n
\n\nDesign Snakes and ladders game\n\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n

I was asked to write the Classes and methods involved in each one of them. Not expected to run it in the console. It happened over the VS code editor.

\n\n

Expectations on this round were:

\n\n\n\n

\n \n \n Round 4 (PSDS) : (1 hour)\n

\n\n

This is a problem-solving round. To evaluate my Problem-solving skills and how quickly am I able to achieve an optimized solution.

\n\n

Here I was asked 2 questions:

\n\n\n\n
\n
\n\nconst input =\u201chellooooloo\u201d;\nconst op = getRepeated(input);\nconsole.log(op) // [(2,3), (4,7), (9,10)]\n\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n
\n
\n\nconst dictionary = {\n    'hellolo': true\n};\nconst input = \u201chellooooloo\u201d;\nconst op = canBeFormed(input);\nconsole.log(op) // true,\n// because by deleting the repeated characters of `o` we can form `hellolo` which is present in the dictionary\n\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n

\n \n \n Round 5 (Hiring Manager): (typically 45 mins - 1 hour)\n

\n\n

I was asked questions on multiple fronts like Javascript, performances, and Problem-solving. It was like a combination of all the above rounds.

\n\n\n
\n
\n\n\nconst dict = {\n hi: true\n hello: true,\n world: true\n};\n\nconst str = spaceSeparator('helloworld'); // \"hello world\"\nconst str2 = spaceSeparator('helloworldhi'); // \"hello world hi\"\nconst str2 = spaceSeparator('helloworldh'); // \"\" , as h is not present in dict we throw \"\" as output\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n

The code I wrote here for the problem was asked to run on the browser console after completion, to verify its correctness.

\n\n

\n \n \n Round 6 (As Appropriate): (1 hour)\n

\n\n

This is the final round and it is important to get a hire in this round too. It is not a gimmick, as I have read posts where people got rejected in this round.

\n\n

Here I interacted with an Interviewer who was at a GM/Partner level in Microsoft. This round could be as simple as knowing about your interests and your past project to Complex Data structures. And for me its the latter :P

\n\n

It started slowly with an introduction and my background and landed on a data structure question. I was asked to write the following program.

\n\n

This was an interesting problem and I encountered this for the first time in this interview.

\n\n
\n
\n\nConsider you are getting millions of tweets per second,\nyou have to alert whenever a particular word is repeated \nbillion times in any 1 hour time frame (moving window)\n\n\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

\n \n \n What Next?\n

\n\n

Now you wait!!!

\n\n

Microsoft has a lot of applicants for each role, so before they confirm that you are selected they do make sure they have evaluated other candidates who might be a better fit. So, you will have to wait for them to come back.

\n\n

It took me 2 weeks to know that I was selected. And releasing the offer took another week. And you will have 5 days to accept the offer.

\n\n

Overall I would say the entire journey was smooth and I'll be part of MicrosoftTeams Development. An enterprise chat application used by millions of people.

\n\n

So excited!!!! Wish me luck!!!\ud83e\udd29 \ud83e\udd73

\n\n

\n\n

Don't forget to follow me!\ud83d\ude04

\n\n

If you have more questions add it over the comments section I'll try giving the input if I know the answers\ud83d\ude1b

\n\n

My Website, blogs, and Twitter

\n\n

That's all Folks!!!

\n\n" }, { "title": "Swiggy SDE II Frontend Interview Experience", @@ -255,9 +130,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Swiggy Interview Experience July 31, 2025 Swiggy SDE II Frontend Interview Experience In my job switch journey, I was targeting product-based firms. In that context, I got the opportunity to...", "slug": "3-swiggy-sde-ii-frontend-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post
Swiggy Interview Experience

July 31, 2025

Swiggy SDE II Frontend Interview Experience

In my job switch\u00a0journey, I was targeting product-based firms. In that context, I got the opportunity to interview for companies like\u2026

\"\"

Kartik Joshi

3 min read

In my job switch\u00a0journey, I was targeting product-based firms. In that context, I got the opportunity to interview for companies like Synchrony, Wayfair, Nike, Expedia, etc, and I got an opportunity for Swiggy for an SDE II Frontend role. This blog will explain the interview process, questions, and how I got this opportunity. Let's begin.

\n

If you don't have a medium membership here is the free access to blog

\n

Application Process

\n

I applied through the company's official career portal, and I got shortlisted for the initial OA(Online Assessment) through the HackerRank portal.

\n

I was preparing through platforms like LeetCode, great frontend, etc so I was confident that I would solve OA questions when it comes questions there were one js question and few mcq and one react question and js question was on polyfill of promise.race which I already did solved while praticing and react question was fixing the performance bug and implementing the search and sorting for the items I did implemented the solution improving the performance through memoization and handling sorting.

\n

I completed the other MCQ. I was confident that I would get selected for the next round, and that is what happened. I got a call from HR that you were selected for the next round, which would be around DSA, Web Fundamentals, and JS questions.

\n

First Technical Round

\n

It was handled by a third-party company interviewer who grilled me on JS and React questions about every topic, like types of rendering, React-Router, Redux, TypeScript, and live coding.

\n

The question was to hit an api that would return IDs of the users, which includes the actual data that we need to render. Along with that, I was asked to implement show more button to load the remaining users. It was a time-bound question; I implemented it in 30 minutes with some minor bugs.

\n

It was one of the challenging rounds that I faced the I was not expecting the next round interview selection, but surprisingly, I got a next round invite.

\n

Question Link

\n

Second Round(Machine Coding with System Design)

\n

This Round was taken by a Swiggy Employee. I was prepared well before the interview interviewer asked all the common react questions like

\n
    \n
  1. How does React work?
    2. \n
  2. What is hydration?
    3. \n
  3. What is the virtual dom?
    4. \n
  4. What are the benefits of fiber?
    5. \n
  5. How to avoid rerendering in context API usage?
    6. \n
  6. What are the advantages of client-side rendering, server-side rendering when to use which one?
    7. \n
  7. How to handle side effects?
    8. \n
  8. What are the biggest misunderstandings about useEffect?
    9. \n
  9. What is BFF? How does it help in large-scale applications?
    10. \n
  10. What are the common Design Patterns Used In React?
    11. \n
  11. What are the common performance optimization techniques used in React?
    12. \n
\n

A small task to hit the API and render the result. Overall, this round went well. I was confident with the results. After a two-day gap, I got an update that I had been selected for the next round

\n

Third Round(Hiring Manager Round)

\n

In this round, I was aware that coding questions would be fewer compared to other rounds, it would be more of a conversation/discussion round, and it was like that only. Initially, I was asked about the previous projects' architecture and the software engineering cycle. After that, the interviewer targeted specific sections like security, performance monitoring, bug identification and Fixing (RCAs), accessibility, testing, devops pipeline, best coding practices, and answered pretty good.

\n

At last interviewer asked about how you would build a typeahead search feature how you would make sure that the particular component would be extensible. I answered that I will keep configurable props like noOfresults and debounceDelay, and label,onSearchHandler,className, etc, but I got fumbled on cross questions like.

\n
    \n
  1. How would I improve performance apart from debouncing?
    2. \n
  2. What Questions will you ask before development?
    3. \n
  3. How would you make sure that every UI element is flexible when it comes main component?
    4. \n
\n

The interviewer is expecting cache handling and compound pattern usage for UI flexibility between parent and child components, more better requirement gathering.

\n

I missed out on these, but overall, this was one of the rounds where I realized the importance of communication with forward thinking, and how to mentally think about a feature from PRD(Product Requirements Document) to feature delivery, and how important the feature ownership is when it comes to consumer-facing applications. Overall feedback was good from the interviewer

\n

Because of the good feedback from the interviewer, I was expecting a positive result, but after one day, I got an update that I got rejected at the final round, which did affect me badly once again life proved me that expectation hurts I was expecting some conclusive bullet point feedback so that I can improve on my self sadly I just got a formal mail and I asked feedback from the hiring manager but no reply that hurt even more

\n

It took one day to overcome this. Later, I decided to solve more Questions and implement them at a production scale. Final tips,

\n
    \n
  • Becurios never learn at the surface level, deep dive into internals
    • \n
  • Practice communicating a technical concept with a story
    • \n
  • Practice Questions with timer
    • \n
  • Don't stick to a particular area, have knowledge on other areas like backend,devops, be a software engineer, not a React Engineer.
    • \n
  • Grab Domain Knowledge like Swiggy operates in food delivery and quick commerce, so companies will expect candidates to know how the business works. Having domain knowledge will let you think better from a cost angle, which can help in critical technical choices and discussions.
    • \n
  • Lastly, don't lose hope, be more optimistic, leverage AI, learn, and build more.
    • \n
\n

That's it, hope my interview experience helps someone in their job hunt/switch journey. I will share more interview experience in the future

" }, { "title": "My FrontEnd Interview Experience At Razorpay", @@ -270,24 +146,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Hey Folks! I hope you are doing great. As you know from the announcements that I've recently joined Razorpay as a FrontEnd Engineer. So this is a writeup about my interview experience at razorpay and...", "slug": "1-my-frontend-interview-experience-at-razorpay", - "status": "approved" - }, - { - "title": "Razorpay Frontend Engineer interview experience", - "original_url": "https://plxity.hashnode.dev/razorpay-frontend-engineer-interview-experience", - "source": "hashnode", - "author": "Web Author", - "published_at": "2026-06-09T03:42:40.828912", - "tags": [ - "Razorpay", - "frontend", - "interview" - ], - "summary": "", - "slug": "3-razorpay-frontend-engineer-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "

Hey Folks! I hope you are doing great.

\n\n

As you know from the announcements that I've recently joined Razorpay as a FrontEnd Engineer.

\n\n

So this is a writeup about my interview experience at razorpay and how I
\ncleared the interview and got the offer!

\n\n

After over 1k LinkedIn likes & 600 twitter hearts, and 50+ DMs about
\n\"what is the interview process at razorpay?\" I'm finally writing this.

\n\n

\n\n\n

\n\n

Let's get started. First thing first I've got a lot of questions in one week and the most frequent one is:

\n\n

\n \n \n \"How did you get this opportunity?\"\n

\n\n

Simple one liner answer to this question would be
\n\"I built my personal brand, showcased my skills publicly and connected with friends in the community who work at razorpay\"

\n\n

My story of getting the opportunity is bit interesting, so there was a twitter post from the Razorpay engineering handle and I posted a meme as a reply to that post,

\nThen Kamlesh DM'd asking if I was ready to explore the opportunity, even though that tweet was totally a joke from my side and I had no plans to join razorpay atm \ud83d\ude02, I still took the opportunity and moved forward with the interviews. (And boi I'm glad I did)

\n\n

https://twitter.com/anuraghazru/status/1413166291821600770

\n\n

\"image\"

\n\n

And there goes my sweet \ud83e\udd70 twitter friends creating \"HIRE ANURAG CAMPAIGNS\".

\nThank you Sid, Vish, Saurabh it was very wholesome :)

\n\n

\"image\"

\n\n\n
\n\n

Now the interesting story out of the way, let's talk about the interview experience.
\nSo there was a lot of queries about the interview process at razorpay from folks.

\n\n

So the first thing which I really liked about the interview process is that you will immediately be given a \"Interview Preparation Guide - FE Engineer\" document which will have everything you need to know about the whole process,
\nI cannot say enough how useful that document was.

\n\n

It had information about the Razorpay's Philosophy, the interview rounds and what to expect from the each round and evaluation criteria for each round, also few handy interview tips.

\n\n

First I had a catch-up call with Kamlesh it wasn't part of the interview but just to give me a general idea of what I'm going into we decided to have a call and Kamlesh discussed with me about the structure and the business model and what they are doing at Razorpay, It was a great insight and after that I decided to move forward with the real interviews.

\n\n

First I got a call from the recruiter about the schedule and you will get daily reminders before each interview from the recruiter.
\nAnd after clearing every round you will get call from the recruiter for the next one.

\n\n

He scheduled the first interview.

\n\n

Let's start with the rounds then. In total there was 4 interview rounds:

\n\n
    \n
  1. Round 1 (1 Hour) Technical Deep Dive
    2. \n
  2. Round 2 (1.5 Hour) Coding Round
    3. \n
  3. Round 3 (1 Hour) Web Fundamentals
    4. \n
  4. Round 4 (1 Hour) Hiring Manager Round
    5. \n
\n\n

\n \n \n Round 1 (1 Hour) Technical Deep Dive\n

\n\n

This round heavily focuses on discussions about your own projects (any project) and your work experience.

\n\n

I was asked about my work experience at timelessco and what projects I worked on, we talked a lot about the design system & component library I was building at timeless.

\n\n

It was like a discussion about the project on how it works, what challenges I faced building it, what things I liked about the projects.

\n\n

We also talked about my open source projects, we talked about github-readme-stats and BugVilla.

\n\n

Interviwer asked me \"What are the challenges you faced building BugVilla\"

\n\n

I answered, and discussed about how I had to rewrite the whole redux state management code to add optimistic updates and to fix the laggy behaviour because of wrongly structured state of the application.

\n\n

it was a pretty chilling experience and discussion.

\n\n

\n \n \n Tips to clear this round:\n

\n\n\n\n

\n \n \n Round 2 (1.5 Hour) Coding Round\n

\n\n

This round is a typical coding round it will be on codesandbox.io and you can choose any framework/language to solve the given problem.

\n\n

Unlike other companies where you will be given to revert a binary tree, at razorpay you will only get real-world problems to solve. Which is :chefkiss:

\n\n

For me this round was more like \"pair-programming\" than \"coding-test\",

\nInterviewer will not just sit around watch you type code, interviewer will also give you hints, tips and discuss the problem with you.

\n\n

My question statement was a medium difficulty task, it was carefully created to test your understanding of basic to advanced concepts in FrontEnd development.

\n\n

Although it was pretty straightforward (spoiler, but I messed it up) I started explaining what I will do and took some time to plan my approach.

\n\n

After that I started implementing one of the core part of the logic where I kinda mess things up, I decided to go with a typical old school approach to the problem but not to mention It did not worked very well, it was kinda broken and I could not deliver the whole thing, but I wasn't too afraid or nervous because it was a fun learning experience for me.

\n\n

After finishing the half-baked demo my interviewer asked \"Anurag, how else can you solve this problem?\"

\n\n

Just after hearing that question my mind blowed and I got the idea which I totally missed.

\n\n

I proposed my solution but since we did not had time I could not implement it.

\n\n

Now you might say \"Woooww Anurag you totally messed this up!\"

\nYes I did, but the cool thing about this interview is that they aren't looking for solid solutions from you, they just want to test out your thought process and approach to solving the problem by thinking it in logical way.

\n\n

Even though I could not deliver the solution I was able to come up with the solution and approached the problem in a logical manner.

\n\n

\n \n \n Tips to clear this round:\n

\n\n\n\n

\n \n \n Round 3 (1 Hour) Web Fundamentals\n

\n\n

This is also a discussion based round where you will be asked various open-ended questions like \"How to build X feature\", \"How X works in Y\"

\n\n

I just loved this session!! It was like two engineers discussing on how something works. You won't believe how much I learned from this one interview, it was very insightful and learned a lot.

\n\n

I got asked about 4 or 5 questions all of which were interconnected to one another.

\n\n

First question was pretty straight forward and I had experience with it so I explained it pretty well.

\n\n

Then the second question was bit more tricky, there was a few more interconnected questions about web fundamentals and how the web works.

\n\n

It was a such a information packed session that I felt knowledgeable after leaving that interview session. \ud83e\udd2f

\n\n

\n \n \n Tips to clear this round:\n

\n\n\n\n

\n \n \n Round 4 (1 Hour) Hiring Manager Round\n

\n\n

This round was also a discussion based one, but it was more like a culture fitment round, there was lots of small questions about my own work experience in my previous firm, the teams, how we worked and my day to day work at timeless.

\n\n

This round mostly focuses on my:

\n\n\n\n

There were specific questions like

\n\n\n\n

There were also behavioural questions

\n\n\n\n

Interviewer will also explain to you about how the work happens and various things about razorpay.
\nThis is the best chance to clear up any org specific questions if you have.

\n\n

\n \n \n Tips to clear this round:\n

\n\n\n\n\n
\n\n

And that's it folks! Thanks for reading all the way through.

\n\n

My interview experience at razorpay was super smooth and I felt like I could give another 5 rounds without any issue. It was relaxing and a fun learning experience.

\n\n

\n \n \n In Conclusion\n

\n\n

You will not be the only person learning from the interview, It is a both side interview.

\n\n

If interviewer asks you 10 questions, you should also ask 10 questions. Do reverse interview!

\n\n\n\n

I hope this writeup will help you pass your next interview at Razorpay (hope to see you soon in the team)

\n\n

I would like to thank you the wonderful onboarding and interview team at razorpay and especially Kamlesh, he guided me through the whole process and even gave me personal guidance on career.

\n\n

Finally also like to thank you timeless.co for being so nice and respecting my decision.

\n\n

Thanks! Bye!

\n\n" }, { "title": "Uber SDE 2 Frontend Interview Experience", @@ -300,9 +162,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "November 18, 2022 Uber SDE 2 Frontend Interview Experience Hey Folks, Jasir K 3 min read Download article Contents 7 1 Round 1 : Online Assessment(35 mins) 2 Round 2: DSA Coding round(1 hr) 3 Round...", "slug": "1-uber-sde-2-frontend-interview-experience-by-jasir-k-medium", - "status": "approved" + "status": "approved", + "formatted_content": "

November 18, 2022

Uber SDE 2 Frontend Interview Experience

Hey Folks,

\"\"

Jasir K

3 min read

I had the privilege to attend interview with Uber for the role of Software Engineer II \u2014 Frontend.\nI believe with this sharing of experience , I could help someone land their dream job at Uber.

\n

SHARING IS CARING\ud83d\ude01\ud83d\ude01

\n

Interview Experience

\n

There were a total of 5 rounds with Uber.

\n

1. Online Assessment.\n2. Data Structures and Algorithm Problem solving.\n3. Tech specialisation coding.\n4. System design and Architecture.\n5. Leadership and Collaboration.

\n

Note: I will try to give a glimpse on level of questions , not the exact question due to NDA

\n

Round 1 : Online Assessment(35 mins)

\n

This was a 35 mins codesignal test.\nThere were 2 coding questions on DSA and 8 MCQ's based on frontend stuffs.

\n

Coding questions lies difficulty from Easy to medium in the test.

\n

Coding Questions 1\nFairly easy question to just play with digits in the number which could come under the Math category.\n20/20 test cases were passed.

\n

Coding Question 2

\n

Medium Level string question based on Hashmap and Sliding window.\nVery similar to the one below.

\n

https://leetcode.com/problems/longest-substring-without-repeating-characters/

\n

18/20 test cases passed. Couple of them had TLE.

\n

Rest of the questions were MCQ mostly output based. Easy to crack with decent amount of JS and CSS knowledge.

\n

I got the call from recruiter after a day that I have cleared the rounds.\ud83d\ude0d\ud83d\ude0d

\n

I asked sometime to prepare for the upcoming rounds. Next two were completely live coding.\nOne advantage is Uber takes cumulative score of two rounds to confirm for the upcoming rounds.

\n

Round 2: DSA Coding round(1 hr)

\n

I confirmed with the interviewer on number of questions planned so that I can plan time myself. Luckily there was just one planned, but can extend if I solve it quick. Gave 45 mins to solve.

\n

Most part of the process I took time to understand the question because the question was lil vague. I really appreciate the interviewer who helped in understanding very little things.

\n

Question was medium \u2014 hard level.\nOn a glimpse the questions goes something like this\nGiven positions and max velocities of different objects, we have to find the min time at which they can meet.

\n

It was more of Math, Binary Search and Overlapping intervals questions.

\n

Luckily with the first go I was able to recognise the pattern and come with optimal solution.

\n

You just have to pass few test cases.

\n

The interviewer is more focused into the problem solving ability, thought process , very modular and neat code.

\n

Round 3: Tech Specialisation Round(1 hr)

\n

This was more of machine coding round with vanilla JS.\nIt was of medium level difficulty.

\n

Mostly related to DOM Manipulations and Asynchronous programming.

\n

Question goes something like this Sequential Unbind/Bind Click.

\n

The interviewer tests your skills on writing modular and functional JS code, DOM Manipulation skills, ES6 concepts and problem solving.

\n

There were follow up questions on how to improve on perfomance and how would you change the code given a different scenario.

\n

I was confident with the two rounds.

\n

After around 3\u20134 days recruiter called me that It was positive response and can move forward.\nI asked a week time to prepare for system design which was fairly new to me.

\n

Round 4: System design and Architecture(1 hr)

\n

Question: Design Collaborative Calendar Application.

\n

Requirements were given by the interviewer. I had a fair preparation for the round.\nIt was a codesignal whiteboard round, where I had to discuss on

\n
    \n
  1. API design.
    2. \n
  2. Component Architecture.
    3. \n
  3. Tech choices.
    4. \n
  4. Perfomance Optimisations.
    5. \n
\n

Thus round is very ambiguous as there are no right or wrong answers. Our decisions comes from past experiences or blogs that you have read. It was a healthy conversation with the interviewer where we discussed on different approaches and tradeoffs of each.

\n

The interviewer looks for the thought process on what goes in your mind when designing a large scale application and speak out as much as you can.

\n

I was little worried about System design round as I was stuck on few things, but was able to end well, when the discussions were on perfomance optimisations.

\n

Round 5: Leadership and Collaboration (1 hr)

\n

This is one of my favourite round. This round focus on carrying Uber's values.\nInterviewer asks for situations where you have been able to apply those values.

\n

Recruiter gave me a fair idea on the type of questions that could be asked.

\n
    \n
  1. Challenging Project.
    2. \n
  2. Conflict resolutions with team.
    3. \n
  3. Leadership skills
    4. \n
\n

were amongst few of them.

\n

Then the wait started for that call from Recruiter.

\n

Results

\n

One fine evening. Ring ring ring ring.

\n

Recruiter called to inform the panel were happy with the interviews and I have been offered for the role.\nOne of the most memorable day.

\n

Interview preparations

\n

DSA Problem solving :

\n\n

Frontend problem solving:

\n\n

System Design

\n\n

Javascript:

\n\n

Mock Interviews:

\n\n

Little motivation\ud83d\ude01\ud83d\ude01:

\n
\n

I have failed miserably in a lot of interviews before I attempted Uber. Every interview is an experience to understand our strength and weakness.

\n
\n

All the best.

" }, { "title": "\ud83d\ude80 My Uber Frontend Interview Experience | 65 LPA | Software Engineer II", @@ -315,9 +178,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Company Logo May 15, 2025 \ud83d\ude80 My Uber Frontend Interview Experience | 65 LPA | Software Engineer II Welcome to my third frontend interview experience in this ongoing series! This time, I\u2019m sharing one...", "slug": "5-my-uber-frontend-interview-experience-65-lpa-software-engineer-ii", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post
Company Logo

May 15, 2025

\ud83d\ude80 My Uber Frontend Interview Experience | 65 LPA | Software Engineer II

Welcome to my third frontend interview experience in this ongoing series! This time, I\u2019m sharing one of the most organized and respectful\u2026

\"\"

Gourav Hammad

3 min read

Welcome to my third frontend interview experience in this ongoing series! This time, I'm sharing one of the most organized and respectful hiring journeys I've encountered \u2014 my interview process with Uber.

\n

From machine coding to behavioral rounds, every discussion was thoughtful and skill-oriented. Here's a detailed breakdown of what happened in each round \ud83d\udc47

\n

\ud83e\uddea Round 1: Online Screening Test (CodeSignal)

\n

This was a typical online assessment conducted on the CodeSignal platform.

\n

\ud83d\udd39 2 Coding Questions\n\ud83d\udd39 8 Multiple-Choice Questions (MCQs) focused on JavaScript, DOM, and Frontend fundamentals.

\n
\n

\ud83d\udca1 Tip: Practice competitive programming-style problems and brush up on frontend MCQs around browser internals, JS quirks, and basic debugging.

\n
\n

\ud83d\udcbb Round 2: Machine Coding Interview

\n

1\ufe0f\u20e3 Project Discussion

\n

The interviewer began with an in-depth discussion about my past project experience, specifically:

\n
    \n
  • \u26a1 Performance optimizations I implemented
    • \n
  • \ud83e\uddf1 Real-world challenges I faced and how I solved them
    • \n
\n

2\ufe0f\u20e3 Machine Coding Problem: Grid Light Box

\n

Problem Statement: Build a Grid Light Box component. The user should be able to navigate through a set of images, zoom, close the modal, handle edge cases like boundary navigation, and keyboard support.

\n
\n

_\ud83d\udca1 _Key Expectations:

\n
\n
    \n
  • Modular code using React or Vanilla JS
    • \n
  • Keyboard accessibility
    • \n
  • Mobile responsiveness
    • \n
  • Smooth transitions and proper state management
    • \n
\n
\n

\ud83d\udd27 JavaScript Note: Always debounce user interactions when building lightboxes, especially if using key listeners.

\n
\n

\ud83e\udde0 Round 3: Depth in Specialization Interview

\n

This was more focused on problem-solving and optimization.

\n

\u2728 Task: Memoize an Asynchronous Function

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
async function getUserData(q, key, cb) {\n  fetch(`localhost:3000/get/users?query=${q}&key=${key}`)\n    .then(res => HTTPResponse(res, cb));\n}\nlet memoFun = memoizeUserData(getUserData);\nmemoFun('test', 100, callback);
\n\t\t\t\t\t\t\t
async function getUserData(q, key, cb) {\n  fetch(`localhost:3000/get/users?query=${q}&key=${key}`)\n    .then(res => HTTPResponse(res, cb));\n}\nlet memoFun = memoizeUserData(getUserData);\nmemoFun('test', 100, callback);
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Follow-Up Questions:

\n
    \n
  • How would you handle JSON input as a key?
    • \n
  • If two JSON inputs have the same keys but different order, should it cache or not?
    • \n
  • What happens if four identical calls are made in parallel?
    • \n
\n
\n

\ud83d\udca1 JS Interview Note: Memoizing async functions requires careful handling of concurrent calls \u2014 avoid race conditions and redundant network hits.

\n
\n
\n

\ud83d\udd01 Consider using a Map as a cache and a serialize function to generate consistent cache keys for unordered JSON.

\n
\n

\ud83e\udd1d Round 4: Collaboration & Leadership Interview

\n

This round tested my ability to work cross-functionally and lead in a team setup.

\n

\ud83e\uddd1\u200d\ud83d\udcbc Behavioral Questions:

\n
    \n
  • How do you deal with disagreements with PMs or Designers?
    • \n
  • Why Uber? What excites you about the role?
    • \n
  • What changes or improvements would you suggest for Uber's current frontend?
    • \n
\n
\n

\ud83d\udcac Advice: Use STAR format (Situation, Task, Action, Result) for each answer. Reflect empathy, initiative, and ownership in your responses.

\n
\n

\ud83d\udcca Round 5: Data Structures & Algorithms (DSA)

\n

Problem: Zombie Infection Spread

\n

Matrix Representation:

\n
    \n
  • 2 \u2192 Infected city
    • \n
  • 1 \u2192 Vulnerable city
    • \n
  • 0 \u2192 Uninhabitable land
    • \n
\n

Goal: Find how many days it takes to infect all vulnerable cities using BFS.

\n

\ud83e\uddea Sample Input:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
2 1 1\n1 1 0\n0 1 1
\n\t\t\t\t\t\t\t
2 1 1\n1 1 0\n0 1 1
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Expected Output: 3 days

\n
\n

\ud83d\udca1 DSA Insight: This is a classic multi-source BFS grid traversal. Practice such grid problems frequently \u2014 they're highly favored in top tech interviews.

\n
\n

\ud83c\udfd7\ufe0f Round 6: System Design Interview

\n

High-Level Design: WhatsApp Web

\n
    \n
  • Walkthrough of the WhatsApp Web UI screenshot
    • \n
  • Discussion around:
    • \n
  • API design (chat messages, real-time updates)
    • \n
  • WebSocket vs Polling
    • \n
  • Payload structure
    • \n
  • Caching strategies
    • \n
  • Pagination and handling offline messages
    • \n
  • Scaling to millions of users
    • \n
\n
\n

\ud83d\udca1 Frontend System Design Tip: Focus not only on backend scalability but also on render performance, lazy loading, and optimized re-renders at the frontend.

\n
\n

\ud83e\uddfe Verdict

\n

The first two rounds were elimination rounds. Post that, I had to attend all remaining rounds regardless of performance.

\n

After all rounds, there was a panel debrief, where each interviewer gave their feedback.

\n

Unfortunately, I didn't make it through.

\n
\n

_\ud83d\ude43 Why?\nI nailed all rounds except DSA \u2014 because _DSA apne buss ki nahi hai.

\n
\n

But honestly, I'm still super happy about the experience.

\n
\n

At Uber, I never felt alone. Everyone \u2014 from coordinators to interviewers \u2014 was extremely helpful, friendly, and transparent throughout._ \ud83e\udd1d_

\n
\n

\ud83c\udfaf Final Thoughts

\n

The Uber Frontend Interview process is intense but incredibly rewarding. Each round pushed me to grow, reflect, and learn more about system design, performance, and real-world engineering problems.

\n

\ud83d\udcc2 Proof of Authenticity & Real Experiences

\n

\ud83d\udca1 Key Takeaways

\n

\u2705 Practice machine coding problems with real-world edge cases\n\u2705 Learn how to memoize async functions properly\n\u2705 Don't ignore behavioral rounds \u2014 communication is key\n\u2705 Know your fundamentals \u2014 caching, pagination, lazy loading, etc.\n\u2705 BFS/DFS/grid traversal DSA questions are still king \ud83d\udc51

\n

Looking for more frontend interviews?

\n

If you are looking for more frontend interviews, you can check out my profile, and there are 28+ interview experiences already shared till now. You can check them as well.

\n

\u26a0\ufe0f Disclaimer: The views and opinions shared in this post are solely my own and based on past experiences. They do not reflect the views of my current organization in any way.

\n

\ud83c\udf41 Follow Me for More!

\n

I am a Senior Frontend Engineer with 5+ years of experience, and I share interview experiences, frontend insights, technical blogs, and tech career tips.

\n

\ud83d\udcbc LinkedIn: Gourav Hammad (25K+ followers)\n\ud83d\ude80 Frontend Army: My Medium Publication (525+ followers)\n\ud83d\udce9 Send me your queries at gourav.hammad.sdbc@gmail.com

\n

If you found this article helpful, feel free to leave a clap \ud83d\udc4f\ud83c\udffb or share your thoughts in the comments \u2014 your support means a lot and helps me continue sharing more experiences like this.

" }, { "title": "Frontend Engineer @Stripe : Interview Experience", @@ -330,9 +194,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "December 6, 2024 Frontend Engineer @Stripe : Interview Experience When I stumbled upon the Frontend Engineer role at Stripe through getjobs.today, I was excited to be part of a company redefining...", "slug": "1-frontend-engineer-stripe-interview-experience-by-kumar", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

December 6, 2024

Frontend Engineer @Stripe\u00a0: Interview Experience

When I stumbled upon the Frontend Engineer role at Stripe through getjobs.today, I was excited to be part of a company redefining global\u2026

\"\"

Kumar

3 min read

When I stumbled upon the Frontend Engineer role at Stripe through getjobs.today, I was excited to be part of a company redefining global payments. Stripe's mission to increase the GDP of the internet resonated deeply, and the technical challenges they offered were equally enticing.

\n

Here's a detailed breakdown of my interview experience, complete with questions and preparation tips.

\n

Company & Role Overview

\n

Stripe is a leading global payment processing platform, known for its developer-first approach and seamless integrations. The Frontend Engineer role focused on building intuitive, scalable user interfaces for Stripe's dashboard and APIs while working on cutting-edge technologies like React, TypeScript, and GraphQL.

\n

The Interview Process

\n

The process took about 5 weeks and included 5 distinct rounds:

\n

Round 1: Recruiter Screen (30 minutes)

\n

This round assessed my basic qualifications and motivation for the role.

\n

Key questions included:

\n
    \n
  • Why do you want to work at Stripe?
    • \n
  • What do you know about Stripe's products?
    • \n
  • Share your experience with React and modern frontend development.
    • \n
\n

Tip: Research Stripe's core values and prepare to explain how your experience aligns with their mission. Mention any previous work with payment systems or complex UIs.

\n

Round 2: Technical Phone Screen (60 minutes)

\n

This round tested my hands-on coding skills through a live coding exercise.

\n

Task:

\n
    \n
  • Implement a searchable dropdown component with React, which fetches and filters API results in real-time.
    • \n
  • Bonus: Add debounce functionality and handle edge cases like empty results and API errors.
    • \n
\n

The interviewer was looking for:

\n
    \n
  • Clean, modular code
    • \n
  • Proper state management with React hooks
    • \n
  • Error handling and performance optimizations
    • \n
\n

Tip: Communicate your thought process clearly, and ask clarifying questions about edge cases or performance requirements.

\n

Round 3: System Design (90 minutes)

\n

This was a collaborative session with a senior engineer to design a frontend system.

\n

Challenge:

\n
    \n
  • Design a notification center for Stripe's dashboard that handles:
    • \n
  • Multiple notification types (errors, updates, payment alerts).
    • \n
  • Real-time updates via WebSockets.
    • \n
  • Custom user preferences for notification filtering.
    • \n
\n

Discussion points included:

\n
    \n
  • State management strategy (Redux vs Context API).
    • \n
  • Caching recent notifications locally for performance.
    • \n
  • UI responsiveness and accessibility considerations.
    • \n
\n

Tip: Think aloud and discuss trade-offs between performance and complexity. Stripe values clarity in decision-making.

\n

Round 4: Bug Bash (75 minutes)

\n

A hands-on debugging session to fix issues in an existing codebase.

\n

Task:

\n
    \n
  • Resolve a performance bottleneck in a React table component rendering large datasets.
    • \n
  • Fix a bug causing incorrect pagination behavior.
    • \n
\n

Approach:

\n
    \n
  1. Used React Profiler to identify unnecessary re-renders.
    2. \n
  2. Applied memoization (React.memo, useMemo) to optimize performance.
    3. \n
  3. Fixed the pagination logic by properly handling edge cases in the state updates.
    4. \n
\n

Tip: Debug systematically and explain each step. The interviewer appreciated my use of React DevTools and focus on incremental fixes.

\n

Round 5: Behavioral & Culture Fit (60 minutes)

\n

This round focused on my past experiences, problem-solving approach, and cultural alignment.

\n

Key questions:

\n
    \n
  • Share a challenging project you've worked on. How did you overcome obstacles?
    • \n
  • How do you handle disagreements in a team?
    • \n
  • What is your approach to learning new technologies?
    • \n
\n

Scenario-based questions:

\n
    \n
  • You notice an inefficiency in Stripe's frontend architecture. How would you address it?
    • \n
  • Your team is behind schedule for a critical feature. How would you manage this situation?
    • \n
\n

Tip: Stripe values collaboration and user-focus. Share examples that highlight your adaptability, teamwork, and user-centric mindset.

\n

Preparation Strategy

\n

Technical Skills:

\n
    \n
  1. Refreshed JavaScript fundamentals and React patterns.
    2. \n
  2. Practiced coding problems on LeetCode and HackerRank, focusing on UI-related challenges.
    3. \n
  3. Studied design principles and performance optimization strategies for frontend systems.
    4. \n
\n

Resources:

\n
    \n
  • Frontend Masters courses on React and TypeScript.
    • \n
\n
    \n
  1. Want to understand how react renders ? ( Commonly ask question in interviews )
    2. \n
  2. 5 Javascript Questions Commonly asked in Interviews
    3. \n
  3. React.js Interview questions \u2014 Test yourself !!
    4. \n
  4. 70% Interviewer ask these React.js questions [ Click ]
    5. \n
  5. Make one of these MERN projects to get hired easily
    6. \n
  6. 5 Next.js Questions you should know about
    7. \n
\n
    \n
  • Stripe's engineering blog for insights into their systems.
    • \n
  • Books like Designing Interfaces by Jenifer Tidwell.
    • \n
\n

Mock Interviews:\nConducted mock system design sessions with peers to refine my ability to articulate solutions.

\n

The Offer

\n

After three weeks, I received a competitive offer, including:

\n
    \n
  • A generous base salary
    • \n
  • Equity options
    • \n
  • Performance-based bonuses
    • \n
  • A flexible work environment and learning opportunities
    • \n
\n

Joining Stripe isn't just about coding; it's about contributing to a mission-driven company that impacts millions of users worldwide. The interview process was challenging but rewarding, offering a glimpse into the high standards and innovation at Stripe.

\n

Good luck to anyone preparing for this journey \u2014 you've got this!

" }, { "title": "Paytm Interview Experience (<2 yrs Experienced FrontEnd)", @@ -345,24 +210,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "For Paytm Noida location Round 1:(Machine Coding Round) This round was a machine coding round and some MCQ's based questions were also asked(1 hr) This round was taken on the mettl platform. MCQ's...", "slug": "1-paytm-interview-experience-2-yrs-experienced-frontend-geeksforgeeks", - "status": "approved" - }, - { - "title": "My PhonePe Interview Experience \u2014 A Journey of Learning", - "original_url": "https://arpit09chauhan.medium.com/my-phonepe-interview-experience-a-journey-of-learning-and-reflection-08d217cf55e8", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:42:43.985753", - "tags": [ - "Phonepe", - "frontend", - "interview" - ], - "summary": "", - "slug": "1-my-phonepe-interview-experience-a-journey-of-learning", - "status": "approved" + "status": "approved", + "formatted_content": "
For Paytm Noida location\r\n\r\nRound 1:(Machine Coding Round)\r\n\r\nThis round was a machine coding round and some MCQ's based questions were also asked(1 hr)\r\n\r\nThis round was taken on the mettl platform.\r\n\r\nAbove all this the laptop they have given to me for coding was so laggy i can't explain in words.\r\n\r\nRound 2:Face to face(1.5HR)\r\n\r\nThis round interviewer was very humble.\r\n\r\nRound 3:Face to face(45mins)\r\n\r\nThis round interviewer was very knowledgeable and calm.\r\n\r\nRound 4:Face to face(40mins)(Hiring Manager Round)\r\n\r\nVerdict \u2013 Selected.\r\n\r\nI would suggest you to discuss your approach with the interviewer because they are basically looking for how you approach a problem and how to come up with an answer i.e. your thought process while formulating the solution to the problem." }, { "title": "Zomato Interview Experience for Frontend Intern", @@ -375,9 +226,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Candidate Information: Status: Final-year student Target Position: Frontend Developer Intern Location: Gurugram, India Interview Date: June 20, 2025 Recruitment Overview Process Initial Screening +...", "slug": "1-zomato-interview-experience-for-frontend-intern", - "status": "approved" + "status": "approved", + "formatted_content": "

Candidate Information:

  • Status: Final-year student
  • Target Position: Frontend Developer Intern
  • Location: Gurugram, India
  • Interview Date: June 20, 2025

Recruitment Overview Process

  • Initial Screening + Technical Interview 1
  • Technical Interview 2

Round 1: Initial Screening + Technical Interview 1

  • Duration: 1 hour
  • Method: Online (Google Meet)
  • Focus: Project + Data Structures and Algorithms (DSA)

Key Questions:

  • Project Explanation
  • Movie Scheduling Problem

\"You are given multiple movies with start and end times. Find the maximum number of movies you can watch such that no two overlap (you can watch only one at a time).\"

\u2192 Classic greedy interval scheduling problem.

Round 2: Technical Interview 2

  • Duration: 1 hour
  • Method: Online (Google Meet)
  • Focus: DSA + Frontend Coding

1) Task Scheduler Problem

\"Given an array A = ['A', 'A', 'B', 'C', ...] and an integer N representing the cooldown period, remove all characters. You can remove one character per second, but the same character must be removed at least N seconds apart. Calculate the minimum time required to remove all characters.\"

\u2192 Based on task scheduling with cooldown.

Both DSA Questions were moderate. Successfully solved both questions.

2) React Machine Coding :

React coding problem involving building a small component with clean and functional output.

Struggled in the React portion due to limited experience in frontend development.

This gap ultimately became a blocker for progressing to the next round.

Post-Interview Reflections

Company Culture Insights

Interviewers were friendly and collaborative, and the interview pace was balanced. Emphasis was on practical skills.

Work Environment

Entire process conducted remotely. Seamless Google Meet experience with screen-sharing for coding.

Benefits Highlight

Not explicitly discussed due to not reaching HR round.

Evaluator Feedback

Although there was no direct feedback, the decision reflected a clear need for balanced frontend and backend skills for this role.

Suggestions for Improvement

  • Interview process was well-structured.
  • Could include clearer expectations about full-stack readiness in the job description.

Closing Note

  • Even though I couldn't proceed beyond the second round, this experience was a great reminder:
  • Solving DSA is important.
  • Backend knowledge is necessary.
  • But practical coding skills, especially in frontend frameworks like React, are equally crucial for product-based roles.
" }, { "title": "My Zomato Frontend Interview Experience | 66 LPA | Gurgaon", @@ -390,9 +242,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Company Logo August 16, 2025 My Zomato Frontend Interview Experience | 66 LPA | Gurgaon This was one of the best interview experiences so far when it comes to Frontend interview experiences. Only a...", "slug": "5-my-zomato-frontend-interview-experience-66-lpa-gurgaon", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post
Company Logo

August 16, 2025

My Zomato Frontend Interview Experience | 66 LPA | Gurgaon

This was one of the best interview experiences so far when it comes to Frontend interview experiences. Only a few companies take interviews\u2026

\"\"

Gourav Hammad

6 min read

This was one of the best interview experiences so far when it comes to Frontend interview experiences. Only a few companies take interviews that are around solving real-world problems.

\n

How did I get this opportunity?

\n

Well, you can't directly get interview calls from Zomato as it has a different hiring process. In order to get an interview at Zomato, you need to have someone known working there so that you can get an interview call.

\n

I had a few friends working there, so I would always ask them if there were any Frontend openings available to reach out ot me.

\n

After asking them for around three to four months, there was finally an open position at Zomato. Then I got a referral for a Frontend Position at Zomato.

\n

What was the compensation structure?

\n

During this interview, I already had an offer from DP World for a Group SDE II position, which was 47 LPA as total CTC, which you can see below.

\n\n \n \n \"None\"\n\n
\n

Note: Critical details are hidden for maintaining the Code of Conduct policy.

\n
\n

So I told the HR that I am looking forward to the Zomato role, and it's a startup, and learning is very high in startups as compared to an MNC like DP World.

\n

I have already shared my DP World Frontend Interview experience long back, you can check that in my profile along with other 25+ big firms' experiences.

\n

I was looking for more learning rather than chill culture. So HR told me that they have a good budget somewhere around my existing offer. So I was okay with that, and then my interviews were scheduled.

\n
\n

Note: This is my old interview experience. It has nothing to do with my current organization.

\n
\n

What was the interview structure?

\n

It was quite a big process. There were a total of 5 rounds. All were eliminated. The moment you fail in any of the rounds, you are completely out of the interview process.

\n

That's the hard reality of this tech industry, no matter how skilled you are, one small mistake in any of the interviews (due to poor internet connection, bad luck, panel not taking interest, etc) can ruin your whole efforts.

\n

Well, I was lucky that I cleared all 5 rounds and got an offer, which I later rejected as I joined CoinDCX as a Senior Software Engineer

\n

The following are the 5 rounds that were taken:

\n
    \n
  • Round 1: Initial HR Screening (30 Minutes)
    • \n
  • Round 2: React & JavaScript (1 Hour)
    • \n
  • Round 3: Take-home Assignment (2 Days)
    • \n
  • Round 4: System Design (90 Minutes)
    • \n
  • Round 5: Culture & Leadership Round (45 mins)
    • \n
\n

Let's talk about each round in detail

\n

Now we will discuss each round in detail. The whole process was very interesting and new for me. First of its kind, like a home take assignment after Round 1 of technical discussion.

\n

Round 1: Initial HR Screening (30 Minutes)

\n

It was conducted by a Zomato In-house Recruiter.

\n

They reached out directly via LinkedIn, highlighting the increasing trend of talent sourcing through professional networks.

\n

If you're actively job hunting, ensure your LinkedIn is updated and highlights relevant tech stacks.

\n

The following are the topics that we discussed in this round.

\n

Question 1. My Current Role & Responsibilities

\n

The conversation began with a walkthrough of my current role.\nI shared details like:

\n
    \n
  • My designation and team structure.
    • \n
  • Day-to-day contributions primarily to ReactJS-based frontend development.
    • \n
  • Key features and modules I've recently shipped.
    • \n
  • My role in code reviews, performance optimization, and collaboration with cross-functional teams.
    • \n
\n
\n

Tip: Instead of generic job duties, highlight impactful outcomes.\nExample: \"I led the UI revamp of the onboarding flow, improving conversion by 18%.\"

\n
\n

Question 2. About Salary Expectations & Notice Period

\n

A standard part of HR screening, I was asked about:

\n
    \n
  • Current CTC (Fixed + Variable + ESOPs, if any).
    • \n
  • Expected hike and all.
    • \n
  • Notice period, and if it could be bought out or negotiated.
    • \n
\n
\n

Be transparent, but research Zomato's typical band for your role beforehand to set reasonable expectations.

\n
\n

Question 3. Why do you want to join Zomato?

\n

This is where your personal story shines. I tailored my response to reflect:

\n
    \n
  • Passion for consumer tech and the food-tech space.
    • \n
  • Admiration for Zomato's fast-paced delivery and experimentation culture.
    • \n
  • Desire to work in a high-impact environment that ships features to millions.
    • \n
\n
\n

I also mentioned how I personally use Zomato, which helped build a real-world connection.

\n
\n
\n

Tip: Show that you've done your homework. Talk about a recent product launch or blog post and express how you'd love to contribute to similar initiatives.

\n
\n

Question 4. Tech Stack Familiarity: React.js, Next.js, Tailwind CSS

\n

Though it wasn't a deep technical dive, the recruiter asked:

\n
    \n
  • My comfort level with React (years of experience, project size, advanced concepts).
    • \n
  • If I had worked with Next.js and how familiar I would have been familiar with SSR (Server-Side Rendering).
    • \n
  • Whether I had hands-on experience with Tailwind CSS or had used other styling methodologies like SCSS, styled-components, or CSS modules.
    • \n
\n

I briefly described:

\n
    \n
  • A few projects built with Next.js and Tailwind, mentioning SSR and performance benefits.
    • \n
  • How Tailwind accelerated my UI development and allowed for better design consistency.
    • \n
\n

This round is not about grilling you technically.\nIt's about aligning expectations, understanding fit, and judging your enthusiasm for the company and domain.

\n

Round 2: React & JavaScript (1 Hour)

\n

This round was conducted by a Senior Frontend Engineer at Zomato.

\n

This round was a deep technical discussion focused on React internals, modern JS practices, and scalable frontend architecture.

\n

The interviewer was highly experienced and encouraged thoughtful explanations over rote answers.

\n

The following are the topics that were discussed in this round.

\n

Question 1. What is Virtual DOM? Why does it matter?

\n

We kicked off with the fundamentals of the Virtual DOM:

\n
    \n
  • I explained how React maintains a lightweight copy of the real DOM in memory.
    • \n
  • On state/prop updates, a new virtual DOM is created and compared (via diffing) with the previous version.
    • \n
  • Efficient batch updates are then sent to the real DOM using a process known as reconciliation.
    • \n
\n
\n

Advantage:_ Improves performance by minimizing direct DOM manipulations, which are typically slow._

\n
\n

Interviewer Follow-up:_ \"Why not update the real DOM directly?\"_\nI discussed the cost of reflows/repaints and how batching helps prevent layout thrashing.

\n

Question 2. What are state management patterns? Share some scalable approaches for building large apps.

\n

Next, we discussed state management patterns for enterprise-grade applications:

\n
    \n
  • When to use local state vs global state.
    • \n
  • Libraries like Redux, Zustand, Recoil, and Context API.
    • \n
  • The downside of prop drilling and how Context + Reducers can solve it in medium-sized apps.
    • \n
\n

I also brought up modular state slices and lazy-loaded reducers to scale Redux efficiently.

\n
\n

Tip: Always link state management choices to app complexity, team size, and maintenance overhead.

\n
\n

Question 3. Implement the throttle function from scratch

\n

I was asked to code a throttle function live. Here's the exact solution I wrote and explained:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
// Throttle Function: ensures a function runs\n// at most once every given delay\nfunction throttle(fn, delay) {\n  // Keep track of the last time the function was called\n  let lastCall = 0;\n\n  // Return a throttled version of the original function\n  return function (...args) {\n    const now = new Date().getTime(); // Get the current time\n\n    // Only run the function if enough time has\n    // passed since the last call\n    if (now - lastCall >= delay) {\n      lastCall = now;  // Update the last call time\n      fn(...args);     // Call the original function with the arguments\n    }\n  };\n}
\n\t\t\t\t\t\t\t
// Throttle Function: ensures a function runs\n// at most once every given delay\nfunction throttle(fn, delay) {\n  // Keep track of the last time the function was called\n  let lastCall = 0;\n\n  // Return a throttled version of the original function\n  return function (...args) {\n    const now = new Date().getTime(); // Get the current time\n\n    // Only run the function if enough time has\n    // passed since the last call\n    if (now - lastCall >= delay) {\n      lastCall = now;  // Update the last call time\n      fn(...args);     // Call the original function with the arguments\n    }\n  };\n}
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Explanation: This limits how frequently fn can be executed, ensuring it's not called again until delay ms have passed since the last invocation \u2014 ideal for scroll or resize event listeners.

\n
\n

Throttling is different from debouncing, which delays execution until the event has stopped firing for a certain time.

\n
\n

Question 4. What is the HOC Pattern? What are its use cases & real-life examples?

\n

We then dived into Higher-Order Components (HOCs):

\n
    \n
  • I defined HOCs as functions that take a component and return a new component with enhanced behavior.
    • \n
  • Discussed use cases like:
    • \n
  • Authentication wrappers
    • \n
  • Analytics/event tracking
    • \n
  • Conditional rendering
    • \n
\n

I also contrasted HOCs with Render Props and Hooks, noting how Hooks have mostly replaced HOCs for many use cases.

\n

Question 5. A few React Optimization questions based on React.memo, useMemo, useCallback.

\n

A classic segment for senior-level interviews:

\n
    \n
  • React.memo: Used to avoid re-rendering functional components if props haven't changed.
    • \n
  • useMemo: Memoizes expensive computations.
    • \n
  • useCallback: Memoizes callback functions, preventing unnecessary re-renders in child components.
    • \n
\n

I added that overusing these hooks can sometimes hurt performance \u2014 memoization has its overhead.

\n
\n

Intervew Tip: Show when and why you'd use them, not just how. I gave examples involving list rendering and prop function identity.

\n
\n

Question 6. Discussed Micro-Frontends architecture

\n

We shifted gears to frontend architecture:

\n
    \n
  • I was asked: \"How would you break a large React app into smaller, independently deployable modules?\"
    • \n
\n

I explained:

\n
    \n
  • Using module federation with Webpack 5 to dynamically load remote components.
    • \n
  • Defining bounded contexts per domain (e.g., Checkout, Profile, Orders).
    • \n
  • Challenges like shared dependencies, auth/session management, and consistent UI across modules.
    • \n
\n
\n

Takeaway:_ Micro-frontends work best for large-scale teams needing independent deployment cycles._

\n
\n

This round tested not just my knowledge but my architectural thinking and decision-making.

\n

Be ready to connect patterns to real use cases, show code clarity, and reason through performance trade-offs.

\n

Round 3, Round 4, and Round 5

\n

So till now we have already discussed Round 1 and Round 2. Since this article will be very long if we add all rounds here.

\n

Comment down, and I will share more details.

\n

Looking for more frontend interviews?

\n

If you are looking for more frontend interviews, you can check out my profile, and there are 28+ interview experiences already shared till now. You can check them as well.

" }, { "title": "Myntra SDE-1 Frontend Interview Experience", @@ -405,9 +258,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "March 7, 2025 Myntra SDE-1 Frontend Interview Experience Landing an interview opportunity at Myntra for the SDE-1 Frontend role was an exciting experience. In this blog, I\u2019ll walk you through the\u2026...", "slug": "1-myntra-sde-1-frontend-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

March 7, 2025

Myntra SDE-1 Frontend Interview Experience

Landing an interview opportunity at Myntra for the SDE-1 Frontend role was an exciting experience. In this blog, I\u2019ll walk you through the\u2026

\"\"

Ketan Raj

2 min read

Landing an interview opportunity at Myntra for the SDE-1 Frontend role was an exciting experience. In this blog, I'll walk you through the Online Assessment (OA) round, covering the questions asked, my approach to solving them, and key takeaways.

\n
\n

Online Assessment Round\nThe OA consisted of three questions:

\n
\n
    \n
  1. A string manipulation problem
    2. \n
  2. A problem related to binary strings and number patterns
    3. \n
  3. A frontend challenge using HTML, CSS, and JavaScript
    4. \n
\n

I was able to solve one problem completely (15/15 test cases), and another one partially with 13/15 test cases passing.

\n

Question 1: Last One Standing

\n

Problem Statement:\nYou are given an alphanumeric string S and an integer K. First, construct a new string by appending S K-1 times to itself, forming a repeated sequence appearing K times.

\n

Now, perform the following operations repeatedly until only one character remains:

\n
    \n
  1. Remove every alternate character, starting from the first character.
    2. \n
  2. Remove every alternate character, starting from the last character.
    3. \n
\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Input:\n- input1:A string S.\n- input2: An integer K.\nOutput:\n- Return the last remaining character.\n\nExample:\nInput:\ninput1: \"abcd\"\ninput2: 3\n\nOutput:\n\"b\"
\n\t\t\t\t\t\t\t
Input:\n- input1:A string S.\n- input2: An integer K.\nOutput:\n- Return the last remaining character.\n\nExample:\nInput:\ninput1: \"abcd\"\ninput2: 3\n\nOutput:\n\"b\"
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n
\n

Approach:

\n
\n
    \n
  1. Concatenate the string S K times to form the final sequence.
    2. \n
  2. Iterate through the string and remove alternate characters in two passes:\n\u2014 First pass: Removing from left to right.\n\u2014 Second pass: Removing from right to left.
    3. \n
  3. Repeat the above process until only one character remains.
    4. \n
\n
\n

This problem required a mix of string concatenation, iteration, and alternate character removal strategies.

\n
\n

Question 2: Round Keys

\n

Problem Statement:\nThe Data Encryption Standard (DES) uses a round key, which is a binary substring whose decimal equivalent is equal to its length.

\n

You are given an array of binary strings. For each binary string, any of its substrings can act as a round key if:

\n
    \n
  1. The decimal value of the binary substring is equal to its length.
    2. \n
  2. A substring is considered different if it has different endpoints.
    3. \n
\n

Your task is to determine the number of possible round keys in each binary string and return an integer array representing the count for each string.

\n

If no round key is found in a binary string, return 0 for that string.

\n
\n

Approach:

\n
\n
    \n
  1. Iterate through each binary string and extract all possible substrings.
    2. \n
  2. Convert each binary substring to its decimal equivalent.
    3. \n
  3. Check if the decimal value is equal to the substring length.
    4. \n
  4. Count valid substrings and store the result for each binary string.
    5. \n
\n
\n

This problem was challenging due to the exponential growth of substrings, and optimizing substring extraction was key.

\n
\n

Frontend Challenge: Grid of Boxes with Random Colors

\n

Problem Statement:

\n
    \n
  • Implement a grid of boxes using HTML, CSS, and JavaScript.
    • \n
  • Each box should have a random color.
    • \n
  • Clicking on a box should reset all colors to new random values.
    • \n
\n
\n

Approach:

\n
\n
    \n
  1. Create a grid layout using CSS Grid.
    2. \n
  2. Generate boxes dynamically using JavaScript.
    3. \n
  3. Assign random colors to each box when the page loads.
    4. \n
  4. Add an event listener to detect clicks and regenerate random colors.
    5. \n
\n
\n

Here's a simple JavaScript snippet to achieve this:

\n
\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const gridContainer = document.getElementById(\"grid\");\nfunction generateRandomColor() {\n return `#${Math.floor(Math.random()*16777215).toString(16)}`;\n}\nfunction createGrid(rows, cols) {\n gridContainer.innerHTML = \"\";\n gridContainer.style.display = \"grid\";\n gridContainer.style.gridTemplateColumns = `repeat(${cols}, 1fr)`;\n gridContainer.style.gridGap = \"10px\";\n\n for (let i = 0; i < rows * cols; i++) {\n let box = document.createElement(\"div\");\n box.style.width = \"50px\";\n box.style.height = \"50px\";\n box.style.backgroundColor = generateRandomColor();\n box.addEventListener(\"click\", () => createGrid(rows, cols));\n gridContainer.appendChild(box);\n }\n}\ncreateGrid(5, 5); // Creates a 5x5 grid
\n\t\t\t\t\t\t\t
const gridContainer = document.getElementById(\"grid\");\nfunction generateRandomColor() {\n return `#${Math.floor(Math.random()*16777215).toString(16)}`;\n}\nfunction createGrid(rows, cols) {\n gridContainer.innerHTML = \"\";\n gridContainer.style.display = \"grid\";\n gridContainer.style.gridTemplateColumns = `repeat(${cols}, 1fr)`;\n gridContainer.style.gridGap = \"10px\";\n\n for (let i = 0; i < rows * cols; i++) {\n let box = document.createElement(\"div\");\n box.style.width = \"50px\";\n box.style.height = \"50px\";\n box.style.backgroundColor = generateRandomColor();\n box.addEventListener(\"click\", () => createGrid(rows, cols));\n gridContainer.appendChild(box);\n }\n}\ncreateGrid(5, 5); // Creates a 5x5 grid
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

This problem tested basic DOM manipulation, event handling, and styling concepts in frontend development.

\n

Key Takeaways

\n
\n
    \n
  1. String and Binary String Problems: Make sure to optimize substring handling.
    2. \n
\n
\n
    \n
  1. Frontend Coding Challenge: Practice DOM manipulation, event handling, and CSS Grid/Flexbox.
    2. \n
  2. Time Management: Focus on accuracy first, then try optimizing.
    3. \n
  3. Practice Coding Assessments: Platforms like LeetCode, CodeForce help in preparation.
    4. \n
\n

Final Thoughts

\n

The Myntra SDE-1 Frontend Interview was an interesting experience, especially the mix of DSA and frontend challenges. Though I couldn't get all test cases right, the experience was valuable for improving problem-solving and frontend development skills. If you're preparing for a similar role, focus on mastering core DSA concepts and frontend fundamentals.

\n
\n

Will update the next part soon!!!!

\n
" }, { "title": "Myntra Interview Experience (Off-Campus) 2021", @@ -420,9 +274,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "I applied through referral a month back for the position of Software Engineer - Frontend (React JS) at Myntra . I've total 1 YOE and the recruitment process included 4 rounds in total as follows:...", "slug": "3-myntra-interview-experience-off-campus-2021-geeksforgeeks", - "status": "approved" + "status": "approved", + "formatted_content": "

I applied through referral a month back for the position of Software Engineer - Frontend (React JS) at Myntra. I've total 1 YOE and the recruitment process included 4 rounds in total as follows:

Round 1(Technical interview - Problem Solving): The interviewer gave me 3 coding questions:

  1. Delete Nth node from the end of the given linked list
  2. A Program to check if strings are rotations of each other or not
  3. Add parenthesis around each number in a string such that it has an exact number of parenthesis as the number itself. Note: Use an optimized way to achieve this such that the number of parentheses used is minimum. eg - 
    213 -> ((2)1((3)))
    210 -> ((2)1)0

Note: You should discuss all the approaches to solve the problem including brute force and the most efficient one. Discussion around all the corner/edges cases and complexity of the problems.

Round 2(Technical interview - Data Structures): The interviewer again asked me 4 coding questions:

  1. Delete a Node from the linked list without head pointer
  2. Check for Balanced Brackets in an expression
  3. Minimum Number of Platforms Required for a Railway Station
  4. Lowest Common Ancestor in a Binary Tree

Round 3(Hiring Manager Interview): Very detailed discussion on your current job responsibilities and work. Explaining the tech stack, API design, use cases, and implementation.

Discussion on designing and building logic for a chess app.

Discussion on implementing a small program that reads a book(in form of a file) and creates the audio version of that entire book.

Some questions were asked on React JS and JavaScript like - 

  • Why a page might refresh multiple times?
  • Lifecycle methods
  • State Management in React
  • Design an API to dynamically position components on a page.

Round 4(HR Interview): Discussion on my personal projects.

General Questions like - 

  1. Strengths & Weaknesses.
  2. Most challenging experience in any project.
  3. Best advice received.
  4. Why I am looking for a new job?
  5. Why do you want to join Myntra?

Lastly, I wish you ALL THE VERY BEST, You've got this!!

Hope this helps in your interviews.

Verdict: Selected

" }, { "title": "OLA Interview Experience | Set 7 (For SDE-1)", @@ -435,9 +290,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "I was recently interviewed by OLA, I could not make it after the last round. All rounds I had were telephonic, in the last round I was asked to code on collabedit. Round 1 (around 35 min): 1. Given a...", "slug": "4-ola-interview-experience-set-7-for-sde-1-geeksforgeeks", - "status": "approved" + "status": "approved", + "formatted_content": "
I was recently interviewed by OLA, I could not make it after the last round. All rounds I had were telephonic, in the last round I was asked to code on collabedit.\r\n\r\nRound 1 (around 35 min):\r\n1. Given a matrix containing 0's and 1's. Find all the rows which are having 1's at same position. Give all sets satisfying this.\r\n2. In a stock market given are price of shares spread over a week. On what day should I buy and what day should i sell to get maximum profit.\r\n \r\n3. Being a computer engineer why did I not opt for system side programming than web domain. (I had expr in web domain)\r\n4. I had expr in web domain so he asked: What is the difference between web browser request and ajax call request.\r\n -- It is simple, by ajax call partial web page can be loaded.\r\n5. Have you worked on ruby on rails?\r\n \r\nRound 2 :\r\n1. Given a matrix containing numbers. Find the 0's and make all the rows and columns corresponding to that index as 0.\r\n2. Design a structure for a File Uploader service (eg. Dropbox, google drive). It is a service where multiple people can upload\r\n data at the same time and it also lists the top five uploaders (who uploaded the maximum number of files).\r\n3. Puzzle: There is an employer and a worker, the employer has a gold bar of 7 units and he has to give 1unit each on a day for 7 days.\r\n The employer has a magical knife which doesn't work once it performs two cuts(1 cut divides the bar into two parts) on the bar.\r\n How will you cut so that 1 unit on each day can be given to the worker.\r\n4. Print left view of binary tree.\r\n\r\nRound 3 :\r\n1. He discussed what things they work on Ola. How these things are implemented. Like he mentioned of bar code a product has and catalog kind of thing.\r\n2. I had to explain what project I am working on currently, what is the team size.\r\n3. a)Since I had worked on SQL and databases, so he asked me what data structure will I use to implement a database.\r\n --I gave hashmap as a soln (the key is our primary key and other fields we can store in an object which will be value for hashmap)\r\n b)Now, If in case you want to find all names starting with a particular word (eg. ram....).How will you do that?\r\n -- gave trie structure as soln.\r\n c)Now you need to find students whose marks are between a range i.e. between two numbers. How will you do, what data structure will you take in this case?\r\n -- a simple solution was that, take binary search tree and do inorder traversal of that (I couldn't answer this, not clicked me)\r\n4. Do you want to ask anything?\r\n\r\nRound 4 :\r\n1. The server receives a ping every 30 secs. The ping is load avg on the machine at that time. Find 90% percentile of the load average on the machine\r\nat any time instant.\r\n2. Find missing number in an AP.\r\n\r\n

Related Practice Problems

Maximum Difference" }, { "title": "Ola Interview Experience", @@ -450,24 +306,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "I was part of a recruitment drive in Ola's headquarters in Bangalore. The first row was a Hackerrank test which consisted of a DS question, a SQL statement and a small script to consume a RESTful...", "slug": "5-ola-interview-experience-geeksforgeeks", - "status": "approved" - }, - { - "title": "Frontend interview experience at Atlassian", - "original_url": "https://frontendpro.hashnode.dev/frontend-interview-experience-at-atlassian", - "source": "hashnode", - "author": "Web Author", - "published_at": "2026-06-09T03:42:48.625856", - "tags": [ - "Atlassian", - "frontend", - "interview" - ], - "summary": "", - "slug": "1-frontend-interview-experience-at-atlassian", - "status": "approved" + "status": "approved", + "formatted_content": "
I was part of a recruitment drive in Ola's headquarters in Bangalore. The first row was a Hackerrank test which consisted of a DS question, a SQL statement and a small script to consume a RESTful API. Those who cleared this round proceeded for the face to face interviews.\r\n\r\nRound 1\r\n\r\n1. Given an array and a integer x, find two numbers in the array summing up to x.\r\n\r\nI had to work through a sorting-based solution and a hashing-based solution for this. Complexity analysis was discussed as well.\r\n\r\n2. Game of Nim (DP)\r\n\r\nWrote pseudocode for this, and also discussed the recurrence and why it works. Memoization was also discussed.\r\n\r\n\r\nRound 2\r\n\r\n1. There is an array of A's and O's. A stands for Apple, O stands for Orange. We have m number of spells, each spell allows us to convert an orange into an apple. Find the longest sequence of apples you can make, given an array and the value of m.\r\n\r\nI had to code this live on a laptop, and the interviewer tested it using several test cases.\r\n\r\nAfter this, there was a discussion on my project, most of which was essentially a discussion on scheduled task creation, execution and strategies for the same.\r\n\r\nRound 3\r\n\r\nThis was a pure system design round. We started with some questions on RESTful API design, and later moved on to my project. After I discussed my project, the interviewer cross-questioned me on several corner cases, and listened to how we have handled them. \r\n\r\nThen he moved on to sharding and distributed databases, applying it to my project's scenarios. After this, we discussed load balancers, different algorithms for the same and so on. \r\n\r\nThen we discussed consistency and availability in terms of web apps, and cases where a system needs to be consistent in some operations and available in some other operations.\r\n\r\nBased on this, the interviewer made me write a skeleton implementation for a distributed database system which supports connections in configurable modes - consistent, available, loosely consistent and loosely available.\r\n\r\nThis was by far the toughest round I've faced in any interview, and it was more than a hour and half in length.\r\n\r\nRound 4\r\n\r\nThis was the hiring manager round, we mainly discussed the culture at Ola and he wanted to know about how I work in different situations. He also wanted to know how open I am to mentoring other people. Later, we discussed some problems of working in high-velocity development efforts and how to mitigate them. This was a relatively short interview of about 40 minutes." }, { "title": "Frontend Engineer @Adobe Interview Experience", @@ -480,9 +322,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "December 22, 2024 Frontend Engineer @Adobe Interview Experience Let me share a detailed recount of an Adobe interview for a frontend-focused SDE position. It\u2019s based on common patterns observed and a...", "slug": "3-frontend-engineer-adobe-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post

December 22, 2024

Frontend Engineer @Adobe Interview Experience

Let me share a detailed recount of an Adobe interview for a frontend-focused SDE position. It\u2019s based on common patterns observed and a bit\u2026

\"\"

Kumar

3 min read

Let me share a detailed recount of an Adobe interview for a frontend-focused SDE position. It's based on common patterns observed and a bit of imagination for personalization. Adobe has a strong focus on user experience, performance, and scalability, so the interview aligns with these principles.

\n

Applying to Adobe

\n

After reading the job description, I knew this role was perfect for me. The emphasis on frontend technologies like React and Vue.js, coupled with the opportunity to work on cutting-edge features, was exciting. I applied online and received an email from their recruiter a week later to schedule the first round.

\n

Round 1: Recruiter Call

\n

The recruiter was welcoming and set the tone for the interview process. This was more of a discussion about my experience, current role, and familiarity with frontend frameworks and tools.

\n

Some questions were straightforward:

\n
    \n
  • \"What excites you about working at Adobe?\"
    • \n
  • \"Can you walk me through a recent project where you faced frontend performance challenges?\"
    • \n
\n

I highlighted a project where I optimized a React-based dashboard by reducing rendering bottlenecks. I mentioned my interest in contributing to Adobe's focus on user-centric design, which seemed to resonate well.

\n

Round 2: Online Assessment

\n

The assessment was hosted on HackerRank and lasted 90 minutes. It was a mix of coding challenges and frontend-specific questions.

\n

Coding Questions:

\n
    \n
  1. DOM Manipulation: Write a function to create a dynamic table based on JSON input and apply styles dynamically.
    2. \n
  2. Algorithm: Implement a function to check if two strings are anagrams.
    3. \n
  3. Data Structures: Use a stack to validate if an HTML-like string (e.g., <div><span></span></div>) is properly nested.
    4. \n
\n

Frontend-Specific MCQs:

\n
    \n
  • Questions on CSS specificity and box model.
    • \n
  • Debugging React components to avoid unnecessary re-renders.
    • \n
\n

I focused on writing clean, modular code while explaining the logic wherever required. The test also included a couple of questions about performance tuning in frontend apps.

\n

Round 3: Technical Screen (Frontend and Problem Solving)

\n

This was a live coding session with a senior engineer. The interviewer was friendly and encouraged me to think aloud.

\n
    \n
  • Problem 1: Create a React component for a live search bar with debounce functionality. The challenge was ensuring smooth performance while fetching results from an API.
    • \n
  • Problem 2: Optimize an existing React app with several nested components. The interviewer asked me to identify bottlenecks and refactor the code to use React.memo and useCallback effectively.
    • \n
\n

We also had a brief discussion on frontend architecture.\nQuestion: \"How would you design a reusable component library for a large-scale project?\"\nI emphasized the importance of modularity, theming support, and proper documentation for usability.

\n

Round 4: System Design

\n

This round was focused on designing a scalable frontend system.

\n

Scenario: Design a dashboard for analytics data with features like filtering, pagination, and charts.

\n
    \n
  • I had to choose between client-side and server-side rendering based on the use case.
    • \n
  • The interviewer asked how I would manage API requests efficiently and ensure state synchronization across components.
    • \n
\n

We discussed trade-offs for using state management libraries like Redux vs. React Query and the importance of lazy loading components to improve initial load times.

\n

Round 5: Behavioral Round

\n

This round was a mix of situational and team-related questions. Adobe places a lot of emphasis on collaboration and user empathy, so the interviewer wanted to assess my soft skills.

\n

Questions included:

\n
    \n
  • \"Tell me about a time you had to advocate for a design decision that others initially opposed.\"
    • \n
  • \"How do you handle conflicts within your team?\"
    • \n
\n

I shared a story where I proposed a UI redesign based on usability testing results. Although initially met with resistance, I backed my suggestion with data, which ultimately convinced the team.

\n

Round 6: Final Managerial Round

\n

The manager wanted to understand my long-term goals and how I envisioned growing within Adobe.

\n
    \n
  • We talked about Adobe's design-driven culture and how I could contribute to creating seamless user experiences.
    • \n
  • The manager also asked how I stay updated with the latest frontend trends, to which I mentioned resources like MDN, CSS-Tricks, and frontend communities on GitHub.
    • \n
\n

Outcome

\n

A week later, I received the offer! The entire process was challenging yet enjoyable. Adobe's team was professional, and the interview felt like a conversation rather than a test.

\n
    \n
  1. Want to understand how react renders ? ( Commonly ask question in interviews )
    2. \n
  2. 5 Javascript Questions Commonly asked in Interviews
    3. \n
  3. React.js Interview questions \u2014 Test yourself !!
    4. \n
  4. 70% Interviewer ask these React.js questions [ Click ]
    5. \n
  5. Make one of these MERN projects to get hired easily
    6. \n
  6. 5 Next.js Questions you should know about
    7. \n
\n

Key Takeaways:

\n
    \n
  • Prepare well for React-specific questions: Focus on hooks, performance optimization, and design patterns.
    • \n
  • Practice system design for frontend: Be ready to justify your architectural choices.
    • \n
  • Emphasize collaboration: Adobe values teamwork and problem-solving, so use examples from your experience to showcase this.
    • \n
  • Learn their products: Familiarity with Adobe's tools and mission gives you an edge.
    • \n
\n

If you're passionate about frontend development and creating world-class user experiences, Adobe is an excellent place to work. Good luck!

" }, { "title": "Infosys Interview Experience for React frontend developer", @@ -495,9 +338,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Round-1 (Technical Interview Round-1): Basically, my interview started at noon sharp 12 when I was in teams I turned on the video and waited for the panel. As soon as she entered the meeting I wished...", "slug": "3-infosys-interview-experience-for-react-frontend-developer-geeksforgeeks", - "status": "approved" + "status": "approved", + "formatted_content": "
\n\n

Round-1 (Technical Interview Round-1): Basically, my interview started at noon sharp 12 when I was in teams I turned on the video and waited for the panel.

\n\n\n\n

As soon as she entered the meeting I wished her and asked how's the day going. Later she asked the following questions :

\n\n
  • Tell me something about yourself.
  • She asked me to write code from the front end that how I can handle the API request from an API endpoint.
  • She asked what is lazy-loading and code splitting.
  • She asked how to debounce the application.
  • How the data flow in the components.
  • She asked me to open the code sandbox and told me to code a simple component and render a component to that component. The question is straightforward I have done with this task in 5 ~ 6 mins.
  • Later she asked me to call the API endpoint using \"fetch\" or \"Axios\" from the second component to the first component which is rendered in the app component. I used functional hooks like useEffect and useState.
  • After that, she tested my knowledge and understanding of class components and components life cycle methods like componentDidMount() & componentWillUnmount().
  • Later she asked how to use componentWillUnmount() in the functional component I answered that we use useEffect() hook to clean up the subscriptions and timers in the useEffect function simply return ()=> { cleanup }. to avoid memory leaks.
\n\n

Finally, the interview came to an end and I asked her in which areas I should develop, she gave positive feedback

\n\n\n\n

Author: Susheel Kumar

" }, { "title": "Infosys Interview Experience | GeeksforGeeks", @@ -510,9 +354,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "I participated in HackWithInfy 2021 conducted in the month of May with the intention of hiring students from the batch of 2022. The entire process contains two rounds \u2014 a coding round and one...", "slug": "5-infosys-interview-experience-geeksforgeeks", - "status": "approved" + "status": "approved", + "formatted_content": "

I participated in HackWithInfy 2021 conducted in the month of May with the intention of hiring students from the batch of 2022. The entire process contains two rounds \u2014 a coding round and one interview (technical).

\r\n\r\n\r\n\r\n

Coding Round: There were a total of 3 questions, one was easy, two were moderate. 

\r\n\r\n
  • One of the moderate questions was this. 
  • One had the convenience of choosing to code from a surfeit list of languages. Rudimentary documentation was provided for selective languages to which one could refer while coding. 
  • In order to be selected for the role of Power Programmer, one had to solve all three questions. For being short-listed for the role of Digital Specialist Engineer, partially solving two questions (passing of about 75% test cases) would have sufficed. I managed to solve two questions in the stipulated time and got the call for the interview of Digital Specialist Engineer (formerly known as System Engineer Specialist). 
\r\n\r\n

Interview: Coincidentally, I had my interview scheduled on the 40th anniversary of Infosys' inception. The interview was held on Webex by Cisco and commenced with the exchange of pleasantries. Soon after, I was asked to share my screen and open any online compiler. I was first asked if I were comfortable with C/C++, I replied positively. The interviewer asked two questions, both of which may be unequivocally termed to be of novice level: 

\r\n\r\n
  1. Input an array and determine whether the elements of the array are prime or not
  2. Print n Fibonacci numbers 
\r\n\r\n

I was able to generate the expected output for both the programs and explained my logic. The interviewer seemed satisfied and move to the next segment of the interview. She asked me to rate my proficiency in databases, I rated myself to have moderate proficiency. 

\r\n\r\n
  • I was then asked regular theoretical questions from DBMS (types of joins, primary key, foreign key, DELETE, TRUNCATE and DROP commands). 
  • I answered most of them, and the interviewer finally asked if I had any questions for her. I didn't restrain myself from pointing out the fact that it was their 40th anniversary and enquired about the kind of tech stack used at work by her. 
\r\n\r\n

Result: After a duration of a month and 2 days, I received a mail with the job offer. 

" }, { "title": "\ud83d\udcc2 My Frontend Interview Journey \u2014 Proof of Authenticity & Real Experiences", @@ -524,9 +369,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Email Screenshot May 25, 2025 \ud83d\udcc2 My Frontend Interview Journey \u2014 Proof of Authenticity & Real Experiences \ud83d\udd0d \u201cIn a world filled with fake content and recycled stories, authenticity is a rare...", "slug": "4-my-frontend-interview-journey-proof-of-authenticity-real-experiences", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post
Email Screenshot

May 25, 2025

\ud83d\udcc2 My Frontend Interview Journey\u200a\u2014\u200aProof of Authenticity & Real Experiences

\ud83d\udd0d \u201cIn a world filled with fake content and recycled stories, authenticity is a rare virtue.\u201d\n\u200a\u2014\u200aand I\u2019m proud to share my real journey.

\"\"

Gourav Hammad

5 min read

\n

\ud83d\udd0d \"In a world filled with fake content and recycled stories, authenticity is a rare virtue.\"\n\u2014 and I'm proud to share my real journey.

\n
\n

Over the past few months, I've shared detailed and honest frontend interview experiences with several top tech companies, including:

\n

\ud83d\ude80 My Uber Frontend Interview Experience | 65 LPA | Software Engineer II\ud83d\ude80 My Quince Frontend Interview Experience | 45 LPA | SDE-3 Frontend\n\ud83d\ude80 My Viacom18 Frontend Interview Experience | 44 LPA | SDE-2 Frontend\n\ud83d\ude80 My Zepto Frontend Interview Experience | 40 LPA | SDE-2 Frontend\n\ud83d\ude80 My DP World Frontend Interview Experience | 40 LPA | Group SDE I\n\ud83d\ude80 My Tekion Frontend Interview Experience | 54 LPA | SDE-2 UI\n\ud83d\ude80 My Sense Frontend Interview Experience | 38 LPA | SDE-2 UI\n\ud83d\ude80 My Pramana.AI Frontend Interview Experience | 40 LPA | SDE-2 UI\n\ud83d\ude80 My Qiro Finance Frontend Interview Experience | 30 LPA | SDE UI\n\ud83d\ude80 My Hyper Source Frontend Interview Experience | 60 LPA | SSE UI\n\ud83d\ude80 My Servicenow Frontend Interview Experience | 42 LPA | SDE IC2 UI\n\ud83d\ude80 My UiPath Frontend Interview Experience | 45 LPA | SDE-2 UI

\n

But in today's content landscape, it's important to show proof, not just tell stories.

\n

That's why I'm sharing direct screenshots, emails, and proof from my application and interview journey \u2014 to make it 100% transparent and credible for everyone who's learning and preparing from my experiences.

\n

\ud83d\udd10 Why Am I Sharing This?

\n
    \n
  • To build trust in everything I share.
    • \n
  • To help fellow frontend engineers believe in the real struggle, prep, and mindset it takes to crack top companies.
    • \n
  • To fight misinformation and \"copied\" content floating around on LinkedIn, GitHub, and blogs.
    • \n
  • Because authenticity matters \u2014 especially when you're guiding others through interview prep.
    • \n
\n

\ud83d\udcc1 Proof of Interviews \u2014 Company-wise Breakdown

\n
\n

Click to expand individual sections below for screenshots and email confirmations.

\n
\n

\ud83c\udfe2 1. Uber \u2014 Software Engineer II [Debrief Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 2. Sense \u2014 SDE-2 UI [Debrief Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 3. Quince \u2014 SDE-3 Frontend [R1 Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 4. Viacom18\u2014 SDE-2 Frontend [R1 Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 5. Zepto\u2014 SDE-2 Frontend [R1 Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 6. DP World \u2014 Group SDE I [Offer Letter]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 7. Tekion\u2014 SDE-2 UI [Offer Letter]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 8. Pramana.AI [nference]\u2014 SDE-2 UI [R1 Reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 9. Servicenow\u2014 SDE IC2 UI [R2 reject]

\n\n \n \n \"None\"\n\n

\ud83c\udfe2 10. UiPath \u2014 SDE-2 UI [R3 reject]

\n\n \n \n \"None\"\n\n

All of these are 100% self-written, based on real interviews, and tailored to help others learn from actual experiences, not just pass interviews blindly.

\n
\n

\u26a0\ufe0f Note: To maintain professional integrity and follow the Code of Conduct expected from a working software engineer \ud83d\udc68\u200d\ud83d\udcbb, I've intentionally hidden specific dates from these interview experiences. Sharing timelines could conflict with current employment policies or lead to unwanted assumptions \u2014 and I believe it's important to stay ethical and respectful of all parties involved \ud83e\udd1d.

\n
\n

\ud83c\udfaf These are just a few of the interviews I've appeared for. In reality, I've participated in many more, across various companies, roles, and challenges \u2014 all of which will be shared in batches over the next few months \ud83d\udcc5. My goal is not just to crack interviews, but to consistently practice, keep myself technically sharp, and document everything for others to benefit \ud83d\udcda.

\n

\u2728 I'm passionate about sharing real-world frontend interview journeys to help others prepare smarter, avoid common mistakes, and learn from hands-on experience \ud83d\ude80. That's why I've also launched a dedicated course where I've broken down 30+ of my interview experiences in full detail \u2014 including:

\n
    \n
  • \ud83d\udcbb Machine coding rounds
    • \n
  • \ud83e\udde0 DSA questions
    • \n
  • \ud83d\udee0\ufe0f System design insights
    • \n
  • \ud83c\udfaf JavaScript tips and tricks
    • \n
  • \u2699\ufe0f Frontend performance and debugging techniques\n\u2026and so much more!
    • \n
\n

\ud83d\udca1 Whether you're preparing for your first frontend interview or aiming for senior-level roles, I'm sure these shared learnings will add a lot of value to your journey. Stay tuned for more! \ud83d\udd01\ud83d\udcc8

\n

\ud83e\udeaa Final Words \u2014 Real Stories Help Real People

\n

\ud83e\udde0 A Recent Controversy I Faced on LinkedIn

\n

Recently, I found myself at the center of an unexpected controversy on LinkedIn. Someone \u2014 a junior from the industry \u2014 claimed that my interview experiences were fake simply because I was sharing new posts every day. \ud83e\udd2f

\n

Let me clarify this once and for all:\n\u2705 These experiences are from the past 1 to 1.5 years of active interviewing, not something that happened all at once.\n\u2705 I've always been transparent \u2014 these posts have nothing to do with my current organization.\n\u2705 My goal has only been to help others by documenting real, practical frontend interview journeys and lessons. \ud83c\udfaf

\n

\ud83d\ude80 Success is Not a One-Shot \u2014 My Interview Journey Before CoinDCX

\n

Instead of learning from the content or appreciating the consistency and effort, this individual chose to question my authenticity and current work commitments. But hey, this is the reality of today's internet \u2014 where it's easier for people to doubt than to build something valuable or contribute to the community. \ud83e\uddea

\n

\ud83d\udcac Honestly, I've noticed this pattern before. Very few want to uplift others \u2014 most are just waiting to pull someone down when they see them helping or growing. That's the harsh truth of the current Gen Z tech culture. But guess what?

\n

\ud83d\ude04 I'm not affected at all. Coming from an Army background, I've faced many tougher situations in life. I know how to deal with distractions, criticism, and negativity \u2014 and more importantly, I know how to stay focused on what truly matters. \ud83e\udee1

\n

So to all those who have been supporting, engaging, and learning from these posts \u2014 thank you \ud83d\ude4f. I'll continue sharing more honest, real, and valuable interview experiences with the frontend community. \ud83d\ude80\nStay tuned \u2014 we're just getting started! \ud83d\udd25

\n

But your time and effort deserve real content. That's why I'm committed to sharing my real journey \u2014 with proof \u2014 to help frontend developers like you prepare better, feel more confident, and eventually crack that dream job.

\n

If any of these stories helped you, do leave a message or share your story with me. I'd love to connect, help, and keep building this community of real developers who are helping each other. \ud83d\udc96

\n

Looking for more frontend interviews?

\n

If you are looking for more frontend interviews, you can check out my profile, and there are 28+ interview experiences already shared till now. You can check them as well.

\n

\ud83c\udf41 Follow Me for More!

\n

I am a Senior Frontend Engineer with 5+ years of experience, and I share interview experiences, frontend insights, technical blogs, and tech career tips.

\n

\ud83d\udcbc LinkedIn: Gourav Hammad (25K+ followers)\n\ud83d\ude80 Frontend Army: My Medium Publication (525+ followers)\n\ud83d\udce9 Send me your queries at gourav.hammad.sdbc@gmail.com

\n

If you found this article helpful, feel free to leave a clap \ud83d\udc4f\ud83c\udffb or share your thoughts in the comments \u2014 your support means a lot and helps me continue sharing more experiences like this.

" }, { "title": "SenseHQ Frontend Interview Experience \u2014 My Journey Through DSA, System Design & Machine Coding", @@ -538,79 +384,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "March 24, 2025 SenseHQ Frontend Interview Experience \u2014 My Journey Through DSA, System Design & Machine Coding \ud83d\ude80 Cracking a frontend interview requires a blend of problem-solving, system design...", "slug": "5-sensehq-frontend-interview-experience-my-journey-through-dsa-system-design-mac", - "status": "approved" - }, - { - "title": "Appinventiv (React Native Developer) |Interview Experience", - "original_url": "https://medium.com/@adarshpy/appinventiv-react-native-developer-interview-experience-0eff1c3b4251", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:46.371352", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "1-appinventiv-react-native-developer-interview-experience", - "status": "approved" - }, - { - "title": "\ud83d\ude80 React Interview Experience (August 2025): Accolite Digital (Part -1", - "original_url": "https://medium.com/@errichagautam1111/react-interview-experience-august-2025-accolite-digital-part-1-39d67cd8742c", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:46.371399", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "2-react-interview-experience-august-2025-accolite-digital-part-1", - "status": "approved" - }, - { - "title": "My Interview Experience as a React Developer at Accenture", - "original_url": "https://medium.com/@Jaskaran-Singh/my-interview-experience-as-a-react-developer-at-accenture-db69584c6661", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:46.371421", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "3-my-interview-experience-as-a-react-developer-at-accenture", - "status": "approved" - }, - { - "title": "\ud83d\ude80 React Interview Experience (August 2025): Empenofore ...", - "original_url": "https://medium.com/codetodeploy/react-interview-experience-august-2025-empenofore-technologies-dfe9a13f42af", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:46.371476", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "5-react-interview-experience-august-2025-empenofore", - "status": "approved" - }, - { - "title": "My SDE-1 Interview Experience at GeeksforGeeks", - "original_url": "https://medium.com/@iaamsuneel/my-sde-1-interview-experience-at-geeksforgeeks-b46ee941d993", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:47.466599", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "1-my-sde-1-interview-experience-at-geeksforgeeks", - "status": "approved" + "status": "approved", + "formatted_content": "

March 24, 2025

SenseHQ Frontend Interview Experience\u200a\u2014\u200aMy Journey Through DSA, System Design & Machine Coding

\ud83d\ude80 Cracking a frontend interview requires a blend of problem-solving, system design expertise, and real-world coding skills. I recently\u2026

\"\"

Gourav Hammad

3 min read

\ud83d\ude80 My Sense Frontend Interview Experience | 38 LPA | SDE-2 UI

\n\n \n \n \"None\"\n\n

\ud83d\ude80 Cracking a frontend interview requires a blend of problem-solving, system design expertise, and real-world coding skills. I recently went through the Sense interview process, and I'm excited to share my detailed experience. If you're preparing for frontend interviews at top product-based companies, this guide will help you understand what to expect and how to ace it!

\n

\ud83d\udd0d Interview Rounds Overview

\n

Sense follows a multi-stage interview process, assessing Data Structures & Algorithms (DSA), System Design, Machine Coding, and Behavioral Fit. Below is a structured breakdown of each round, with questions, insights, and best practices.

\n

\ud83d\udca1Round 1: Data Structures & Algorithms (DSA)

\n

Binary Search Implementation in JavaScript

\n

The first problem was to implement Binary Search in JavaScript. Here's my optimized solution:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
function binarySearch(list = [], targetElement = 0) {\n    let listLength = list.length;\n    let middleIndex = Math.floor(listLength / 2);\n\n      if (list[middleIndex] === targetElement) return true;\n      if (list.length === 1) return false;\n\n    return list[middleIndex] > targetElement\n        ? binarySearch(list.slice(0, middleIndex), targetElement)\n        : binarySearch(list.slice(middleIndex), targetElement);\n}\n\nlet sortedList = [1, 2, 3, 4, 5, 15, 20, 25, 100];\nconsole.log(binarySearch(sortedList, 21)); // false\nconsole.log(binarySearch(sortedList, 20)); // true
\n\t\t\t\t\t\t\t
function binarySearch(list = [], targetElement = 0) {\n    let listLength = list.length;\n    let middleIndex = Math.floor(listLength / 2);\n\n      if (list[middleIndex] === targetElement) return true;\n      if (list.length === 1) return false;\n\n    return list[middleIndex] > targetElement\n        ? binarySearch(list.slice(0, middleIndex), targetElement)\n        : binarySearch(list.slice(middleIndex), targetElement);\n}\n\nlet sortedList = [1, 2, 3, 4, 5, 15, 20, 25, 100];\nconsole.log(binarySearch(sortedList, 21)); // false\nconsole.log(binarySearch(sortedList, 20)); // true
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Other DSA Questions

\n

\u2705 Shallow vs. Deep Cloning \u2014 Explain the difference & implement deep cloning.\n\u2705 Handling Circular References in Deep Clone\n\u2705 Object.keyName vs. Object[keyName] \u2014 Key Differences

\n

\ud83d\udd25 Pro Tip:

\n

Mastering recursion, array methods, and object manipulation is crucial for frontend DSA rounds.

\n

\ud83d\udca1Round 2: Advanced JavaScript & Frontend Problem Solving

\n

1\ufe0f\u20e3 SSR vs CSR \u2014 Why Server-Side Rendering is Better?

\n

The interviewer asked me to compare SSR (Server-Side Rendering) vs. CSR (Client-Side Rendering). Key points included:

\n
    \n
  • SEO Benefits: SSR improves search engine rankings by serving pre-rendered pages.
    • \n
  • Faster First Load: CSR relies on JavaScript bundles, which may delay content visibility.
    • \n
  • Better Performance: SSR ensures better Core Web Vitals scores and lower LCP (Largest Contentful Paint).
    • \n
\n

2\ufe0f\u20e3 Implement Lodash's flow Function Equivalent

\n

The task was to write a function that takes multiple functions as parameters and processes them sequentially.

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const flow = (...funcs) => (arg) => funcs.reduce((res, fn) => fn(res),arg);\n\nconst add = (x) => x + 2;\nconst multiply = (x) => x * 3;\nconst process = flow(add, multiply);\nconsole.log(process(5)); // Output: (5 + 2) * 3 = 21
\n\t\t\t\t\t\t\t
const flow = (...funcs) => (arg) => funcs.reduce((res, fn) => fn(res),arg);\n\nconst add = (x) => x + 2;\nconst multiply = (x) => x * 3;\nconst process = flow(add, multiply);\nconsole.log(process(5)); // Output: (5 + 2) * 3 = 21
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

3\ufe0f\u20e3 Implement Debounce Polyfill & Use Call, Apply, Bind in It

\n

I was asked to create a debounce function that limits how often a function can be executed.

\n

\ud83d\udca1Round 3: System Design \u2014 Scalable Frontend Architecture

\n

1\ufe0f\u20e3 A/B Testing in Frontend \u2014 How Does It Work?

\n

A/B Testing in frontend involves:

\n
    \n
  • Dividing traffic into control & variation groups.
    • \n
  • Using feature flags and toggles.
    • \n
  • Tracking key metrics like CTR (Click Through Rate) & Conversions.
    • \n
  • Tools: Google Optimize, Optimizely, VWO.
    • \n
\n

2\ufe0f\u20e3 Optimizing Large Data Tables (Trillions of Records)

\n
    \n
  • Virtualized Rendering \u2014 Use libraries like React Virtualized for performance.
    • \n
  • Pagination & Lazy Loading \u2014 Avoid loading unnecessary data upfront.
    • \n
  • IndexedDB & Caching \u2014 Store frequently accessed data locally.
    • \n
\n

\ud83d\udca1Round 4: Machine Coding \u2014 Real-World Component Building

\n

Task: The following task was given to build.

\n

\u2705 Create a Nav Bar with a user list.\n\u2705 Clicking a user removes them from the list and shows details in a side panel.\n\u2705 Ensure optimized re-renders using React.memo & useCallback.

\n

\ud83d\udd39 Key Focus Areas:

\n
    \n
  • React State Management (useState, useReducer, Context API)
    • \n
  • Event Handling & DOM Manipulation
    • \n
  • Performance Optimization Techniques
    • \n
\n

\ud83d\udca1Round 5: Hiring Manager (HM) Round \u2014 Behavioral & Fit

\n

Common Questions Asked:

\n

\u2753 Tell me something about yourself that's NOT in your resume.\n\u2753 Why did you choose B.Tech as a career path?\n\u2753 What do you expect from this role?\n\u2753 Why did you switch your last two companies every 2 years?

\n

\ud83d\udcac Pro Tip: The STAR (Situation, Task, Action, Result) method helps in structuring behavioral answers effectively.

\n

\ud83d\ude80 Key Takeaways & Preparation Tips

\n

\u2705 Master Core JavaScript & Data Structures \u2014 Focus on Recursion, Closures, and Event Loop.\n\u2705 Build Real-World Components \u2014 Strong React.js and Next.js skills are a must.\n\u2705 Understand System Design \u2014 Learn Scalability, Caching, Performance Optimization.\n\u2705 Be Ready for Machine Coding \u2014 Practice building small projects like Navbar, Modals, and Dashboards.\n\u2705 Prepare for Behavioral Questions \u2014 Your communication & decision-making skills matter!

\n

\ud83c\udfaf My Advice:\nIf you're aiming for top product-based companies, focus on a well-rounded approach \u2014 from DSA & System Design to Frontend Best Practices. \ud83d\ude80

\n

\ud83d\udd17 Final Thoughts & Resources

\n

The Sense Interview was an insightful experience that tested my problem-solving, system design, and coding skills extensively. If you're preparing for a similar role, practice DSA, JavaScript concepts, and real-world UI challenges.

\n

\ud83d\udcc2 Proof of Authenticity & Real Experiences

\n

Looking for more frontend interviews?

\n

If you are looking for more frontend interviews, you can check out my profile, and there are 28+ interview experiences already shared till now. You can check them as well.

\n

\ud83c\udf41 Follow Me for More!

\n

I am a Senior Frontend Engineer with 5+ years of experience, and I share interview experiences, frontend insights, technical blogs, and tech career tips.

\n

\ud83d\udcbc LinkedIn: Gourav Hammad (25K+ followers)\n\ud83d\ude80 Frontend Army: My Medium Publication (525+ followers)\n\ud83d\udce9 Send me your queries at gourav.hammad.sdbc@gmail.com

\n

If you found this article helpful, feel free to leave a clap \ud83d\udc4f\ud83c\udffb or share your thoughts in the comments \u2014 your support means a lot and helps me continue sharing more experiences like this.

" }, { "title": "Frontend Interview Experience Zepto, Razorpay, Walmart - Medium", @@ -622,9 +399,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "October 12, 2024 Frontend Engineer Interview Experience || 2.5 Recently I interviewed with all these companies for the Role of SDE-1/SDE-II as a Frontend Engineer. Adarsh Gautam 8 min read Download...", "slug": "1-frontend-interview-experience-zepto-razorpay-walmart-medium", - "status": "approved" + "status": "approved", + "formatted_content": "

October 12, 2024

Frontend Engineer Interview Experience || 2.5

Recently I interviewed with all these companies for the Role of SDE-1/SDE-II as a Frontend Engineer.

\"\"

Adarsh Gautam

8 min read

Frontend Engineer Interview Experience || 2.5 years Exp || Zepto, Razorpay, Walmart, Procore, HackerRank, Kotak 811, Fynd, Chalo, Shopflo and Healthify

\n

So here i will be sharing all the Problems, Quizzes, Concepts,etc which were asked to me in all these companies. I will also be sharing the resources which i referred to, during my preparation.

\n
\n

Index

\n
\n
    \n
  1. Quiz Section
    2. \n
  2. DSA Problems asked
    3. \n
  3. Javascript Theoretical Concepts
    4. \n
  4. ReactJs Theoretical Concepts
    5. \n
  5. Js Coding Round Problems
    6. \n
  6. Vanilla Js Machine Coding Problems
    7. \n
  7. ReactJs Machine Coding Round Problems
    8. \n
  8. Hiring Manager Round Problems
    9. \n
  9. Resources which I followed
    10. \n
\n
\n

A. Quiz Section (Yes some companies did ask quizzes too!) :

\n
\n
    \n
  1. https://www.geeksforgeeks.org/puzzle-50-red-marbles-and-50-blue-marbles/
    2. \n
  2. https://www.geeksforgeeks.org/puzzle-9-find-the-fastest-3-horses/
    3. \n
  3. https://www.geeksforgeeks.org/puzzle-10-identical-bottles-pills/
    4. \n
  4. https://www.geeksforgeeks.org/puzzle-1000-light-bulbs-switched-on-off-by-1000-persons-passing-by/
    5. \n
\n
\n

B. DSA Problems asked:

\n
\n
    \n
  1. https://www.geeksforgeeks.org/anagram-substring-search-search-permutations/
    2. \n
  2. https://www.geeksforgeeks.org/perfect-sum-problem-print-subsets-given-sum/
    3. \n
  3. https://leetcode.com/problems/combination-sum-ii/description/
    4. \n
  4. https://leetcode.com/problems/capacity-to-ship-packages-within-d-days/description/
    5. \n
  5. https://leetcode.com/problems/shortest-bridge/description/
    6. \n
  6. https://leetcode.com/problems/symmetric-tree/description/
    7. \n
  7. https://leetcode.com/problems/word-ladder/description/
    8. \n
  8. https://leetcode.com/problems/edit-distance/description/?envType=problem-list-v2&envId=dynamic-programming
    9. \n
  9. https://leetcode.com/problems/longest-substring-without-repeating-characters/description/
    10. \n
  10. https://leetcode.com/problems/maximum-subarray/description/
    11. \n
  11. https://www.geeksforgeeks.org/multiply-large-numbers-represented-as-strings/
    12. \n
\n
\n

C. Javascript Theoretical Concepts asked:

\n
\n
    \n
  1. Hoisting
    2. \n
  2. Closures
    3. \n
  3. Callback and Promises
    4. \n
  4. Function Scope and Block Scope
    5. \n
  5. Scope and Scope Chain -> var, let and const
    6. \n
  6. Lexical Environment
    7. \n
  7. Destructuring in arrays and objects
    8. \n
  8. Call, Apply, Bind
    9. \n
  9. Event Loop, Callback Queue and Microtask Queue
    10. \n
  10. Constructor Functions
    11. \n
  11. IIFE (Immediately Invoked Function Expressions)
    12. \n
  12. Currying
    13. \n
  13. Event Bubbling
    14. \n
  14. Prototype property
    15. \n
  15. this keyword
    16. \n
  16. Async-Await
    17. \n
  17. Callback Hell
    18. \n
  18. Promise Chaining
    19. \n
  19. window Object
    20. \n
  20. try catch finally
    21. \n
  21. Scope in Arrow functions
    22. \n
  22. Call Stack
    23. \n
  23. Temporal Dead Zone
    24. \n
\n
\n

D. ReactJs Theoretical Concepts asked:

\n
\n
    \n
  1. Lifecycle Methods
    2. \n
  2. Reconciliation Algorithm
    3. \n
  3. Virtual Dom and Real Dom
    4. \n
  4. useEffect, useRef, useCallback, useState and useContext Hooks
    5. \n
  5. Lazy Loading Techniques
    6. \n
  6. State Management Techniques
    7. \n
  7. Perfomance Optimization Techniques
    8. \n
  8. Memoization techniques
    9. \n
  9. JSX
    10. \n
  10. Working of Redux
    11. \n
  11. uses of Ref
    12. \n
  12. Css Styling techniques
    13. \n
  13. How to avoid className clashes in CSS Styling
    14. \n
  14. How can you optimize a Select Dropdown, in which options are populated from a Paginated API.
    15. \n
  15. Error Boundary
    16. \n
\n
\n

E. Js Coding Round Problems asked:

\n
\n
    \n
  1. Implement Debounce Function in JS : Solution
    2. \n
  2. Implement Throttle Function in JS : Solution
    3. \n
  3. Implement Curry Function : Link
    4. \n
  4. Implement a Custom Prototype method for Strings in js. This method when invoked using a string, should console \"Hello, {string}\". Solution
    5. \n
  5. Write a function to deep clone an object, considering nested objects and arrays.
    6. \n
  6. Create a Custom Event Emitter. This Method will expose two methods \"on\" and \"emit\". \"On\" will be used to register functions on an \"event\" and \"emit\" will be used to trigger all the functions registered to a particluar event. Solution
    7. \n
  7. Create a function that takes an array of promises and executes them sequentially, returning a single promise that resolves when all have been completed. Solution
    8. \n
  8. Implement \"Promise.all\" method. Solution
    9. \n
  9. Create a function to flatten an array of arbitrary depth using Array.prototype.reduce. Solution
    10. \n
  10. Output Problems on \"Promises\", \"Promise methods all, race, allSettled and any\", \"Constructor Functions\", \"Arrow functions scope\", \"setTimeout\", \"this\" in global scope and inside a function, \"call, apply and bind\", \"Hoisting\", \"Closures\", \"Prototypes\", \"Type Coercion\", \"try-catch-finally blocks\", \"block scope\", \"function scope\", \"Shadowing in let, const and var\", \"IIFE\", \"null, undefined and false\", \"callback functions\", \"Async-await\", \"then-catch chaining in promises\" and \"Currying\".
    11. \n
\n
\n

F. Vanilla Js Machine Coding Problems asked:

\n
\n
    \n
  1. Develop Tabs UI using Html, Css and Js only. There can be multiple Tabs, and on click of a Tab, the particular Tab Component should be visible. Solution
    2. \n
  2. Create a custom toggle switch UI. The Switch, will have on/off feature. Depending on its state, its color will change. Also during toggle show a toggling css effect. Solution
    3. \n
  3. Develop a To-Do List App using Html, Css and Js only. It will have an Input at the top an \"Add\" button next to it, below them will bea list of To-Dos having Remove button next to each of them. Also save the to-do list items in Localstorage. Solution
    4. \n
  4. Create a Textarea UI with a character limit that updates the character count in real time. Once the limit is reached, prevent additional input. Solution
    5. \n
  5. Develop a Calculator App using Html, Css and Js only. It should support basic operations like addition, substraction, multiplication and division between two numbers. Solution
    6. \n
  6. Develop a Stopwatch UI with start, stop, and reset functionality. Solution
    7. \n
  7. Create an Accordion UI. In this there will be multiple headers, and besides each of them there will be a button \"show\". Upon clicking \"show\" for a particular header, a panel will be visible for that particular header just below it. Once panel is visible, \"show\" will be replaced by \"Hide\", and upon clicking of that the \"Panel\" is hidden again. Solution
    8. \n
  8. Develop a Progress Bar App. This app shows progress bar, a button will be present which when clicked should start showing progress in the bar also percentage of the progress should be shown till its completed. Solution
    9. \n
  9. Create a Dropdown List UI, show options in the list and upon selection of a Item, show that item at the top and remove from the list. The selected Item, if removed will again be present inside the dropdown list. Solution
    10. \n
  10. Create a UI, in which JSON data will be fetched from an API and then dynamically create an HTML table based on that data. Solution
    11. \n
  11. Create a Drag and Drop List UI, in this add drag-and-drop functionality to rearrange items in a list. Solution
    12. \n
\n
\n

G. ReactJs Machine Coding Round Problems:

\n
\n
    \n
  1. Write a Custom Hook \"useLocalStorage\", to store as well as get data from localStorage API. Solution
    2. \n
  2. Create a custom hook \"useFetch\" that fetches data from an API endpoint and handles the loading, error, and success states. Solution
    3. \n
  3. Implement data polling to periodically fetch updated data from an API and refresh the view in real-time. Solution
    4. \n
  4. Use React Suspense and React.lazy to fetch data and lazy-load components with a fallback UI while loading. Solution
    5. \n
  5. Implement a Custom Tabs Component. There can be multiple Tabs, and on click of a Tab, the particular Tab Component should be visible. Solution
    6. \n
  6. Implement a Modal component that opens and closes upon user actions. This component will have a button \"Show\", upon clicking of which a Modal opens. The Modal, will have \"Close\" button which closes the modal on click. The modal can also be closed, when clicked outside the Modal component. Solution
    7. \n
  7. Implement a Stopwatch App. The App will have 4 button \"Reset\", \"Pause\", \"Start\" and \"Resume\". At the top we will have a time text. Initially when the time is 0. \"Reset\", \"Pause\" and \"Resume\", will not be visible. After the timer starts, \"Start\" will be hidden and \"Reset\" and \"Pause\" should be visible. If we click on \"Pause\", then \"Pause\" should be replaced by \"Resume\" and vice-versa. If we click on \"Reset\", then the text should become 0 and only \"Start\" will be visible. The timer should show the time in seconds. Solution
    8. \n
  8. Create an error boundary component that catches JavaScript errors anywhere in the app and displays a fallback UI. Solution
    9. \n
  9. Write test cases to test a UI Component, having a button. Show an alert when the button is clicked, through Snapshot tests. Solution
    10. \n
  10. Develop a To-Do List App. It will have an Input at the top an \"Add\" button next to it, below them will be a list of To-Dos having \"Edit\" and \"Remove\" button next to each of them. On click of \"Edit\", we can edit the item and \"remove\" will remove the item. Use localstorage to store the To-Do list items, and fetch it from there upon page reload. Solution
    11. \n
  11. Develop a Shopping Cart App. This App will only have a simple UI, containing a List of Items, and then a button \"Add\" will be present besides each item, to add items to the Cart. There will be a list of Cart items, and besides each item will have a \"Remove\" button to remove it from cart. Also manage the number of times a particular item is added into the cart. Solution
    12. \n
  12. Develop a Transfer Component App. There will be two boxes, initially only one box will contain all the items along with a button besides each item. On clicking of that button that item should go into the other box. In the other box also, the item will be displayed along with a button besides it.
    13. \n
  13. Create a Dropdown Component with multi-select functionality and search filtering. Multiple options in the dropdown can be selected. Selected items would appear on the top, with a cross mark after each item. On click of cross button, the selected item will be removed. Solution
    14. \n
  14. Create a Book Search App. The app will have a Input and a button \"Search\", which will be used to search for books. A paginated api will be given, and upon input of each text the api should be called and the responses should be shown in a list below the input. Also, we can select a particular book and add it into a cart. The search should happen on both clicking of the \"Search\" as well as on \"Press Enter\". For optimization, debounce the search API, so that the search happens only after a particular interval after the user input finishes.
    15. \n
  15. Develop an Infinite scrolling App. This app displays a list of items which are fetched from a given paginated API. When the user scrolls down more data is fetched based on the pagination payload. Solution
    16. \n
  16. Develop a Search Input App that provides real-time search suggestions as the user types, pulling data from a given API. The suggestions will be given in a dropdown list in the input, and once an item is selected from the dropdown, it should appear in the Input box. Solution
    17. \n
\n
\n

H. Hiring Manager Round Problems:

\n
\n
    \n
  1. Introduce yourself.
    2. \n
  2. Tell me about your project in your current company.
    3. \n
  3. Which UI Architecture you follow in your current UI project repository?
    4. \n
  4. What is a difference between HLD and LLD in Frontend Engineering.
    5. \n
  5. Suppose there is a conflict of ideas between you and another member of your team, regarding a project. So how will you move forward in this case, what will be your approach. Also there is a time constrain to deliver that project, so you should act fast.
    6. \n
  6. What are the factors, you consider for a new project in terms of \"HLD\" as well as \"LLD\".
    7. \n
  7. Do you know about \"Atomic Design\" in UI components management ? Solution
    8. \n
  8. How can you optimize an App, given app is taking a lot of time on its first load for new users. What steps will you follow ?
    9. \n
  9. How do you prioritize your tasks and estimate the timelines for a particular task. What factors effect your decision ?
    10. \n
  10. Can you explain, the most complex problem you have solved in your current project, what was the exact problem, how did you overcame it, what approach you took ?
    11. \n
  11. Difference between 2-tier and 3-tier Architectures. Solution
    12. \n
  12. For pagination purpose, which one you deem better \"Page number Pagination\" or \"Infinite Scrolling\" and why?
    13. \n
  13. Discuss \"HLD\" of an E-Commerce App. Also include \"LLD\" if possible.
    14. \n
  14. Did you delivered any project which was entirely handled by you, how did you understood and laid down the requirements in the Project, how much story points and timeline you estimated and factors you took into account for doing this.
    15. \n
  15. What are the different patterns of State Management in React Projects and which one you prefer ? Solution
    16. \n
  16. What is the development lifecycle you follow in your current project ?
    17. \n
  17. Describe your day to day tasks as a Software Engineer.
    18. \n
  18. What are some of the http methods and api status codes. Solution
    19. \n
  19. Which one do you think is better \"Monolithich Architecture\" or \"Microservices Architecture\" ? Solution
    20. \n
  20. We are a fast paced startup our core business is the 10-min delivery app. Due to which we need Software Engineers who should be available at most of the times, since during events such as rains, storm, any festival, etc. We immediately need to add some UI changes, such as showing a Banner, some message, festival designs or a warning. For this we need your availability at all times. So will you be able to manage this?
    21. \n
\n
\n

I. Resources which I followed:

\n
\n
    \n
  1. Javascript : https://javascript.info/
    2. \n
  2. Namaste Javascript Notes : Link
    3. \n
  3. Namaste JS playlist : Season 1, Season 2
    4. \n
  4. To Understanding JS Coding Problems : Link
    5. \n
  5. To practice JS, React, CSS-HTML problems and quizzes \u2014 https://bigfrontend.dev/
    6. \n
  6. Some Machine Coding Round Interview Questions with solutions \u2014 Link
    7. \n
  7. Handbook which contains all the tools required for JS UI Machine Coding Problems : Link
    8. \n
  8. Understanding Frontend System Design : Link
    9. \n
  9. CodeSandbox UI System Design : Link
    10. \n
  10. Icons Component in ReactJs : Link
    11. \n
  11. Tool to Visualize Scopes in Js : https://jsbubbl.es/bubbles
    12. \n
  12. JS visualizer to visualize \"Call Stack\", \"Event Loop\", \"Callback Queue\" and \"Microtask Queue\" : https://www.jsv9000.app/
    13. \n
" }, { "title": "Dream11 \u2013 SDE2 \u2013 Frontend Interview Experience", @@ -636,9 +414,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Visit learnersbucket.com If you are preparing for your Javascript interview. I have written solutions for more than 300+ solved algorithms and implementation of all important data structures in JS. I...", "slug": "3-dream11-sde2-frontend-interview-experience", - "status": "approved" + "status": "approved", + "formatted_content": "

\"Dream11

\n\n
\n

Visit learnersbucket.com If you are preparing for your Javascript interview. I have written solutions for more than 300+ solved algorithms and implementation of all important data structures in JS.

\n
\n\n

I had applied on Dream11 career section for SDE2 Frontend position in March 2021.

\n\n

\n \n \n Round 1: Hacker rank test\n

\n\n

3 questions to be solved in 90 minutes.

\n\n\n\n

\n \n \n Round 2: DSA\n

\n\n\n\n

\n \n \n Round 3: Platform round (Javascript)\n

\n\n
    \n
  • Implement a function onlyTwice which stores two instances a function invocation and returns first on odd calls and second on even calls.
    • \n
\n\n

It was based on singleton design pattern.
\n

\n\n
\n
const addTwoNumbers = (a, b) => a + b\nconst myFancyAdd = onlyTwice(addTwoNumbers)\n\nconsole.log(myFancyAdd(2, 3)) // 5\nconsole.log(myFancyAdd(1, 2)) // 3\nconsole.log(myFancyAdd(3, 4)) // 5\nconsole.log(myFancyAdd(3, 7)) // 3\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

\n \n \n My answer\n

\n\n\n\n
\n
const onlyTwice = (fn) => {\n  let isOdd = true;\n  let first = null;\n  let second = null;\n\n  return function(...args) {\n\n    if(isOdd){\n      if(!first){\n        first = fn(...args);\n      }\n\n      isOdd = false;\n      return first;\n    }else{\n      if(!second){\n        second = fn(...args);\n      }\n\n      isOdd = true;\n      return second; \n    }\n  }\n}\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n
    \n

  • Create throttle function.

    • \n

  • Create a polyfill for promise which should handle following edge cases.
    \n

    • \n
\n\n
\n
const prom = new MyPromise((resolve, reject)=>{\n  setTimeout(() => {\n    resolve(\"Done\");\n  }, 1000);\n});\n\n\nprom.then(function(data){\n  console.log('1' + data) // Prints \"1 Done\" after 1 second\n})\n\nprom.then(function(data){\n  console.log('2' + data) // Prints \"2 Done\" after 1 second\n})\n\nsetTimeout(function(){\n  prom.then(function(data){\n    console.log('3' + data) // Prints \"3 Done\" after 2 seconds\n  })\n}, 2000)\n\n\nconst nwPromise = new Promise(()=>{\n  xhr.send();\n\n  xhr.onReadyStateChange = (data)=> {\n    resolve(data)\n  } \n\n  xhr.abort()\n})\n\nnwPromise.cancel()\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

\n \n \n My code\n

\n\n\n\n
\n
const MyPromise = function(fn){\n  // Code here\n\n  let result = null;\n  let error = null;\n  let thenCallBackFunction = [];\n  let resolveState = 0;\n\n  const resolve = (data) => {\n    resolveState = 1;\n\n    result = data;\n    if(thenCallBackFunction.length > 0){\n      for(let fn of thenCallBackFunction){\n        fn(data);\n      }\n\n      thenCallBackFunction = [];\n    }\n\n    resolveState = 0;\n  }\n\n  const reject = (error) => {\n    error = error;\n  }\n\n  this.then = (fn2) => {\n    if(!result){\n      thenCallBackFunction.push(fn2);\n    }else{\n      fn2(result);\n    }\n  }\n\n  this.catch = (errorFn) => {\n    errorFn(error);\n  }\n\n  this.cancel = (cancelFn) => {\n    if(resolveState === 0){\n\n    }\n  }\n\n  fn(resolve, reject);\n}\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

I did not implemented the .cancel() as there was no time left.

\n\n

\n \n \n Round 4: System design\n

\n\n

Given the following API endpoints create a book reader.
\n

\n\n
\n
/books (List of books with book IDs)\n/book/:book_id/page_count (Returns page count for the requested book)\n/book/:book_id/page/:page_number (Returns content for the requested page in RTE)\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n
    \n
  • It will show the list of books
    • \n
  • On click open the selected book
    • \n
  • Scroll to the next page (no pagination)
    • \n
\n\n

Lots of cross question on

\n\n
    \n
  • Handle latency
    • \n
  • Debounce
    • \n
  • Direct jump to random page
    • \n
  • Caching pages
    • \n
  • Pre-loading data
    • \n
  • Buffer zone
    • \n
  • Optimization.
    • \n
\n\n

I failed in the final in this round as the interviewer asked me that if I use debounce (2ms) to load the next page and consider that you are on a 2g network and there is delay of 10ms for response then how will you handle it. I got stuck here.

\n\n

Also he asked me that suppose your RAM will be able to store only 20 pages at a time then how would you jump to 300th page from the 100th page, when will you make the api call to fetch the page, will you show blank page or not, your scroll should end at 300th page, etc, etc.

\n\n" }, { "title": "\ud83d\udcbc Zepto Frontend Engineer Interview Experience \u2014 40LPA", @@ -650,23 +429,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Company Logo May 15, 2025 \ud83d\udcbc Zepto Frontend Engineer Interview Experience \u2014 40LPA This was my very first interview after CARS24, and it turned out to be a rewarding experience with tons of learning....", "slug": "5-zepto-frontend-engineer-interview-experience-40lpa", - "status": "approved" - }, - { - "title": "My Interview Experience with Paytm Money \u2014 Frontend Developer Role", - "original_url": "https://medium.com/@phalgun99/my-interview-experience-with-paytm-money-frontend-developer-role-aeb332e5a4bc", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:49.068356", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "3-my-interview-experience-with-paytm-money-frontend-developer-role", - "status": "approved" + "status": "approved", + "formatted_content": "
\"Post
Company Logo

May 15, 2025

\ud83d\udcbc Zepto Frontend Engineer Interview Experience\u200a\u2014\u200a40LPA

This was my very first interview after CARS24, and it turned out to be a rewarding experience with tons of learning. I\u2019d love to share the\u2026

\"\"

Gourav Hammad

3 min read

\ud83d\ude80 My Zepto Frontend Interview Experience | 40 LPA | SDE-2 Frontend

\n

This was my very first interview after CARS24, and it turned out to be a rewarding experience with tons of learning. I'd love to share the rounds, technical problems, takeaways, and what led to the final verdict.

\n

\ud83d\udeaa Introduction

\n

After gaining solid experience at CARS24, I decided to test the waters and explore new opportunities. Zepto, being one of the fastest-growing instant delivery startups, caught my attention due to its exciting scale and frontend complexity. The interview process was sharp, focused, and packed with hands-on problem-solving, testing my performance skills and depth in ReactJS and JavaScript.

\n

\ud83e\uddea Round 1 \u2014 Problem Solving + JavaScript + React Fundamentals

\n

This round combined theory, logic, and real-world scenarios.

\n

\ud83d\udd0d 1. Performance-Based Web Questions

\n
    \n
  • How SSR help in performance?
    • \n
  • What is bundle splitting and lazy loading?
    • \n
  • How to reduce TTI (Time to Interactive)?
    • \n
\n

\ud83d\udcdd Tip: Always revise web vitals like FCP, TBT, TTI, and CLS before interviews.

\n

\ud83e\udde9 2. Breadcrumb Chain Problem (Tree Traversal)

\n

Problem:\nGiven the below breadcrumb array, generate the complete hierarchy starting from the root:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const breadCrum = [\n  { id: 3, parentId: 12, title: \"Headphones\" },\n  { id: 19, parentId: 28, title: \"True wireless\" },\n  { id: 28, parentId: 3, title: \"Wired\" },\n  { id: 12, parentId: null, title: \"Audio\" },\n  { id: null, parentId: 19, title: \"Bluetooth\" }\n];
\n\t\t\t\t\t\t\t
const breadCrum = [\n  { id: 3, parentId: 12, title: \"Headphones\" },\n  { id: 19, parentId: 28, title: \"True wireless\" },\n  { id: 28, parentId: 3, title: \"Wired\" },\n  { id: 12, parentId: null, title: \"Audio\" },\n  { id: null, parentId: 19, title: \"Bluetooth\" }\n];
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

Expected Output:

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Audio >> Headphones >> Wired >> True wireless >> Bluetooth
\n\t\t\t\t\t\t\t
Audio >> Headphones >> Wired >> True wireless >> Bluetooth
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\u2705 Approach: Use a recursive or iterative path-building mechanism with a Map of id \u2192 node.

\n

\u23f1\ufe0f 3. Output of setTimeout and setInterval

\n

\ud83d\udca1 Questions revolved around:

\n
    \n
  • How JavaScript timers work.
    • \n
  • Event loop and call stack behavior.
    • \n
  • Order of execution in asynchronous code.
    • \n
\n

\ud83d\udd01 4. useMemo() vs useCallback()

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
// useMemo - Caches a computed value\nconst memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);\n// useCallback - Caches a function reference\nconst memoizedCallback = useCallback(() => handleSubmit(data), [data]);
\n\t\t\t\t\t\t\t
// useMemo - Caches a computed value\nconst memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);\n// useCallback - Caches a function reference\nconst memoizedCallback = useCallback(() => handleSubmit(data), [data]);
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\ud83e\udde0 Remember:

\n
    \n
  • useCallback is used for function identity (passing to child components).
    • \n
  • useMemo is for caching results of expensive computations.
    • \n
\n

\ud83e\udde9 5. Programmatically Add Event Listener

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
useEffect(() => {\n  const handleResize = () => console.log(\"Resized\");\n  window.addEventListener(\"resize\", handleResize);\n  return () => window.removeEventListener(\"resize\", handleResize);\n}, []);
\n\t\t\t\t\t\t\t
useEffect(() => {\n  const handleResize = () => console.log(\"Resized\");\n  window.addEventListener(\"resize\", handleResize);\n  return () => window.removeEventListener(\"resize\", handleResize);\n}, []);
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\ud83c\udfaf 6. What is useRef()?

\n

useRef is used for:

\n
    \n
  • Accessing DOM elements directly.
    • \n
  • Storing mutable variables that don't trigger re-render.
    • \n
\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const inputRef = useRef(null);\n<input ref={inputRef} />
\n\t\t\t\t\t\t\t
const inputRef = useRef(null);\n<input ref={inputRef} />
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\u2699\ufe0f Round 2 \u2014 Machine Coding Round + Advanced JS + ReactJS Internals

\n

This round was intense and hands-on.

\n

\ud83e\uddea 1. ProgressBar Queue Problem

\n

Task:

\n
    \n
  • On clicking a button, add a progress bar.
    • \n
  • Each bar increases by 10% every second.
    • \n
  • Max 3 progress bars can run simultaneously.
    • \n
  • The remaining ones should wait in a queue.
    • \n
\n

\ud83d\udca1 Tip:\nUse setInterval, async queue, and React useState / useEffect.

\n

\ud83d\udd01 Bonus if you used a task manager or concurrency limiter pattern.

\n

\u2699\ufe0f 2. React App Optimization (SSR & CSR)

\n
    \n
  • Code splitting
    • \n
  • Image optimization
    • \n
  • Preloading & Prefetching
    • \n
  • Memoization
    • \n
  • Lazy loading and hydration for SSR
    • \n
\n

\ud83c\udf00 3. What are Portals in React?

\n

ReactDOM.createPortal(child, container)\nUsed to render elements outside the DOM hierarchy, e.g., modals or tooltips.

\n

\ud83e\uddee 4. Repaint vs Reflow (Rework)

\n
    \n
  • Repaint: A style is changed, but the layout remains the same (e.g., color).
    • \n
  • Reflow: DOM layout changes (e.g., width, padding, position).
    • \n
\n

\ud83e\udde0 Performance Note: Minimize reflows for optimal rendering.

\n

\ud83e\uddf5 5. Parallel API Calls with Promise.allSettled()

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
Promise.allSettled([api1(), api2(), api3()]).then(results => {\n  // Handle all - even rejected\n});
\n\t\t\t\t\t\t\t
Promise.allSettled([api1(), api2(), api3()]).then(results => {\n  // Handle all - even rejected\n});
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\u2705 Good for dashboards or systems where some APIs can fail silently.

\n

\ud83d\udcca 6. Sorting Algorithm of Array.sort()

\n

JavaScript uses Timsort (merge + insertion sort).

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
[1, null, 5, 2, undefined].sort()\n// Converts to strings: [1, 2, 5, null, undefined]
\n\t\t\t\t\t\t\t
[1, null, 5, 2, undefined].sort()\n// Converts to strings: [1, 2, 5, null, undefined]
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\ud83d\uddb1\ufe0f 7. Cancel API Calls on Rapid Clicks

\n
    \n
  • Use AbortController or debounce logic to cancel in-flight requests.
    • \n
\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const controller = new AbortController();\nfetch(url, { signal: controller.signal });\ncontroller.abort(); // Cancels request
\n\t\t\t\t\t\t\t
const controller = new AbortController();\nfetch(url, { signal: controller.signal });\ncontroller.abort(); // Cancels request
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\u267e\ufe0f 8. Infinite Scroll in ReactJS

\n
    \n
  • Listen to the scroll event or use IntersectionObserver
    • \n
  • Load the next batch once the bottom is visible
    • \n
\n

\ud83e\udde0 9. HOC in ReactJS

\n

Higher Order Component \u2014 A function that takes a component and returns a new one.

\n\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t
const withAuth = Component => props => {\n  return isAuthenticated ? <Component {...props} /> : <Redirect />;\n};
\n\t\t\t\t\t\t\t
const withAuth = Component => props => {\n  return isAuthenticated ? <Component {...props} /> : <Redirect />;\n};
\n\t\t\t\t\t\t
\n\t\t\t\t\t\n

\u274c Verdict: Rejected in Round 2

\n

Though the interview was educational, I was rejected because I couldn't complete the ReactJS machine coding question within the time limit. I over-engineered my solution, focusing too much on modularity and edge cases, which led to a time crunch.

\n

\ud83c\udfaf Key Takeaways

\n
    \n
  • Focus on completing the base requirement first, then optimize.
    • \n
  • Time-box your approach: 70% build, 30% test/optimize.
    • \n
  • Practice concurrency patterns and real-world problems like queues and debouncing.
    • \n
\n

\ud83d\udd1a Final Thoughts

\n

Every interview \u2014 whether cleared or not \u2014 gives you a better edge for the next one. Zepto's process was rigorous but fair. It motivated me to sharpen\nmy machine coding speed and practical problem-solving mindset.

\n

\ud83d\udcc2 Proof of Authenticity & Real Experiences

\n

Looking for more frontend interviews?

\n

If you are looking for more frontend interviews, you can check out my profile, and there are 28+ interview experiences already shared till now. You can check them as well.

\n

\u26a0\ufe0f Disclaimer: The views and opinions shared in this post are solely my own and based on past experiences. They do not reflect the views of my current organization in any way.

\n

\ud83c\udf41 Follow Me for More!

\n

I am a Senior Frontend Engineer with 5+ years of experience, and I share interview experiences, frontend insights, technical blogs, and tech career tips.

\n

\ud83d\udcbc LinkedIn: Gourav Hammad (25K+ followers)\n\ud83d\ude80 Frontend Army: My Medium Publication (525+ followers)\n\ud83d\udce9 Send me your queries at gourav.hammad.sdbc@gmail.com

\n

If you found this article helpful, feel free to leave a clap \ud83d\udc4f\ud83c\udffb or share your thoughts in the comments \u2014 your support means a lot and helps me continue sharing more experiences like this.

" }, { "title": "Frontend Interview Experience at Amazon Germany", @@ -678,9 +444,10 @@ "frontend", "interview" ], - "summary": "", + "summary": "Visit learnersbucket.com If you are preparing for your JavaScript interview. You will find DSA, System Design and JavaScript Questions. After applying at Amazon India through different means and not...", "slug": "3-frontend-interview-experience-at-amazon-germany", - "status": "approved" + "status": "approved", + "formatted_content": "

\"Frontend

\n\n
\n

Visit learnersbucket.com If you are preparing for your JavaScript interview. You will find DSA, System Design and JavaScript Questions.

\n
\n\n

After applying at Amazon India through different means and not hearing back from them, I one day randomly applied at Amazon Germany for frontend role directly in the career section and luckily my resume got shortlisted.

\n\n
\n

Note:- As I have signed an NDA, I cannot share the exact questions.

\n
\n\n

I received the email regarding the shortlist and was asked to fill availability for the phone screen.

\n\n

\"Shortlisting

\n\n

\n \n \n 1st round : Phone Interview.\n

\n\n

\"Phone

\n\n

It was scheduled on 14th June and I had a general discussion with the technical recruiter regarding what I do on a day to day basis followed by a behavioral question and after that he asked me if I was willing to relocate and what are my salary expectations, etc.

\n\n

He said that your final interview will be scheduled only after your second round goes well.

\n\n

\n \n \n 2nd round: Phone screen with Manager.\n

\n\n

\"2nd

\n\n

The second round was on 2nd July and it was taken by the manager. He asked me to create a web component followed by lots of questions and changes and one CSS styling question. At the end there was a behavioral question.

\n\n

After that he said will you relocate or work from India?. We are looking for a team member to join us here.

\n\n

\n \n \n 3rd & Final round\n

\n\n

It was composed of 5 technical rounds to be done on a single day. The decided date was 28th of July.

\n\n

I was very nervous before this as I knew I am not well prepared.

\n\n

\n \n \n 3.a:- OOPs (Backend engineer with 9+ years of experience) (same team).\n

\n\n

We had a formal introduction followed by one behavioral question and then an oops question, In the end there were two more behavioral questions.

\n\n

The implementation had to be scalable, otherwise it does not meets the criteria of the question.

\n\n

This round did not go well because I haven\u2019t prepared for OOPS.

\n\n

My confidence took a toll.

\n\n

\n \n \n 3.b:- Frontend (Frontend engineer 5+ years of experience) (same team).\n

\n\n

I was asked to create a component, followed by lots of questions on accessibility, styling, events, etc.

\n\n

In the end 3 behavioral questions.

\n\n

Finished this round in half an hour, It went superb. Boosted my confidence.

\n\n

\n \n \n 3.c:- Cultural fit (BI data engineer) (different team).\n

\n\n

Taken by an external team member for unbiased opinion. Solely based on behavioral questions, 6 of them.

\n\n

All were very different, Had to think about everything I have done in my past experiences and then answer it.

\n\n

It went okay.

\n\n

\n \n \n 3.d:- Managerial (System design) (same team).\n

\n\n

He said let\u2019s start by answering your questions first and then move forward. After that he asked me to implement a frontend system.

\n\n

Discussed the following points

\n\n
    \n
  • Layout
    • \n
  • Styling
    • \n
  • Accessibility
    • \n
  • Performance
    • \n
  • Tracking user activity
    • \n
  • Recommendations
    • \n
  • Preferences
    • \n
\n\n

Followed by 3 behavioral questions.

\n\n

This round went nice, the manager seemed to be happy.

\n\n

\n \n \n 3.e:- DSA (FullStack engineer) (Sister team).\n

\n\n

Was asked to implement a two way algorithm based on trees. Tree to HTML and HTML to Tree parser with lots of constraints.

\n\n

Which tree will you choose, why?. How to differentiate nodes and text, etc.

\n\n

Followed by 3 behavioral questions.

\n\n

This round did not go well, I had tough time understanding the question. After 1st implementation, the interviewer said there is some misunderstanding and explained the question again and asked me to re-implement the solution.

\n\n

After second implementation, he asked me to implement the second parser (vice versa).

\n\n

\n \n \n Verdict.\n

\n\n

NOT SELECTED.

\n\n

The recruiter called me next day and personally gave the feedback, he said there a lots of strong points and push but the team thinks that you need some improvements majorly on writing scalable and maintainable code.

\n\n

The recruiter had already told me to go through leadership principles and STAR technique because you will be grilled a lot on that.

\n\n

I was already hesitant that I won\u2019t be able to make it. Still I did my best.

\n\n

\n \n \n My strength\n

\n\n
    \n
  • Frontend components.
    • \n
  • System design.
    • \n
\n\n

\n \n \n My weakness\n

\n\n
    \n
  • OOPs
    • \n
  • DSA
    • \n
  • Behavioral questions.
    • \n
\n\n

I have noted where I have to improve and will work on it.

\n\n

Long way to go. Life long learning. Keep Hustling \ud83e\udd1e.

\n\n

PS:- I have 5 more interview experiences which I will share in the coming weeks.

\n\n" }, { "title": "My Frontend Developer Interview Experience at Redisolve Technologies (23.06.2025", @@ -692,50 +459,9 @@ "frontend", "interview" ], - "summary": "", + "summary": "Hi Friends!! On 23rd June 2025, I attended an interview for the position of Frontend Developer at Redisolve Technologies . It was a good learning experience where I was asked important frontend...", "slug": "5-my-frontend-developer-interview-experience-at-redisolve-technologies-23062025", - "status": "approved" - }, - { - "title": "Frontend Interview Experience", - "original_url": "https://vishalyadav.hashnode.dev/frontend-engineer-interview-experience-at-fynd", - "source": "hashnode", - "author": "Web Author", - "published_at": "2026-06-09T03:43:50.689244", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "2-frontend-interview-experience", - "status": "approved" - }, - { - "title": "Frontend Interview Experience at Healthify", - "original_url": "https://jaynil-gaglani.hashnode.dev/frontend-interview-experience-at-healthify", - "source": "hashnode", - "author": "Web Author", - "published_at": "2026-06-09T03:43:50.689278", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "4-frontend-interview-experience-at-healthify", - "status": "approved" - }, - { - "title": "React Interview Experience (August 2025): Accenture (Part ...", - "original_url": "https://medium.com/codetodeploy/react-interview-experience-august-2025-accenture-part-1-03e4e95c66ac", - "source": "medium", - "author": "Web Author", - "published_at": "2026-06-09T03:43:53.034154", - "tags": [ - "frontend", - "interview" - ], - "summary": "", - "slug": "2-react-interview-experience-august-2025-accenture-part", - "status": "approved" + "status": "approved", + "formatted_content": "

Hi Friends!!

\n\n
\n

On 23rd June 2025, I attended an interview for the position of Frontend Developer at Redisolve Technologies. It was a good learning experience where I was asked important frontend concepts.

\n\n

In this blog, I am going to explain all the questions asked in detail with simple words and real examples, so even beginners can understand and learn easily. Let's dive in!

\n
\n\n

1.How to Optimize Webpage for Performance?

\n\n

A website must load fast and smoothly for a good user experience.
\nTo optimize performance, we can compress images (like WebP), minify JS/CSS/HTML, and use lazy loading for images and videos. We can also use a CDN to serve content faster and enable browser caching.

\n\n

Example: Lazy Loading Image
\n

\n\n
\n
<img src=\"image.webp\" loading=\"lazy\" alt=\"Sample Image\">\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

2.How to Handle CORS in JavaScript?

\n\n

CORS (Cross-Origin Resource Sharing) is a browser rule that blocks access to resources from a different origin (domain) unless the server allows it. If the server allows it, it sends this header:
\n

\n\n
\n
Access-Control-Allow-Origin:\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

Example Using fetch:
\n

\n\n
\n
fetch('https://api.example.com/data', { mode: 'cors' })\n  .then(res => res.json())\n  .then(data => console.log(data));\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

3.What is Closure? How does it Work?

\n\n

A closure means an inner function can access variables from the outer function even after the outer function has finished running.
\nClosures are useful to create private variables or remember previous data.

\n\n

Example:
\n

\n\n
\n
function outer() {\n  let count = 0;\n  return function inner() {\n    count++;\n    console.log(count);\n  };\n}\nconst counter = outer();\ncounter(); // 1\ncounter(); // 2\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

4.Client Side Rendering vs Server Side Rendering

\n\n

-Client Side Rendering (CSR): JS builds the page in the browser.
\n-Server Side Rendering (SSR): Page built on server, ready HTML sent to browser.

\n\n

Example:
\n

\n\n
\n
CSR \u2013 React App using Vite.\nSSR \u2013 Next.js App that sends ready HTML.\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

5.How to Manage Version and Collaborate in Git?

\n\n

Git allows teams to work on the same project using branches.
\nDevelopers create branches, commit changes, then merge to main branch.

\n\n

Example:
\n

\n\n
\n
git checkout -b feature-login\ngit add .\ngit commit -m \"Added login feature\"\ngit push origin feature-login\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

6.Explain NPM and Yarn

\n\n

Both are package managers for JavaScript projects.
\nnpm is default with Node.js, while Yarn was made for speed and security.
\nYou can install libraries, update or remove them easily.

\n\n

Example:
\n

\n\n
\n
npm install react\nyarn add react\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

7.How to Debug Frontend Applications?

\n\n

Debugging finds and fixes errors.
\nYou can use console.log(), browser DevTools (Elements, Network, Sources), and breakpoints to check code flow.

\n\n

Example:
\n

\n\n
\n
console.log(\"Debugging here\");\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

8.Synchronous vs Asynchronous in JS

\n\n

Synchronous: Code runs line by line, blocking the next line.
\nAsynchronous: Runs in background (API calls, setTimeout).

\n\n

Example:
\n

\n\n
\n
console.log(\"Start\");\nsetTimeout(() => console.log(\"Async\"), 1000);\nconsole.log(\"End\");\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

9.How Does Event Loop Work in JavaScript?

\n\n

The event loop lets JS handle async operations like setTimeout, promises.
\nSynchronous code runs first; then event loop runs callbacks from queue.

\n\n

Example:
\n

\n\n
\n
console.log('1');\nsetTimeout(() => console.log('2'), 0);\nconsole.log('3');\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

10.Explain CSS Positions: relative, absolute, fixed

\n\n

CSS positions decide how an element is placed in a page.

\n\n

-relative: Moves based on its original place.
\n-absolute: Moves based on the nearest ancestor with position set.
\n-fixed: Stays fixed to the window even during scroll.

\n\n

Example:
\n

\n\n
\n
.relative { position: relative; top: 10px; }\n.absolute { position: absolute; top: 10px; left: 10px; }\n.fixed { position: fixed; bottom: 0; right: 0; }\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

11.What is Media Query?

\n\n

Media queries make your website responsive \u2014 looking good on all devices (mobiles, tablets, desktops).
\nIt changes styles based on screen width or height.

\n\n

Example:
\n

\n\n
\n
@media (max-width: 600px) {\n  body { background: lightblue; }\n}\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

12.What is SPA?

\n\n

SPA (Single Page Application) loads one HTML file and updates content using JavaScript without refreshing the entire page.
\nReact, Angular, Vue are frameworks for SPA.

\n\n

Example: Gmail, Facebook \u2014 no page reloads when you switch tabs or open mails.

\n\n

13.Build Tools: Webpack and Vite

\n\n

Build tools bundle JS, CSS into fewer files to load faster.
\nWebpack is older, heavy but powerful; Vite is faster with modern features.

\n\n

Vite Example:
\n

\n\n
\n
npm create vite@latest\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

14.Difference Between Development and Production

\n\n

Development: Unminified code, full error logs, easy debugging.

\n\n

Production: Minified, optimized, fast loading, errors hidden from users.

\n\n

Example:
\n

\n\n
\n
npm run dev   # Development Mode\nnpm run build # Production Mode\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

15.Difference Between ID and Class in HTML.

\n\n

-ID: Unique, used once (#id).
\n-Class: Can be reused for multiple elements (.class).Example:

\n\n

Example:
\n

\n\n
\n
<div id=\"header\"></div>\n<div class=\"box\"></div>\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

16.How to Use Box Model in CSS?

\n\n

The box model shows how content, padding, border, and margin create space around elements.
\nAdjusting padding/margin controls spacing and layout.

\n\n

Example:
\n

\n\n
\n
div {\n  padding: 10px;\n  border: 1px solid black;\n  margin: 20px;\n}\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

17.Difference: Arrow Function vs Traditional Function

\n\n

Arrow functions are short and do not have their own this.
\nTraditional functions have their own this and can be hoisted.

\n\n

Example:
\n

\n\n
\n
const greet = () => console.log(\"Hello\");\nfunction greetOld() { console.log(\"Hello\"); }\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

18.Explain em, rem, px in CSS

\n\n

-px: Fixed size.
\n-em: Relative to parent element\u2019s font size.
\n-rem: Relative to root (html) font size.

\n\n

Example:
\n

\n\n
\n
html { font-size: 16px; }\np { font-size: 2rem; } /* 32px */\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

19.What are Template Literals?

\n\n

Template literals help write multi-line strings and use variables easily.
\nUse backticks () and ${} to embed expressions.

\n\n

Example:
\n

\n\n
\n
const name = \"Sathish\";\nconsole.log(`Welcome, ${name}!`);\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

20.var, let, const in JavaScript

\n\n

var: Function-scoped, can redeclare.

\n\n

let/const: Block-scoped; const can\u2019t be reassigned.

\n\n

Example:
\n

\n\n
\n
var x = 5; let y = 10; const z = 15;\n
\n
\n
\n Enter fullscreen mode\n \n\n\n Exit fullscreen mode\n \n\n\n
\n
\n
\n\n\n\n

[(https://redisolve.com/)]

\n\n

The End!!

\n\n

This interview helped me revise important frontend concepts like closures, event loop, git, CSS box model, and build tools. These are must-know topics for every frontend developer. I suggest every learner practice these deeply with examples to build strong confidence.

\n\n

Learning never exhausts the mind. Every interview is a new lesson!!.

\n\n" } ] \ No newline at end of file