Frontend Interview - собеседования по Javascript / Html / Css
Открыть в Telegram
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su
Больше
Сеть:📈 Аналитический обзор Telegram-канала Frontend Interview - собеседования по Javascript / Html / Css
Канал Frontend Interview - собеседования по Javascript / Html / Css (@frontendinterview) языкового сегмента Русский является активным участником. Сейчас сообщество объединяет 10 736 подписчиков, занимая 11 409 место в категории Технологии и приложения и 60 392 место в регионе Россия.
📊 Показатели аудитории и динамика
С момента создания невідомо проект демонстрирует стремительный рост, собрав аудиторию из 10 736 подписчиков.
Согласно последним данным от 13 июля, 2026, канал показывает стабильную активность. За последние 30 дней изменение числа участников составило -104, а за последние 24 часа — -8, при этом общий охват остаётся высоким.
- Статус верификации: Не верифицирован
- Уровень вовлечённости (ER): Средний показатель вовлечённости аудитории составляет 8.00%. В первые 24 часа после публикации контент обычно набирает 4.14% реакций от общего числа подписчиков.
- Охват публикаций: В среднем каждый пост получает 859 просмотров. В течение первых суток публикация набирает 444 просмотров.
- Реакции и взаимодействия: Аудитория активно поддерживает контент: среднее количество реакций на один пост — 2.
- Тематические интересы: Контент сосредоточен на ключевых темах, таких как javascript, браузер, html, css, видимость.
📝 Описание и контентная политика
Автор описывает ресурс как площадку для выражения субъективного мнения:
“Канал для подготовки к собеседованиям по фронтенду
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Купить рекламу: https://telega.in/c/frontendinterview
Канал в реестре РКН:
https://rknn.link/su”
Благодаря высокой частоте обновлений (последние данные получены 14 июля, 2026) канал поддерживает актуальность и высокий уровень охвата публикаций. Аналитика показывает, что аудитория активно взаимодействует с контентом, что делает его важной точкой влияния в категории Технологии и приложения.
10 736
Подписчики
-824 часа
-297 дней
-10430 день
Архив постов
Какое значение примет result?
Что такое ReactDOMServer?
ReactDOMServer - это объект, позволяющий рендерить компоненты в виде статической разметки (обычно, используется на node-серверах). Данный объект в основном используется при рендеринге на стороне сервера. Следующие методы могут быть использованы как на сервере, так и в браузерном окружении:
renderToString() renderToStaticMarkup()Например, вы запускаете основанный на Node веб-сервер, такой как Express, Koa или Happi, и вызываете renderToString() для рендеринга корневого элемента в виде строки, которую сервер отправляет в ответ на запрос: // используем Express
import { renderToString } from 'react-dom/server'
import MyPage from './MyPage'
app.get('/', (req, res) => {
res.write('<!DOCTYPE html><html><head><title>My Page</title></head><body>')
res.write('<div id="content">')
res.write(renderToString(<MyPage/>))
res.write('</div></body></html>')
res.end()
})
👉 @frontendInterviewНовости от команды Лектрума 🔥
14 апреля в 19:30 по Киеву/Москве пройдёт онлайн-воркшоп на тему «Продвинутый React-разработчик 2021». 🏋️♂️
Разберёмся с MobX, TypeScript и другими инструментами на практике 💪
⚠️ Записи не будет. Регистрация через сайт. ⬇️
Программа:
🎯 Состояние сегодняшней экосистемы React
🎯 Создание мини-приложения на React и TypeScript
🎯 Извлечение пользы от применения TypeScript
🎯 Правильное применение Redux и MobX
🎯 Развеивание мифов о Redux, MobX
🎯 Точки роста зарплаты в 2021-м году
Для кого:
✔️ Веб-разработчиков, которые работают с устаревшими инструментами
✔️ Новичков, которые хотят разрабатывать React-приложения
✔️ Самоучек, которые запутались на своём пути
TypeScript_Quickly_v9_MEAP.pdf20.10 MB
TypeScript Quickly (2020)
TypeScript - это JavaScript с важным обновлением! Добавив строгую систему типов в JavaScript, TypeScript может помочь вам устранить целые категории ошибок времени выполнения. Читая книгу, вы c помощью практических примеров и проектов научитесь создавать надежные приложения под руководством опытных веб-разработчиков Якова Файна и Антона Моисеева.
Фильтрация массива
Вам дан массив, состоящий из чисел и строк. Задача проста - отфильтровать строки и вернуть массив чисел.
Примеры
filter_list([1,2,'a','b']) == [1,2]
filter_list([1,'a','b',0,15]) == [1,0,15]The_Road_to_React_Your_journey_to_master_plain_yet_pragmatic_React.pdf8.50 KB
The Road to React (2020)
При помощи книги вы можете изучить основы React.js, шаг за шагом создавая полноценное приложение на React. При создании приложения каждая глава книги знакомит вас с новой функцией или особенностью React.
Что такое предохранители (Error Boundaries) в React?
Error boundaries- это компоненты, которые отлавливают ошибки JavaScript, возникающие в любом дочернем компоненте, сообщают об этих ошибках и отображают резервный UI.
Классовый компонент становится предохранителем при определении в нем нового метода жизненного цикла componentDidCatch(error, info) или static getDerivedStateFromError() :
class ErrorBoundary extends React.Component {
constructor(props) {
super(props)
this.state = { hasError: false }
}
componentDidCatch(error, info) {
// Вы также можете отправлять ошибки в специальный сервис по их обработке
logErrorToMyService(error, info)
}
static getDerivedStateFromError(error) {
// Обновляем состояние, чтобы при следующем рендеринге использовался запасной UI
return { hasError: true };
}
render() {
if (this.state.hasError) {
// Вы можете рендерить любой резервный интерфейс
return <h1>{'Что-то пошло не так.'}</h1>
}
return this.props.children
}
}
После этого, предохранитель используется как обычный компонент:
<ErrorBoundary>
<MyWidget />
</ErrorBoundary>ReactJS с нуля до Pro за 4 месяца
🚀Открыт набор на второй поток курса ReactJS Pro в школе технологий 🚜Трактор
Преподаватели курса: Максим Иванов и Никита Кабардин — разработчики из Spotify, Minecraft и Battlefield!
Залетай в телеграм-бот, чтобы узнать больше!
🚜 Всё о курсе, о формате, о дискорде, о Трактор комьюнити
🔔 Оповещения о стримах
🔗 Ссылки на небольшие внутренние курсы
+ Видосы:
🎮 Собираем клон Minecraft на React с нуля за 30 минут.
⚡️ Создаем сложные формы на React и React Hook Form.
⏯ Подборка полезных видео от Максима на английском
👇Кликай на кнопку, жми START и поехали! 🚀
Что такое props.children?
Как выполнить условный рендеринг компонентов в React?
В некоторых случаях вам нужно будет рендерить разные компоненты в зависимости от некоторого состояния. JSX не рендерит false или undefined, поэтому вы можете использовать короткие вычисления для рендеринга определенной части компонента только при удовлетворении условия:
const MyComponent = ({ name, address }) => (
<div>
<h2>{name}</h2>
{address &&
<p>{address}</p>
}
</div>
)
Если вам требуется условие if else, тогда используйте тернарный оператор:
const MyComponent = ({ name, address }) => (
<div>
<h2>{name}</h2>
{address
? <p>{address}</p>
: <p>{'Address is not available'}</p>
}
</div>
)Ищешь годный материал по front end разработке?
FrontEndDev - канал для продвинутых веб-разработчиков.
На канале найдешь свежие статьи, фишки JS и TS, туториалы по современным фреймворкам, лучшие практики разработки и многое другое.
Рекомендуем подписаться - @front_end_dev
Какое из перечисленных ниже слов не является зарезервированным словом в JavaScript?
Расскажите про относительные единицы измерения в CSS
В CSS3 были добавлены относительные единицы измерения, такие как vh, vw, vmin, vmax. Эти единицы вычисляются относительно размеров окна браузера.
Если вы хотите использовать высоту и ширину окна браузера, лучше воспользоваться единицами vh и vw. Например, если высота окна браузера равна 900px, то 1vh будет равен 9px. Аналогично, если ширина окна браузера равна 1600px, то 1vw будет равен 16px.
vmin и vmax определяются минимальным или максимальным значением высоты или ширины. Например, если ширина окна браузера равна 1200px, а высота 700px, то vmin будет равен 7px, а vmax - 12px.
Верно или неверно утверждение?
useLayoutEffect запускается после рендера React-компонента и гарантирует, что обратный вызов эффекта не заблокирует отрисовку.
Заглушить троллей
Тролли набежали в комменты! С ними можно разобраться, удалив все гласные буквы в их сообщениях. Напишите функцию, которая будет принимать строку и возвращать обработанную строку без гласных.
Пример:
"This website is for losers LOL!" станет "Ths wbst s fr lsrs LL!".Как использовать стили в React?
Атрибут style принимает объект JavaScript со свойствами в стиле camelCase, а не в виде CSS-строки. Это обеспечивает согласованность с JavaScript-свойствами, связанными со стилями, является более эффективным и закрывает дыры в безопасности (XSS).
const divStyle = {
color: 'blue',
backgroundImage: 'url(' + imgUrl + ')'
};
function HelloWorldComponent() {
return <div style={divStyle}>Привет, народ!</div>
}
Использование атрибута style для оформления элементов не рекомендуется. В большинстве случаев для ссылки на классы, определённые во внешнем CSS, следует использовать className.