Forem: Nikhil

Front End Interview Round 1: Machine Coding / Web Development

Nikhil — Sun, 03 Jan 2021 14:10:52 +0000

Frontend Interviews consists of 4 – 5 rounds depending on the year of experience. Here is what each round resembles:

Machine Coding / Web Development
UI Tech ( Javascript, HTML & CSS)
Data Structures & Problem Solving
System Design Round
Hiring Manager

Sometimes 2 & 3 are combined into one round with more weightage on UI Tech. System Design is in focus for senior engineers and mostly excluded for freshers (0 – 3) with years of experience. You will have at least 3 – 5 rounds in any good tech company.

In this blog, I will be discussing the first round which is focused on Web Development skills. You can also read Must have skills for Frontend Devs in 2021

Objective: Create a web app that can perform certain operations. Sometimes companies also provide the design that the website should look like, but the spotlight is always on functionality.

Sample Problem Statements:

Create a website for student records with client-side search, sort & pagination. Implement your own design, and make sure to use this endpoint for the data https://api.abcxyz.com. Bonus points for good design, optimized search (throttle, debounce), and modular code. No frameworks allowed, use Vanilla JS.
Create a rideshare website where users can request other users for sharing their rides. Use https://api.abcxyz.com?startTime=xx&startLocation=yy&endLocation for the list of active rides, start and end time, and owner details where startTime, startLocation & endLocation is provided by the user searching for rides. Stack – VanillaJS.
Develop a Carousel module with previous, next buttons, autoplay option, and freeze the carousel if hovered. Make sure all the values are configurable and passed externally. Use plain javascript to implement this.
Create a web app where users can see the free meeting rooms in the office. Input – start time, end time, floor. Suggest free slots & time modifications in case rooms are not free. Use React and Redux. Endpoint – https://api.abcxyz.com. Use GraphQl queries during API calls.

Some of the above questions are from big American tech companies and one of India’s largest startup. Any good developer should be able to do it. The only difficulty that one could face is duration.

Total Duration: 2 hrs or less.

As you can see that most of the good companies will ask you to implement the solution in plain javascript. So, prepare for it. Frameworks have made coding so easy that we sometimes forget how things work in the background.

How important is the CSS?

Good UI is always appreciated. Clean design, nice & subtle colors, and minor tweaks can sometimes create a great first impression. I think that has definitely helped me stand out from others. But the heart of the application is the functionality, without that it will end up in rejection. CSS is super important if the company has specifically mentioned that in the problem statement. In my experience, the main focus is on javascript.

How should I prepare for this round?

Focus on Javascript more than frameworks.
Learn native javascript array and object functions as they will help you modify data easily.
Learn how to make API calls natively in javascript without using Axios or something similar. Read about fetch/XMLHttpRequest()
How to optimize search ( debounce, throttle, etc)
The practice is the key, try to develop one or two of the above-discussed projects. I will suggest the first one.
Improve CSS skills. Learning Flex will make things easy.
Learn at least one framework(React/Angular/Vue) for that one odd interview. What I have observed is that small startups are more obsessed with frameworks than big tech. However, that is true for the interviews but for resumes to get shortlisted, frameworks are a big plus.

If you are thinking of switching your job but not sure about it? Please read When to Switch your Current Job as a Software Engineer?

Follow me on Twitter as I keep sharing information on JS, Job Market & Interviews.

Drop your questions, if any. Check out my other posts for Frontend Interview Questions and Experiences for some of the major tech companies.

If this post gets a bunch of comments and views, I will write a tutorial for the first problem statement. Don't forget to subscribe.

When to Switch your Current Job as a Software Engineer?

Nikhil — Fri, 01 Jan 2021 13:09:47 +0000

When to switch your current job as a Software Engineer? This question may or may not have bugged you but it's important to know when it's time to move on.

Hey, I am perfectly happy with my current job. Why should I switch? Well, you may be satisfied today but it doesn't guarantee that it will remain like this forever.

So, what should I consider before deciding to spend 5 or 10 or more years at a company?

How good is the Tech Stack that you are working on? It's a very important aspect of your career that may change where you end up after 20 years in life. Try to talk to people in their late 30s or so, most of them will regret not learning or working on something that they should have. Software Industry is harsh, technologies changes fast. If you don't keep up with the change, you may become unhirable. And someday if your current company decides to let you go? Screwed. Don't spend years in a company that is very conservative to the new technologies or open-source frameworks & libraries. You can also read Must have skills for Frontend Devs in 2021
How good is the Pay? Important. I want to be paid what I am worth. It's important to know your worth. How hardworking you are? How versatile you are? Can you adapt to new technologies fast? Are you really good at something that you are working on? Based on all of these, determine your worth. Companies love underpaid employees, as they are getting more value from you. Once you decide that you deserve more, only one thing happens going forward - You get more.
Work-Life Balance? It's a debatable point as some people don't care about it. Depending on the type of person you are, take your decision. But remember that for now, you may not be valuing personal time but in the future, it may change. So, account for the health demands that may arise in the future, family & friends. For me, I prefer working out 5 days a week, prepare & eat clean meals, spend time with my girlfriend, hanging out with friends on weekends & travel every quarter.
People at work? Your office is your second home. Will you live with a bunch of toxic people at your house? No. I prefer to work at a place where your colleagues can be your friend, your seniors respect you, and your opinion is valued. Think about it.

If you are someone who is not satisfied with one or more of the above-discussed points, you should definitely switch. If you have an imposter syndrome and think you are not that good, trust me you are. It's a fairly common thing in Software Industry, don't think about it. Prepare well, interview, fail, note the questions, study, repeat. This has worked for me, will work for you as well. You can read about My Journey as a Frontend Engineer

Follow me on Twitter as I keep sharing information on JS, Job Market & Interviews.

Drop your questions, if any. Check out my other blogs for Frontend Interview questions and experiences.

Must have skills for Frontend Devs in 2021

Nikhil — Sat, 24 Oct 2020 14:35:03 +0000

Frontend Development is definitely not the same that it used to be a decade ago. Last year, I interviewed for a bunch of top tech companies and I realized that every recruiter is looking for this set of skills. I had experience with most of them as I worked on a variety of projects in the last two years.

Based on my experience, these are the must-have skills for Frontend Developers in 2021.

ES6 - Javascript made some monumental changes in ES6(ES2015) which introduced a whole lot of new features and syntactical changes. Some of them include Arrow Functions, block-scoped variables, promise methods, template literals, and so on. Now, almost every application is written in ES6. You can check out all ES6 features here. By the way, ES11 was launched recently.
SCSS/SASS - Plain CSS is almost out of fashion. SCSS/SASS offers far more flexibility over CSS and it dramatically decreases lines of code that you write. It also makes CSS functional as you can pass on arguments and generate a dynamic CSS. Click here to understand more about SASS.
React/Vue/Angular - These three have been the most used Javascript frameworks in recent years. Based on my experience, React in your resume gives you an extra edge. I have worked on all three, on products with over 100 million users. Using one of these definitely makes it easier to write complex applications.
They also implement certain design patterns in the background, which overall decreases our lines of code and makes coding easier. They create a separate instance of the Document Object Model which is faster and lighter than the real DOM.
Typescript - Typescript is a programming language maintained by Microsoft that builds on Javascript by adding type definitions. Some of the advantages of Typescript is Static Type Checking, Class and Module support, ES6 to ES5 conversion, the resemblance with backend languages, etc. The relationship between TS and Angular goes a long time back. But advantages offered by TS has made it a favorite in React Projects as well.
Testing Frameworks (Jest, Jasmine, Mocha, etc) - With time, Testing frameworks are gaining more and more popularity. Whether it's a unit test or scenario test, it full proofs your application before going to the customer. It also eases the headache of package upgrades. Working in Microsoft has made me realize that the bigger products rely heavily on tests. Having experience with one of these is definitely good for your development process.
GIT / SVN - It's a no brainer. GIT / SVN is used for tracking code changes by single/multiple contributors during an application development process. It also offers you the flexibility to revert, cherry-pick changes to the code. GIT is a distributed version control system while SVN is a centralized one. All organizations use these(or similar) in order to manage their codebase and you should definitely learn if haven't already.

While these are must-have skills for a Front End Engineer in 2021, the core still remains the same - HTML, CSS & Javascript. None of this matters if we don't have command over Javascript and how it works.

Feel free to add other must-have skills in the comments. You can also checkout Journey to Microsoft : React, Vue, Angular & Risks in 3 Years

Follow me on Twitter as I keep sharing information on JS, Job Market & Interviews.

Journey to Microsoft: React, Vue, Angular & Risks in 3 Years

Nikhil — Sun, 18 Oct 2020 06:39:25 +0000

I recently left my job at India’s biggest startup (Paytm) to join one of the world’s largest companies — Microsoft. As Front End Engineer, Paytm rewarded me with an exceptional learning experience, best in class salary among Indian companies, big pay hike within a year, and high performer award. Still, I said “Adios”. It’s actually hard for me to settle knowing that I can achieve more. I would like to take you through my Journey which started very small.

The idea that you can code an application from scratch to complete using web technologies and instantly make it available to millions of people worldwide is exhilarating.

I was so much in love with the web that I started making websites(mostly static) ever since I was a college sophomore. I did a startup (Hyperlocal E-Commerce Website built using PHP) during CS final year of college (NIT Jamshedpur) and ditched my placements. Long story short, one year later my startup was gone due to the constant pressure of cash burn in e-commerce.

Little did I know about how the dynamics of the web have changed during this period. At that point, I wanted to start something else. When I started building it, I realized that I lack the skills to build a modern application. I didn’t keep up with the latest development changes that the world was seeing — Rise of Javascript as I call it.

Web Development logic moved from server-side languages to Javascript. Angular was killing it, React was rising, and JQuery was slowly witnessing its departure. NodeJS started replacing backend languages and here I was with no experience in modern web development, different frameworks, package managers, build tools, module bundlers — you name it.

At that moment I felt the need to upgrade myself & I started applying for a job as a Front End developer. I remember my first interview. It was horrible. I failed to answer basic JS inbuilt functions. From that time until recently when I ended up cracking 7 consecutive interviews in Top Tech companies, it has been a helluva ride.

After a couple of insults, I interviewed for Spectral Insights. In the first round, I coded a web app using HTML, CSS & PHP. They asked me some web performance & data structures related questions, which I answered well. I got the job.

I started working as a Software Engineer (Front End). It was a small startup with 20 highly motivated Engineers, a CEO with strong ethics, and amazing office space. I was working on a complex website that was used by Doctors to run algorithm-based analysis on body cells. The application was built using a mix of JQuery and Javascript in Front End with backend written in PHP. Despite my comfort in PHP, I gave priority to Front End. I knew PHP was going to be a thing of the past in some days. I didn’t want to make that mistake again.

I got an amazing mentor who literally helped me grow at 2X pace. Being in a small company, it’s easy to make decisions. We moved to AngularJS (1.6) and it was a much-needed upgrade for me. In spite of these changes, the overall skeleton of development remained the same. After a while, it started becoming hectic, and I was still not using modern methodologies of web development. After a good 11 months, I moved on.

Interviews are important. They teach you concepts that you might never use in your day-to-day job. I learned this while searching for the next job and a couple of failures did introduce me to a lot of new concepts.

I also realized that hardly anyone was using AngularJS 1.6 😂. I did acquire a lot of knowledge in Javascript during this period. I knew that I could learn any framework quickly. I targeted companies that had the most modern tech stack.
I got the first job offer at 60% raise and a better tech stack (Vue+ NodeJS). I cracked a couple of other interviews and finally ended up with 100% raise and a job in India’s biggest startup. I got a chance to work on E-Commerce as well as FinTech products.

Paytm is a perfect company if you want to add fuel to your career. I used React (Class Component + Functional Components with Hooks) with Redux/Context API, Vuex with Vuex, Angular 6, NodeJS, Webpack, different package managers and build tools. Despite being a company with a 350 million user base, they don’t shy away from new technologies. I got a big hike, a high performer award, a good work-life balance, and a ton of learning that propelled my career.

It was going perfectly but towards the end, work became stagnant for me. Now I didn’t care about frameworks, libraries & tools. I wanted to work on a product that’s got a global customer base. I wanted to experience the work culture of the world’s top companies. After 1 year and 9 months at Paytm, once again I moved on.

I strongly believe that your skills should always be in sync with the market requirements. After my first job, every time I received a call for an interview from a good company I went for it. This kept me updated with the market. Apart from it, each interview will teach you something, introduce you to a new set of concepts and your end goal should be to understand all those concepts. Aim for a day when interviewers won’t be able to surprise you. That’s my current state. I can effectively guess what the interviewer will ask even before he/she finishes his question. I have immersed myself in Javascript for the past 3 years.

I started applying for the companies I wanted to work for. I cleared interviews with Microsoft & a couple of other big tech companies. In terms of annual salary, I got more than 100% raise in all my offers as these are very high paying companies.

I didn’t do any specific preparation apart from some data structure & problem solving on coding platforms. I focused on optimizing time & space complexities. As a Front End Engineer, you should be able to implement Stack, Queue, Linked Lists, Trees & Hash Table in Javascript.

My experience with plain JS in my first company really helped me with the Machine Coding round. Most of the top companies ask you to create a web app using Vanilla JS. I have worked on E-Commerce, FinTech, HealthCare & Social Network related products so far. I always try to understand the complete architecture of the product. This helps me in the Design round. You can also try building games like Snake & Ladder or Chess for practice.

As far as Javascript round is concerned, I dedicate my success to the non-stop spree of interviews that I gave in the first two years of my career. I go through those concepts(.pdf) once before every Interview. I honestly don’t remember when did I last fail in a Javascript round.

In my last interview (first round) at Microsoft, I was asked to code a web application with client-side sorting, searching, pagination with optimizations, and a good-looking UI using VanillaJS. I finished it well within the given time frame. Neither Web-related concepts nor Problem Solving & Data Structures questions were a blocker.

Now, I am working on one of the fastest-growing products of Microsoft (Microsoft Teams) which has customers all over the world. I am learning how to build and ship a global product. I am getting exposed to concepts that I would have never gotten in products with a limited user base.

If you are a Front End Engineer, then you are already on the right train. Powerful applications like Microsoft Teams, Slack, VSCode, Instagram, Uber Eats, etc are built using Web Technologies. Apart from the web, many desktop and mobile apps are also built using Javascript.

As a beginner, you need to make sure you are always learning what’s in demand. Don’t shy away from Interviews, the more the better. Failure is good, it will expose you to new concepts. Learn those concepts, implement them in code, and apply again. And don’t settle until you max out your abilities.

Follow me on Twitter as I keep sharing my development & interview experiences. My tweets are mainly about Javascript, Job Market & Interviews.You can also DM me your questions.