Frontend | Вопросы собесов
Ir al canal en Telegram
Сайт: https://easyoffer.ru/ Все каналы: t.me/+xGeAw6ckJ4liYzQy Контакт для рекламы: @easyoffer_adv
Mostrar más
Red:📈 Análisis del canal de Telegram Frontend | Вопросы собесов
El canal Frontend | Вопросы собесов (@easy_javascript_ru) en el segmento lingüístico de Ruso es un actor destacado. Actualmente la comunidad reúne a 17 887 suscriptores, ocupando la posición 7 165 en la categoría Tecnologías y Aplicaciones y el puesto 37 010 en la región Rusia.
📊 Métricas de audiencia y dinámica
Desde su creación el невідомо, el proyecto ha mostrado un crecimiento acelerado, reuniendo a 17 887 suscriptores.
Según los últimos datos del 25 agosto, 2026, el canal mantiene una actividad estable. En los últimos 30 días la variación de miembros fue de -149, y en las últimas 24 horas de -6, conservando un alto alcance.
- Estado de verificación: No verificado
- Tasa de interacción (ER): El promedio de interacción de la audiencia es 6.98%. Durante las primeras 24 horas tras publicar, el contenido suele obtener 4.62% de reacciones respecto al total de suscriptores.
- Alcance de las publicaciones: Cada publicación recibe en promedio 1 249 visualizaciones. En el primer día suele acumular 827 visualizaciones.
- Reacciones e interacción: La audiencia responde de forma activa: el promedio de reacciones por publicación es 5.
- Intereses temáticos: El contenido se centra en temas clave como ставь, браузер, html, border, flex.
📝 Descripción y política de contenido
El autor describe el recurso como un espacio para expresar opiniones subjetivas:
“Сайт: https://easyoffer.ru/
Все каналы: t.me/+xGeAw6ckJ4liYzQy
Контакт для рекламы: @easyoffer_adv”
Gracias a la alta frecuencia de actualizaciones (últimos datos recibidos el 26 agosto, 2026), el canal mantiene la vigencia y un amplio alcance. La analítica demuestra que la audiencia interactúa activamente con el contenido, lo que lo convierte en un punto de referencia dentro de la categoría Tecnologías y Aplicaciones.
17 887
Suscriptores
-624 horas
-457 días
-14930 días
Carga de datos en curso...
Canales Similares
Nube de Etiquetas
Menciones Entrantes y Salientes
---
---
---
---
---
---
Atraer Suscriptores
agosto '26
agosto '26
+26
en 0 canales
julio '26
+29
en 0 canales
Get PRO
junio '26
+26
en 2 canales
Get PRO
mayo '26
+41
en 0 canales
Get PRO
abril '26
+28
en 0 canales
Get PRO
marzo '26
+28
en 0 canales
Get PRO
febrero '26
+42
en 0 canales
Get PRO
enero '26
+97
en 1 canales
Get PRO
diciembre '25
+15
en 2 canales
Get PRO
noviembre '25
+120
en 0 canales
Get PRO
octubre '25
+89
en 0 canales
Get PRO
septiembre '25
+55
en 0 canales
Get PRO
agosto '25
+65
en 0 canales
Get PRO
julio '25
+98
en 0 canales
Get PRO
junio '25
+103
en 2 canales
Get PRO
mayo '25
+121
en 2 canales
Get PRO
abril '25
+171
en 0 canales
Get PRO
marzo '25
+162
en 5 canales
Get PRO
febrero '25
+359
en 5 canales
Get PRO
enero '25
+531
en 53 canales
Get PRO
diciembre '24
+285
en 1 canales
Get PRO
noviembre '24
+539
en 0 canales
Get PRO
octubre '24
+1 456
en 46 canales
Get PRO
septiembre '24
+2 372
en 275 canales
Get PRO
agosto '24
+742
en 0 canales
Get PRO
julio '24
+855
en 54 canales
Get PRO
junio '24
+3 780
en 245 canales
Get PRO
mayo '24
+3 174
en 224 canales
Get PRO
abril '24
+2 890
en 69 canales
Get PRO
marzo '24
+2 687
en 48 canales
Get PRO
febrero '24
+3 294
en 32 canales
| Fecha | Crecimiento de Suscriptores | Menciones | Canales | |
| 26 agosto | 0 | |||
| 25 agosto | 0 | |||
| 24 agosto | 0 | |||
| 23 agosto | 0 | |||
| 22 agosto | +1 | |||
| 21 agosto | +2 | |||
| 20 agosto | 0 | |||
| 19 agosto | +1 | |||
| 18 agosto | 0 | |||
| 17 agosto | 0 | |||
| 16 agosto | +2 | |||
| 15 agosto | +1 | |||
| 14 agosto | +3 | |||
| 13 agosto | +2 | |||
| 12 agosto | 0 | |||
| 11 agosto | +3 | |||
| 10 agosto | 0 | |||
| 09 agosto | 0 | |||
| 08 agosto | +6 | |||
| 07 agosto | +1 | |||
| 06 agosto | 0 | |||
| 05 agosto | 0 | |||
| 04 agosto | +4 | |||
| 03 agosto | 0 | |||
| 02 agosto | 0 | |||
| 01 agosto | 0 |
Publicaciones del Canal
🤔 Как решить проблему несовместимости некоторых CSS-свойств в браузере?
- Использовать vendor-префиксы (-webkit-, -moz-, -ms-, -o-);
- Проверять поддержку на сайте caniuse.com;
- Писать fallback-стили;
- Использовать полифиллы или normalize.css для приведения к общему стилю.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
| 2 |  deep tech night
⚡ 5 сентября в онлайн-трансляции — доклады экспертов из Яндекса и международных IT-компаний. В фокусе системы: NPU под LLM, RL-инфраструктура, Physical AI, YDB, большие базы данных и agentic systems.
Разберём, что уже работает, где появляются инженерные компромиссы и как команды справляются с новыми требованиями к архитектуре, инфраструктуре и продакшену.
🗒 В прямом эфире можно будет задать вопросы спикерам. Запись отправим зарегистрированным участникам после события.
Зарегистрироваться
#реклама 16+
deeptechnight.ru
О рекламодателе | 718 |
| 3 | 🤔 Основные причины отказа от классовых компонентов в react?
С появлением React Hooks в версии 16.8 (2019 год) классовые компоненты стали устаревшим способом создания компонентов. Сегодня функциональные компоненты с хуками заменяют классы. Давайте разберем почему.
🟠Меньше кода → чище и понятнее
Функциональные компоненты короче, читаются легче, а код становится чище.
class Counter extends React.Component {
constructor(props) {
super(props);
this.state = { count: 0 };
}
increment = () => {
this.setState({ count: this.state.count + 1 });
};
render() {
return (
<button onClick={this.increment}>
Счетчик: {this.state.count}
</button>
);
}
}
Функциональный компонент (хуки делают код проще)
function Counter() {
const [count, setCount] = useState(0);
return (
<button onClick={() => setCount(count + 1)}>
Счетчик: {count}
</button>
);
}
🟠Легче управлять жизненным циклом (useEffect vs componentDidMount)
В классах жизненный цикл* компонента состоит из нескольких методов (componentDidMount, componentDidUpdate, componentWillUnmount).
class Timer extends React.Component {
constructor(props) {
super(props);
this.state = { time: 0 };
}
componentDidMount() {
this.timer = setInterval(() => {
this.setState({ time: this.state.time + 1 });
}, 1000);
}
componentWillUnmount() {
clearInterval(this.timer);
}
render() {
return <p>Время: {this.state.time} секунд</p>;
}
}
Функциональный компонент (хуки делают все проще)
function Timer() {
const [time, setTime] = useState(0);
useEffect(() => {
const timer = setInterval(() => setTime(t => t + 1), 1000);
return () => clearInterval(timer);
}, []);
return <p>Время: {time} секунд</p>;
}
🟠Лучшая производительность (меньше потребления памяти)
Классовые компоненты используют экземпляры классов, а функциональные компоненты – просто функции.
Создают экземпляры this
Обрабатывают setState
Хранят лишние связи и контексты
Не создают this
Используют только нужные данные
Оптимизируются через React.memo
const Button = React.memo(({ onClick }) => {
console.log("Ререндер кнопки");
return <button onClick={onClick}>Нажми</button>;
});
function App() {
const [count, setCount] = useState(0);
const increment = useCallback(() => setCount(c => c + 1), []);
return (
<div>
<p>Счетчик: {count}</p>
<Button onClick={increment} />
</div>
);
}
🟠Легче переиспользовать логику (React Hooks vs HOC/Render Props)
Раньше в классах код переиспользовали через HOC и Render Props, но это делало код сложным.
function withLogging(WrappedComponent) {
return class extends React.Component {
componentDidMount() {
console.log("Компонент монтирован");
}
render() {
return <WrappedComponent {...this.props} />;
}
};
}
Хуки (useEffect) делают код чище
function useLogger() {
useEffect(() => console.log("Компонент монтирован"), []);
}
function MyComponent() {
useLogger();
return <p>Привет, мир!</p>;
}
🟠Функциональные компоненты – будущее React
React официально рекомендует использовать функциональные компоненты
Dan Abramov (разработчик React)
Новые фичи React (Suspense, Server Components) создаются для функциональных компонентов
Классы не работают в React Server Components
Большинство современных библиотек (Redux Toolkit, React Query) рассчитаны на хуки
Ставь 👍 и забирай 📚 Базу знаний | 566 |
| 4 |  Хочешь карьеру в ИТ? Начни с программы «Мини-СЕО»
⚡Попади в команду топ-менеджера Т-Банка и работай над стратегическими проектами компании.
В зависимости от трека ты сможешь:
— разрабатывать эффективные методологии для оценки влияния продукта на экосистему с Владимиром Любимовым;
— исследовать экосистемы и находить наиболее перспективные точки роста с Максимом Безруковым;
— развивать сегмент автолюбителей и заниматься региональной экспансией Т-Банка с Жорой Сукасяном;
— вести стратегический план развития 3P, развивать AI-продукты и искать, где AI может упростить работу команды, c Денисом Коротовым;
— участвовать в создании B2B-маркетплейса c Владимиром Абазовым.
Программа подойдет студентам и джуниор-специалистам, которые сильны в математике, аналитике и программировании. Успей подать заявку до 25 сентября!
Зарегистрироваться
#реклама 16+
t-miniceo.ru
О рекламодателе | 748 |
| 5 | Пожизненный PRO доступ на easyoffer — по цене одного года!
До 2 сентября вы можете купить PRO навсегда.
Покупаешь один раз — пользуешься всю жизнь.
– База вопросов и задач из собеседований
– Примеры видео-ответов на вопросы
– Записи реальных собеседований
– Тренажеры "Проработка вопросов" и "Реальное собеседование"
– Аналитика требований из вакансий
– Автоотклики на вакансии
– Агрегатор вакансий (скоро)
👉 Купить PRO со скидкой 70%: https://easyoffer.ru/pro | 788 |
| 6 | 🤔 С помощью чего можно создать асинхронные callback?
Асинхронные callback можно создать через:
1. Промисы — основной способ в современных браузерах:
2. fetch('/api').then(response => callback(response));
3. async/await — оборачиваем функцию в async, а внутри можно использовать await:
4. const callback = async () => {
5. const result = await fetch(...);
6. // обработка
7. };
8. Таймеры и события — классические способы:
9. setTimeout(() => callback(), 1000);
10. element.addEventListener('click', () => callback());
Callback вызывается по завершении асинхронной операции, и важно учитывать задержку выполнения (event loop).
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний | 806 |
| 7 |  Самое интересное в российском PostgreSQL этой осенью!
Регистрируйтесь на бесплатную конференцию по PostgreSQL и технологиям СУБД — Tantor JAM 2026. 10 сентября, Москва. 📅
Что будет на конференции:
✅ AI-first мониторинг СУБД: что уже сегодня можно передать ИИ-агентам и как меняется профессия DBA;
✅ аналитика и HTAP без внешней обвязки, внутри Postgres;
✅ как за два года изменился PostgreSQL для 1С;
✅ защита данных в Tantor Postgres.
Как всегда — технические доклады, живое общение с разработчиками и архитекторами, обмен опытом, а еще — вечерняя программа в честь пятилетия «Тантор Лабс».
Участие бесплатное.
10.09.2026, Москва
Зарегистрироваться
#реклама 16+
tantorlabs.ru
О рекламодателе | 823 |
| 8 | 🤔 Какие есть альтернативы у redux?
Redux – мощный инструмент, но не всегда он необходим. Существует множество альтернатив, каждая из которых подходит для разных сценариев.
🚩React Context API + useReducer
Подходит для небольших и средних приложений
Встроено в React (не требует установки дополнительных библиотек)
useContext` позволяет передавать данные по дереву компонентов без "прокидывания" через props
useReducer работает как Redux, но проще
const AuthContext = createContext();
function authReducer(state, action) {
switch (action.type) {
case "LOGIN":
return { ...state, isAuthenticated: true, user: action.payload };
case "LOGOUT":
return { ...state, isAuthenticated: false, user: null };
default:
return state;
}
}
function AuthProvider({ children }) {
const [state, dispatch] = useReducer(authReducer, {
isAuthenticated: false,
user: null,
});
return (
<AuthContext.Provider value={{ state, dispatch }}>
{children}
</AuthContext.Provider>
);
}
function LoginButton() {
const { dispatch } = useContext(AuthContext);
return (
<button onClick={() => dispatch({ type: "LOGIN", payload: "Иван" })}>
Войти
</button>
);
}
🚩Zustand
Проще Redux, но с теми же возможностями
Нет лишних actions и reducers, только функции
import { create } from "zustand";
const useStore = create((set) => ({
count: 0,
increment: () => set((state) => ({ count: state.count + 1 })),
}));
function Counter() {
const { count, increment } = useStore();
return <button onClick={increment}>Счетчик: {count}</button>;
}
🚩Recoil
Идеален для React-приложений
Гибче, чем Redux, с концепцией "атомов" (раздельные состояния)
import { atom, useRecoilState } from "recoil";
const countState = atom({
key: "count",
default: 0,
});
function Counter() {
const [count, setCount] = useRecoilState(countState);
return <button onClick={() => setCount(count + 1)}>Счетчик: {count}</button>;
}
🚩Jotai
Напоминает Recoil, но без сложных концепций
Поддерживает React Suspense и асинхронные состояния
import { atom, useAtom } from "jotai";
const countAtom = atom(0);
function Counter() {
const [count, setCount] = useAtom(countAtom);
return <button onClick={() => setCount(count + 1)}>Счетчик: {count}</button>;
}
🚩MobX
Автоматически отслеживает изменения состояния
Удобен для сложных приложений
import { makeAutoObservable } from "mobx";
import { observer } from "mobx-react-lite";
class CounterStore {
count = 0;
constructor() {
makeAutoObservable(this);
}
increment() {
this.count++;
}
}
const store = new CounterStore();
const Counter = observer(() => (
<button onClick={() => store.increment()}>Счетчик: {store.count}</button>
));
🚩XState
Подходит для сложных логик (например, UI-анимаций, состояний формы)
Удобно описывать последовательности действий
import { createMachine, interpret } from "xstate";
const toggleMachine = createMachine({
id: "toggle",
initial: "inactive",
states: {
inactive: { on: { TOGGLE: "active" } },
active: { on: { TOGGLE: "inactive" } },
},
});
const service = interpret(toggleMachine).start();
service.send("TOGGLE"); // Меняет состояние
Ставь 👍 и забирай 📚 Базу знаний | 712 |
| 9 |  +3Международная выставка освещения в Гучжэне, Китай 2026
Дата: 2026. 20-25 октября
⚡Люстры, LED, smart lighting, интерьерный, коммерческий свет напрямую от фабрик Китая!
✨Посетите крупнейшую выставку света в Китае.
Официальный сайт выставки!
Пройти регистрацию и получить бесплатный билет:
Зарегистрироваться
#реклама
reg.denggle.com
О рекламодателе | 913 |
| 10 | 🤔 Что известно про последнюю интересную вещь которую узнал про CSS?
Например: свойство :has() стало поддерживаться в современных браузерах. Оно позволяет писать селекторы на основе потомков или соседей, что открывает новые возможности без JS.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний | 936 |
| 11 |  Купить пластиковые окна РЕХАУ от производителя
Улучшенная теплоизоляция. 30+ лет службы. Современные дизайнерские решения
Узнать больше
#реклама
rhsolutions.ru
О рекламодателе | 951 |
| 12 | 🤔 Какими способами мы можем получить картинку с сервера?
В веб-разработке есть разные способы загрузки изображений с сервера. Они зависят от того, какой сервер и какая задача (отображение в браузере, скачивание, работа с API и т. д.).
<img> – самый простой способ (браузер сам загружает)
<img src="https://example.com/image.jpg" alt="Картинка">
CSS (background-image) – если нужно фоновое изображение
.element {
background-image: url("https://example.com/image.jpg");
background-size: cover;
}
🟠`fetch()` – если нужно обработать картинку в JS
Можно загрузить изображение как Blob и создать временный URL.
fetch("https://example.com/image.jpg")
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
document.getElementById("img").src = url;
});
XMLHttpRequest – старый метод (устарел, но работает)
const xhr = new XMLHttpRequest();
xhr.open("GET", "https://example.com/image.jpg", true);
xhr.responseType = "blob";
xhr.onload = function () {
const url = URL.createObjectURL(xhr.response);
document.getElementById("img").src = url;
};
xhr.send();
🟠`<canvas>` – если нужно редактировать изображение
Можно загрузить картинку и нарисовать её на <canvas>.
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
const img = new Image();
img.onload = function () {
ctx.drawImage(img, 0, 0);
};
img.src = "https://example.com/image.jpg";
WebSocket – если изображение передаётся в реальном времени
const socket = new WebSocket("wss://example.com/socket");
socket.onmessage = function (event) {
const url = URL.createObjectURL(event.data);
document.getElementById("img").src = url;
};
data URL (Base64) – если нужно хранить изображение в тексте
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." />
Ставь 👍 и забирай 📚 Базу знаний | 914 |
| 13 |  Яндекс Музыка до 360 дней бесплатно
Яндекс Музыка для вас и 3-х ваших близких.
Кинопоиск и Яндекс Книги тоже в мультиподписке Плюс.
Попробуйте бесплатно❤️
Слушать
#реклама 18+
music.yandex.ru
О рекламодателе | 917 |
| 14 | 🤔 Что такое GraphQL?
GraphQL — это язык запросов к API, разработанный Facebook. Позволяет клиенту точно указать, какие данные ему нужны. Это альтернатива REST, с преимуществами:
- меньше перегрузки;
- один запрос на множество сущностей;
- гибкость на стороне клиента.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний | 1 006 |
| 15 |  Услуги дата-центра в Москве
Размещение и аренда серверного оборудования в дата-центре.
👍 4 современных дата-центра в Москве.
👍 Лицензированный оператор связи.
👍 Индивидуальные конфигурации выделенных серверов под задачи клиента.
👍 Круглосуточная техническая поддержка в Телеграм, без ботов.
Узнать цену
#реклама 16+
itsoft.ru
О рекламодателе | 901 |
| 16 | 🤔 Какие знаешь подходы по написанию css?
Существует несколько методологий и подходов к написанию CSS, которые помогают структурировать код, сделать его более читаемым, масштабируемым и поддерживаемым. Рассмотрим основные.
🟠Классический (обычный) CSS
Стандартное написание CSS без структурных ограничений.
.button {
background-color: blue;
color: white;
padding: 10px;
}
🟠BEM (Block Element Modifier)
BEM — один из самых популярных методологий. Он помогает избежать конфликтов классов и улучшает читаемость кода.
- Block (Блок) — независимый компонент (.button).
- Element (Элемент) — часть блока (.button__icon).
- Modifier (Модификатор) — изменение блока (.button--primary).
<button class="button button--primary">
<span class="button__icon"></span> Нажми меня
</button>
.button {
background-color: gray;
color: white;
padding: 10px;
}
.button--primary {
background-color: blue;
}
.button__icon {
margin-right: 5px;
}
🟠OOCSS (Object-Oriented CSS)
OOCSS (Объектно-ориентированный CSS) предлагает разбивать стили на структуру и внешний вид, чтобы повторно использовать код.
.card {
border: 1px solid #ccc;
padding: 10px;
}
.card--dark {
background-color: black;
color: white;
}
🟠CSS-in-JS (Styled Components, Emotion)
Этот подход популярен в React и других фреймворках, где стили пишутся внутри JavaScript.
import styled from 'styled-components';
const Button = styled.button`
background-color: blue;
color: white;
padding: 10px;
`;
export default function App() {
return <Button>Нажми меня</Button>;
}
🟠Utility-First (Tailwind CSS)
В этом подходе используются готовые утилитарные классы для быстрого стилизации.
<button class="bg-blue-500 text-white p-2 rounded">Кнопка</button>
Ставь 👍 и забирай 📚 Базу знаний | 898 |
| 17 |  +5Регистрируйтесь на Yandex Scale 2026
Главная конференция Yandex Cloud.
Узнайте о сервисах, которые меняют ваш бизнес.
4 офлайн-трека (AI, Infra + DevTools, Data, Security), онлайн-трек Deep Tech, воркшопы по ИИ и интерактивы. Подробнее о программе читайте в карточках🗒
📅24 сентября
🚗Москва + 💻онлайн
Участие бесплатное!
Зарегистрироваться
#реклама 16+
scale.yandex.cloud
О рекламодателе | 830 |
| 18 | 🤔 Как предотвратить рекурсию?
Чтобы избежать бесконечной рекурсии:
- Всегда нужно базовое условие выхода, которое не вызывает рекурсивный вызов.
- Использовать ограничения по глубине вызова.
- Проверять входные параметры.
- Можно заменить рекурсию на итеративный подход (цикл), если глубина вызовов слишком большая.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний | 1 009 |
| 19 | 🤔 Какие типы данных существуют?
Существует несколько основных типов данных, которые можно разделить на две категории: примитивные типы и объекты.
🚩Примитивные типы:
🟠Number
представляет как целые числа, так и числа с плавающей точкой. Например, 42 или 3.14.
🟠String
представляет текстовые данные. Строки неизменяемы. Пример: "Привет, мир!".
🟠Boolean
имеет два значения, true и false, и используется для работы с логическими операциями.
🟠Undefined
переменная имеет тип undefined, если она была объявлена, но ей не было присвоено никакого значения.
🟠Null
специальное значение, которое представляет собой "ничего" или "пустое значение". Важно отметить, что null является объектом из-за ошибки в ранних версиях JavaScript.
🟠Symbol
уникальное и неизменяемое значение, используемое как ключ для свойств объекта. Создают уникальные идентификаторы в объектах.
🟠BigInt
тип данных, позволяющий работать с целыми числами произвольной точности. Введен для представления чисел, которые больше, чем максимальное значение, которое может представить тип Number.
🚩Объекты
могут содержать наборы пар ключ-значение, где ключи - строки или символы, а значения — любой тип данных. Используются для представления коллекций данных, сложных структур или для создания пользовательских типов данных с помощью классов и прототипов.
Ставь 👍 и забирай 📚 Базу знаний | 1 112 |
| 20 | 🤔 Что такое SVG?
SVG (Scalable Vector Graphics) — это векторный графический формат, основанный на XML. Он позволяет отображать графику (фигуры, линии, текст) с возможностью масштабирования без потери качества.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний | 1 118 |
