Frontend Interview - собеседования по Javascript / Html / Css
رفتن به کانال در Telegram
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su
نمایش بیشتر
شبکه:📈 تحلیل کانال تلگرام Frontend Interview - собеседования по Javascript / Html / Css
کانال Frontend Interview - собеседования по Javascript / Html / Css (@frontendinterview) در بخش زبانی روسی بازیگری فعال است. در حال حاضر جامعه شامل 10 736 مشترک است و جایگاه 11 409 را در دسته فناوری و برنامهها و رتبه 60 392 را در منطقه روسيا دارد.
📊 شاخصهای مخاطب و پویایی
از زمان ایجاد در невідомо، پروژه رشد سریعی داشته و 10 736 مشترک جذب کرده است.
بر اساس آخرین دادهها در تاریخ 13 ژوئیه, 2026، کانال فعالیت پایداری دارد. در ۳۰ روز گذشته تغییر اعضا برابر -104 و در ۲۴ ساعت گذشته برابر -8 بوده و همچنان دسترسی گستردهای حفظ شده است.
- وضعیت تأیید: تأیید نشده
- نرخ تعامل (ER): میانگین تعامل مخاطب 8.00% است و در ۲۴ ساعت نخست پس از انتشار، محتوا معمولاً 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.