Frontend

What happens if the component type changes? Will the same key help preserve the state?

Middle+

IT One

Briefly tell about yourself and what you did at your last job.

You didn't have a system administrator who helped with access?

How does position: absolute affect the rendering chain and compositing layers? Can it be avoided by other means?

Imagine you have unlimited resources and need to create an interface with a form from scratch as part of a large application. What stack and architecture would you choose?

CSS task: draw a red square in the center of the screen.

Middle+

Альфа-Банк

What is the difference between display: none and visibility: hidden? And opacity: 0?

Middle+

Рунити

How do you bind the context (this) to a function? Tell me about call, apply, bind methods and their differences.

Middle

Okko

Provide an example of the Open/Closed principle in frontend development, for example, through render props.

Tell me about optimization and memoization options at the intersection of parent and child components.

In class components, there is a method componentWillUnmount. How to implement an equivalent in a functional component?

Middle

СБЕР

How to pass methods or data from a parent component to a child component in Vue?

What is Pinia and why is it used?

Do you write tests, and which ones specifically (unit, critical flow, etc.)?

Why do checkboxes not appear when the page loads?

import React, { useState, useEffect, useRef, useContext, useReducer, useMemo } from 'react'; const someFunc = (arr) => { return [...arr].sort((a, b) => a - b); }; const LazyInit = (props) => { const [arr, setArr] = useState(() => someFunc(props.arr)); const onClick = () => { setArr((prev) => prev.concat(prev.length + 1)) } return ( <> <button onClick={onClick}> Increment </button> <ul> {arr.map((n, index) => <li key={index}>{n}</li>)} </ul> </> ) } export default () => <LazyInit arr={[1, 2, 3]} />; --- The conversation on the right side discusses: - Using TypeScript with generics: "<T extends object, K extends keyof T>" - Checking if data is a string with a type guard: "isString(data: unknown): data is string { ... }" - Using useState with a function to avoid re-running on every render: ``` const [state, setState] = useState(getComplexData); // or const [state, setState] = useState(() => getComplexData()); ``` - The function passed to useState will run only once on component mount. - Warning about mutating state directly on line 11 with prev.concat. --- The technical task is to analyze and possibly fix or optimize the React component code, especially focusing on: - Proper lazy initialization of state with useState. - Avoiding direct mutation of state. - Understanding TypeScript generics and type guards. - Ensuring the component updates state correctly on button click.

Middle+

IT One

What proposals would you not consider?

Tell me about your favorite feature that you are proud of

What state managers have you worked with? Which do you prefer, and what are their advantages and disadvantages?

Tell us about Teleport and Suspense in Vue.js: what are they, have you used them in your work?