In this blog post, I will be covering my frontend interview experience at Tekion. Below are the topics that will be covered –
- How did I get an interview call from Tekion?
- Interview Process
- First technical round
- Second technical round
- Frontend system design round
- Results
How did I get an interview call from Tekion?
I actively pursued new career opportunities by regularly applying through various job portals. Consequently, I applied for the Senior Software Engineer position at Tekion through Instahyre. Following this, I received notification from the HR department indicating that my profile had been shortlisted, and they expressed interest in initiating the interview process.
Interview process explanation
The HR representative provided a comprehensive overview of the interview process, delineating the particulars of each of the four rounds. It was emphasized that failure to pass any round would result in the conclusion of the process without progression to subsequent stages. The rounds were structured as follows:
1. Technical Discussion: Emphasizing live coding exercises.
2. Technical Discussion: Focused on fundamental concepts in web development.
3. System Design: Concentrating on constructing a front-end architecture for an application.
4. Managerial Discussion: Centered on assessing cultural alignment, and detailed examination of the resume, among other relevant topics.
First Technical Round
The interviewer promptly joined the scheduled call and established a friendly rapport, facilitating a comfortable environment for our discussion. Following introductions, the focus shifted towards the presented problem statement, which entailed the development of a small React application capable of rendering concentric circles based on input JSON data. The JSON object encompassed various fields such as ID, and color, among others, structured in a hierarchical parent-child format, dictating the arrangement of circles within the React component. Additionally, the solution required dynamic background color changes upon clicking a circle, leveraging a provided function to generate hexadecimal color codes. Crucially, this color change should occur solely within the clicked circle without triggering a full component re-render.
Initially, I encountered challenges in conceptualizing how to render circles nested within each other while maintaining spacing. My attempts with a recursive function proved futile, prompting the interviewer to offer guidance on achieving concentric circles using CSS, employing absolute positioning.
Despite successfully rendering the circles, time constraints prevented fulfillment of the additional requirement. Subsequently, the interviewer outlined the forthcoming requirements and solicited my approach. I proposed implementing the useMemo() hook to optimize rendering upon clicking, a suggestion met with agreement. Furthermore, I addressed concerns regarding the use of multiple useMemo() instances, citing potential performance degradation, which the interviewer acknowledged.
Following the assessment, I was informed by HR of my successful progression through the initial technical round, albeit falling short of personal expectations
Second Technical Round
This phase commenced with a brief introductory exchange, wherein the interviewer expressed their objective to evaluate my comprehension of JavaScript fundamentals and advanced concepts. The initial task involved implementing a custom Event emitter, synonymous with the Pub-Sub model. Promptly addressing this challenge, I swiftly developed the solution. Subsequently, the interviewer sought enhancements, particularly regarding the implementation of the Unsubscribe function, which I promptly incorporated. Following this, a brief discussion ensued regarding the solution’s intricacies.
Then he asked about the JS concepts like Event loop, Hoisting, etc, and how they work behind the scenes. I explained that pretty well.
The final question he asked me was to write a polyfill of Promise.all with some additional requirements. I provided that too within the given time. The interviewer posed supplementary inquiries to validate the robustness of the solution, ultimately expressing satisfaction with the outcome.
At the conclusion of this round, I received affirmative feedback from HR indicating my advancement to the subsequent stage of the evaluation process.
Frontend System Design
In this round, the interviewer asked me to design the frontend architecture for a Twitter Feed. I started by listing down the functional and non-functional requirements. The scope we finalized was to Create new tweets, the ability to like a tweet, the ability to display tweets, and the ability to comment on a tweet. Then we had a deep discussion on non-functional requirements like SSR/CSR, internationalization, localization, testing, etc. I got confused between internationalization and localization should not have been done.
My approach was not to use SSR as we didn’t require it but the interviewer did not agree with my point. My idea of not using the SSR because I thought that the tweets should be refreshed in some interval of time (SSR provides the initial data) and SEO is not required for a feed, but SSR could have been a good idea to render the first set of tweets to optimize the page load time. I think at this point the interviewer lost interest.
For the tech stack, I proposed the idea of using React, Typescript, and Zustand(Global state management tool). The interviewer assumed that I didn’t mention about FCP, LCP, Layout shifts, etc, but I mentioned taking care of Core web vital as a whole, I think it was miscommunicated so the interviewer didn’t get my point. Following them, we discussed pagination strategies and I proposed the idea of infinite scroll and fetching the number of tweets within a page size limit but the interviewer countered with the idea of page number-based fetching, i.e, a fixed number of items can be pulled with every page number and we don’t have to mention the start and end index of the items. This approach also sounded fine.
Then we discussed performance optimization techniques like Virtualization, he asked If I knew how to implement the same without using an external library(React Window), I was not able to recall the implementation, so I denied it. We discussed the like-tweet functionality and the best UX approach. I proposed a few approaches like increasing the like count immediately after the user clicks on the like button and in the background we can update the real like count through an API, then we discussed the API failure case, etc.
In the end, I proposed the list of API contracts with the request payload and response that we might need to build the system. He agreed on that and that was the best part of the interview.
Unfortunately, the interviewer didn’t agree on many of my points and I got a rejection mail from HR. I asked a detailed feedback and HR sent me the same. So, overall it was a great frontend interview experience with Tekion. Hopefully next time, I will come up with better approaches and will work with Tekion in the future.
Hope my experience helps you to prepare for a frontend interview at Tekion.
Also read –
Thoughtspot Interview Experience – Front End (7 years exp.)
Sigtuple Interview Experience – OffCampus
How a web page is rendered in the browser?
