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.