A candidate should know JavaScript basics and its core. Without it, there is no need to start framework questions. That’s the starting point for any JavaScript task. Be mindful and helpful. I guess you know the famous “Everybody Lies.” Here, we have “Everybody is nervous about an interview.” Your job is at least to try to help a candidate express themselves better.
If there are two interviewers and one of them asks some question and the candidate struggles to answer it, you can play a good-bad cop situation. One of you is asking questions, and another is trying to help the candidate. That could help to open up more.
Doing an interview also benefits you. You constantly have refreshed knowledge and learn new things every interview. That’s true.
First, we need to know with what experience and knowledge we deal with. It is crucial to ask a candidate before everything to know what questions to ask next and what to expect. Also, it is a nice starting point that makes a person less nervous.
You can start with simple JavaScript core questions. You don't need to worry about asking everything. You can use such a pattern: ask something standard; if the candidate can’t answer such a simple question, try to paraphrase the question. Still not? Okay, you can try the following simple question. If a candidate does not know something, that’s fine.
If the candidate answers a simple question, ask something specific about the initial question. The particular question should be tricky and could spark a discussion. Discussion is our friend in understanding the candidate's experience.
Being a JavaScript Developer means taking a lot of hours working on various problems and learning from your mistakes. That’s how we gain our experience. And an experienced developer should have advanced knowledge. A few topics could be discussed here, like async code and event loop, OOP, functional programming, prototype inheritance, compile code or interpret it, you name it. You would need to use practical questions during discussions to have the best results.
Asynchronous code is the first famous topic here. You should have a flow, a story. You can start with a beginning from a user perspective. “So, JS is a single thread language, right? But a user can download data or start a timer on the page; how is it possible?”. You should follow this discussion to the event loop. That’s where a candidate should talk a lot about how it works. Better with practical examples.
If the candidate did the event loop, we go with micro and macro tasks. That’s important to know in the scope of async things. Remember, explaining this is difficult, so try to help occasionally. Additionally, you can ask regarding promises and callbacks on this topic.
Finally, we should have something practical to fully understand a situation. Here you are. I think this is the best possible task: Ask for the order of execution.
It is pretty straightforward. You can start with principles like encapsulation, inheritance, polymorphism, and abstraction. The primary key here is the following, we need to have a practical understanding of each. It could be anything - explaining on animals, other objects, or just some use cases from a candidate's experience.
If you have a lot of time and want to go hardcore, then go SOLID. Same logic, ask for an explanation of each principle and a practical understanding. Also, you can ask an interviewee to explain one of the principles using a code editor or drawing, etc.
It is the most fancy topic here. You can go wild and ask whatever you want. It could be a more math-specific question like curing or monads. It could be more classical, like pure functions and immutability questions. It is a must to ask here, as it is how we do modern frameworks this day. Again, ask for practical examples.
Well, it is the hardcore stuff. Nowadays, a lot of interviewees do not know this topic. You can do some superficial questions here to check if someone knows about prototyping. But it’s up to you if you need to ask. Sure, it would be nice to have examples together.
We need to ask some questions to know the level of common browser knowledge. List of possible questions:
What is DOM? CSSOM? Render tree?
localStorage and IndexedDB, what are the differences? What would you say is better?
CORS? What is it? Source? How to go around them?
What benefits does cookies have over localStorage?
WebWorkers and ServiceWorkers
How to add event listener? What is a target and a currentTarget?
Events bubbling and capturing is a significant topic to discuss. What methods stopPropagation and preventDefault do?
The network is an underestimated section overall. It is essential as it is the basis for all web development. Questions about understanding HTTP2, HTTPS, DNS, DNS Lookup, REST, XHR requests, and web sockets should be included here. You can ask more general questions, like “Could you explain in a basic way the communication flow between a browser and a server in case of HTTP request?”, or “What is a proper REST implementation to you?”. It would be nice to ask about previous experience regarding BE - FE communication (What was the flow? Did they use DTOs?).
It's not a required topic. If the candidate is already in an interview, they have CSS knowledge. But still, you can ask tricky questions that only a candidate with experience knows.
What is responsive design?
What are the ways to center a div with CSS?
What is pointer-events property?
What is hex, rgb, rgba?
What is px, em, rem?
What is the difference between visibility and display props?
Valuable would be Less, Sass, Styled-components, and Emotion knowledge. You can ask about the technology and experience the candidate has.
Nowadays, it is very rare to see plain CSS styling on a project. There would be some CSS frameworks, like Material, Foundation, Radix, Tailwind, etc. Questions regarding those items would be highly valuable. You can ask either something specific or an opinion on some everyday things.
Extra topic, but an important one.
What is union type?
What is Generics? How have you used it?
What built-in Generics do you know?
What is the difference between any and unknown?
Have you ever had a strict null project? What is your opinion on having such a rule?
Can you make a Select component with the following requirements? It should have a value and onChange props. Value can be a number | string or (number | string)[]. And onChange action should return your value type.
Have you even done Typescript setup from scratch?
Here, we can have two approaches. The first is a long session. It could take 1-2 hours of live coding. You can have a single task that requires some thinking. For example, create a React component that shows the git commit progress for a month, like on GitHub. Please feel free to do this to find the best candidate available. It can take time, and not every interviewee wants to do such a long coding session, but you can see how the candidate will work on an actual project.
You should probably use the second option - small coding tasks. They can be everything. It should not be challenging, but not trivial either. Something “smart”. You are free to use such examples.
1. Ask for the result of a script. Then ask for two possible solutions here (let + Immediately Invoked Function Expression)
2. Ask for a result of a script
3. Ask for a result of a script
4. Create a function that can compare arrays
5. Make a function that can transform from [0,1,2,3,4,5] to [[0,1],[2,3],[4,5]] using only functional programming and no data mutation
6. Make a countdown function
7. Make an isogram function
Yes, it is required to know the JavaScript language to do things. And yes, knowing of the frameworks to “actually” do things conveniently and quickly. So, framework questions are a must. Let’s see React library question examples.
What is the difference between useMemo and useCallback?
What if we use useEffect without a second parameter?
How to make a recursive component? For example, we are building a tree.
What is React state batching?
What are the ways to pass data between siblings?
Can we use hook inside a component body?
What is the difference between <> and
How do you pass ref to a child component?
What can re-render a component?
What is useLayoutEffect? When do we need to use it?
What is the purpose of the callback function as an argument of setState?
What is Portal?
Why do we need keys when rendering a map? Could keys be random values?
What is Suspense?
Have you ever created your custom react hooks?
What are the most useful libs have you used together with React?
Have you ever used redux? Could you explain its flow?
Have you ever used react-query or rtk query? What are the benefits? What can you say about caching there?
Have you ever used createContext? What are the benefits and downsides?
How would you handle permissions/authorization for routes?
What is SSR? When do we need to use it?
Architecture is a very subjective topic. A good start would be questions regarding experience in setting up new projects. The standard questions would be: “If you need to start a new project now, what would you use, and what will be the data flow?” “What bundling tool is better for you?” “Linting, tests, TS setup?” It should be more of a discussion than a strict question.
Performance optimization and profiling are sensitive topics. Developers rarely do optimizations during development, but it is essential at the end of the day. Same here, the best way is to ask general questions and have a discussion - “Have you ever been doing profiling?”, “What can we see in Google Chrome profile data?”, “What can we see in React profile data?”, “How to find a problem place in your code using profiler?
A great topic is an authorization flow regarding FE - BE communication. What is JWT? What are common libraries to initiate authorization? What is the difference between authorization and authentication?
If my story helped you, you found a mistake or want to suggest an improvement, please feel free to drop me a message. My contacts are on the top of the page 😉