frontendinterview | Unsorted

Telegram-канал frontendinterview - Frontend Interview - собеседования по Javascript / Html / Css

12730

Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Менеджер по рекламе: @Spiral_Yuri Купить рекламу: https://telega.in/c/frontendinterview Номер заявления в РКН № 4959045795

Subscribe to a channel

Frontend Interview - собеседования по Javascript / Html / Css

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Что такое merge и rebase, в чем отличие друг от друга?

Это два способа интеграции изменений из одной ветки в другую в системе контроля версий Git. Оба метода имеют свои особенности и подходят для разных сценариев.

Merge (слияние)

Объединяет изменения из одной ветки в другую, создавая новый коммит слияния (merge commit). Этот метод сохраняет историю всех коммитов, включая все ветвления и слияния.
Предположим, у вас есть две ветки: main и feature.
В ветке feature вы сделали несколько коммитов.
Вы хотите объединить изменения из feature в main.

git checkout main
git merge feature


Rebase (перебазирование)

Перемещает или переписывает базу текущей ветки на указанную базу другой ветки. Это переписывает историю коммитов, создавая новые коммиты для каждого из оригинальных коммитов.
Предположим, у вас есть две ветки: main и feature.
В ветке feature вы сделали несколько коммитов.
Вы хотите перенести изменения из feature на текущий конец main.
git checkout feature
git rebase main


Основные отличия

История коммитов

Merge: Сохраняет всю историю, включая коммиты слияния. История показывает, когда и как происходили слияния веток.
Rebase: Переписывает историю, делая её линейной. История показывает, как если бы все изменения были сделаны последовательно, без ветвлений.

Коммиты слияния
Merge: Создает новый коммит слияния, который объединяет изменения из двух веток.
Rebase: Не создает коммит слияния. Перебазирование "переносит" коммиты одной ветки на другую.

Конфликты
Merge: Конфликты решаются один раз при слиянии.
Rebase: Конфликты могут возникнуть на каждом коммите, и их нужно решать поэтапно.

Применение
Merge: Хорош для сохранения полного контекста истории разработки, особенно в командной работе.
Rebase: Хорош для поддержания чистой, линейной истории, особенно перед слиянием ветки в основную ветку, например, main или master.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Устойчивый веб-дизайн

Без сомнения, "Устойчивый веб-дизайн" является обязательным чтением для веб-дизайнеров и front-end разработчиков во всем мире. Тут собрана история и философия веба. Раскрыты идеи веб-разработки.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Что думаешь про SSR?

Server-Side Rendering (SSR) — это метод рендеринга веб-страниц на сервере перед их отправкой в браузер клиента. В отличие от Client-Side Rendering (CSR), где основная работа по рендерингу выполняется на стороне клиента, SSR позволяет создать HTML-код страницы на сервере и отправить его уже готовым для отображения в браузере.

Преимущества

Улучшение SEO:
- Поисковые системы могут более эффективно индексировать страницы, так как они получают полностью рендеренный HTML-код.
- SSR обеспечивает лучшую видимость для поисковых роботов, что важно для сайтов, ориентированных на SEO.

Быстрое время до первого отрисовки (First Paint):

- Пользователи быстрее видят начальное содержимое страницы, так как браузер получает готовый HTML.
- Это может улучшить восприятие производительности и снизить показатель отказов.

Социальные сети и предварительный просмотр:
- SSR упрощает создание мета-тегов и содержимого для социальных сетей, что позволяет правильно отображать предварительный просмотр страниц при их шаринге.

Лучший пользовательский опыт на медленных устройствах:
- Так как большая часть вычислений выполняется на сервере, клиентские устройства с низкой производительностью быстрее отображают контент.

Недостатки

Увеличение нагрузки на сервер:
- Сервер должен обрабатывать и рендерить каждую страницу, что может требовать больше ресурсов по сравнению с CSR.
- Это может потребовать более мощного серверного оборудования или масштабирования для обработки большого трафика.

Увеличение времени отклика сервера:
- Рендеринг страниц на сервере может занять дополнительное время, особенно для сложных страниц с большим количеством данных.
- Это может привести к увеличению времени ответа сервера.

Сложность настройки и поддержки:

- Настройка SSR требует дополнительных знаний и усилий по сравнению с CSR.
- Поддержка и отладка SSR-приложений может быть более сложной из-за необходимости управлять состоянием на сервере и клиенте.

Гибридные решения могут быть сложными:
- Комбинирование SSR с CSR для достижения оптимальной производительности и функциональности (например, использованием технологии Hydration) может усложнить архитектуру приложения.

Примеры

Next.js для React:
- Популярный фреймворк, который облегчает создание SSR-приложений на основе React.
- Поддерживает гибридные приложения с SSR для начальной загрузки и CSR для последующего взаимодействия.

Nuxt.js для Vue.js:
- Фреймворк, предоставляющий мощные возможности для SSR с использованием Vue.js.
- Упрощает создание универсальных приложений с возможностью переключения между SSR и CSR.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Крупнейший университет искусственного интеллекта

Приглашаем на бесплатный однодневный интенсив по AI!

Освой искусственный интеллект для профессионального роста: создавай нейросети, автоматизируй бизнес-задачи и зарабатывай на AI-решениях.

✨ 8 000+ студентов со всего мира

✨ 600+ AI-проектов, созданных студентами

✨ Сборная Университета — победители крупнейших AI-хакатонов России

✨ Стажировки в крупнейших компаниях России (РЖД, Ростелеком, РУДН, Совкомбанк, Самолет и другие)

✨ Трудоустраиваем выпускников в крупнейшие компании (Яндекс, ВТБ, Сбербанк, Роскосмос и другие)

Будем рады видеть тебя в наших рядах!

Узнать больше

#реклама 16+
neural-university.ru

О рекламодателе

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Бесплатный практический вебинар: Веб-разработчик: с нуля до мини-игры за 2 часа.

Когда: 30 января в 19:00 по мск.

Погрузитесь в решение реальной задачи и напишите небольшую игру на HTML, JS и CSS, которая работает прямо в браузере 🎮

Расскажем, что ждут работодатели от джунов, какие есть грейды во фронтенд-разработке и на какую зарплату рассчитывать в перспективе.

Какие JS фреймворки учить: Vue, React, а может, Angular?

Задайте вопросы опытному спикеру, сделайте первый шаг в направлении новой профессии.

🎁 Всем, кто зарегистрировался - гайд «Как заговорить на сленге IT-специалистов», а каждому участнику -  карта компетенций начинающего Frontend-разработчика и гайд «Как опубликовать страницу в интернете при помощи GitHub Pages»

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Колледж + ВУЗ дистанционно в рассрочку от 40 000 в год

Поступи в Колледж «Синергия»!

— Учись в московском колледже, не выходя из дома.
— Полностью дистанционный онлайн-формат.
— Обучайся дома, на работе, в путешествии.
— Поступление круглый год.
— Диплом государственного образца.
— Программа «колледж + вуз» без ЕГЭ.

Рассрочка 0% на весь срок обучения.

Перейти на сайт

#реклама 16+
synergy.ru

О рекламодателе

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Что должен знать каждый frontend-разработчик?

Центр непрерывного образования факультета компьютерных наук НИУ ВШЭ приглашает на бесплатный вебинар, который поможет вам получить ответы на все возможные вопросы о старте карьеры в области frontend-разработки.

На вебинаре обсудим:
〰️〰️〰️〰️
- Фронтенд-разработка: базовые концепции и перспективы индустрии
- HTML и CSS: разметка и стилизация интерфейсов, принципы вёрстки и оформления веб-страниц
- JavaScript: ключевые возможности для фронтенда
- Минимальный набор знаний для стажёра и junior-разработчика: о чём вас спросят на собеседовании
- Инструменты разработки: библиотеки и фреймворки, с которыми предстоит работать
- Практика и ресурсы для обучения: где решать задачи и проходить контесты для оттачивания навыков

Спикер: Семён Гурин, разработчик интерфейсов и бизнес-логики в Кинопоиске
Когда: 30 января в 19:30

Зарегистрироваться на вебинар

Реклама: НИУ ВШЭ ИНН 7714030726
Erid:2SDnjcX3ZLg

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Break camelCase

Создайте функцию, которая разобьет строку в camelCase на несколько слов, разделенных пробелом

Пример

"camelCasing"  =>  "camel Casing"
"identifier" => "identifier"
"" => ""


👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Курс "Дизайн карточек для WB и Ozon". Бесплатно и с нуля

Дизайнер карточек для маркетплейсов — востребованная и доходная профессия 💰
Научись ей бесплатно!

- Бесплатный доступ
- Разбор ДЗ от наставника
- Мощные кейсы в портфолио

Узнать больше

#реклама 16+
yudaevschool24.online

О рекламодателе

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

В сети поделились гениальным лайфхаком, как превратить свой месячный отпуск в двухмесячный

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

📌Есть только 2 способа стать JavaScript Senior:

1. Часами просматривать видео на YouTube, документацию и решать сложные задачи, так и не достигнув ощутимого прогресса.

2. Следить за каналом «JavaScript Senior» и сократить 70% времени на подготовку к собеседованиям и улучшение навыков!

Получай полезные сниппеты, актуальные вопросы с собеседований и будь в курсе последних новинок – подпишись @JavaScriptSenior!

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Дан одномерный массив. Его элементами могут быть значения разных типов, включая: undefined, null, boolean, string, number.

const array = [5, undefined, 0, false, '', null, true, 1]


Массив может быть разрежённым (sparse array), то есть включать незаполненные элементы (empty slots).

Например, добавим к массиву array элемент с индексом 15:
array[15] = 'новый элемент'
console.log(array)
// [ 5, undefined, 0, false, '', null, true, 1, <7 empty items>, 'новый элемент']


Напишите функцию подсчёта незаполненных элементов массива.

В JavaScript массивы — это не отдельный тип данных, а просто объекты. Заполненные слоты массива хранятся под числовыми ключами, а пустые слоты вообще не существуют.

В консоли Chrome Dev Tools пустые слоты отображаются как empty, а в Node.js — empty items. Но это лишь абстрактное представление ситуации, когда поле .length массива не совпадает с ожидаемыми заполненными слотами.

Чтобы проверить наличие значения по ключу, можно использовать оператор in или метод .hasOwnProperty():
const test = new Array(5)
test[2] = 42

2 in test // true
test.hasOwnProperty(2) // true

0 in test // false
test.hasOwnProperty(0) // false


То есть, мы можем пройтись по массиву от 0 до length и проверить отсутвие текущего индекса в качестве ключа. Однако есть способ ещё проще: итератор массива и методы, поверх него, используют только существующие ключи:
const test = new Array(5)
test[2] = 42

test.forEach((value, key) => console.log(`значение по ключу ${key}: ${value}`))
// значение по ключу 2: 42

// консоль вывела значение только один раз


Таким образом, чтобы найти количество пустых слотов, достаточно от длины массива отнять число заполненных значений:
const calcEmpty = items => items.reduce(amount => --amount, items.length)

const test = new Array(5)

test[2] = 42
calcEmpty(test) // 4

test[10] = 2
calcEmpty(test) // 9


👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Зачем нужен ref в React?

ref (сокращение от reference) используется для доступа к DOM-элементам или компонентам напрямую. Он позволяет взаимодействовать с элементами, которые были созданы в процессе рендеринга, предоставляя механизм для манипуляции с ними, получения их размеров, положения или вызова методов у компонент. Это особенно полезно в ситуациях, когда необходимо выполнить операции, которые не могут быть выполнены исключительно через декларативный подход React.

Основные случаи использования ref:

- Доступ к DOM-элементам:
- Использование в сторонних библиотеках:
- Сохранение состояния вне дерева компонентов:

Примеры использования ref:

Установка фокуса на элемент:

import React, { useRef, useEffect } from 'react';

function TextInputWithFocusButton() {
const inputEl = useRef(null);

const onButtonClick = () => {
// Установить фокус на текстовое поле
inputEl.current.focus();
};

return (
<div>
<input ref={inputEl} type="text" />
<button onClick={onButtonClick}>Установить фокус</button>
</div>
);
}

export default TextInputWithFocusButton;


Измерение элемента:
import React, { useRef, useEffect, useState } from 'react';

function MeasureDiv() {
const divRef = useRef(null);
const [dimensions, setDimensions] = useState({ width: 0, height: 0 });

useEffect(() => {
if (divRef.current) {
const { width, height } = divRef.current.getBoundingClientRect();
setDimensions({ width, height });
}
}, []);

return (
<div>
<div ref={divRef} style={{ width: '100px', height: '100px', backgroundColor: 'lightblue' }}>
Измеряемый элемент
</div>
<p>Ширина: {dimensions.width}px, Высота: {dimensions.height}px</p>
</div>
);
}

export default MeasureDiv;


Доступ к методам компонента:
import React, { Component } from 'react';

class CustomComponent extends Component {
customMethod() {
console.log('Метод компонента вызван');
}

render() {
return <div>Custom Component</div>;
}
}

class ParentComponent extends Component {
constructor(props) {
super(props);
this.customComponentRef = React.createRef();
}

handleClick = () => {
this.customComponentRef.current.customMethod();
};

render() {
return (
<div>
<CustomComponent ref={this.customComponentRef} />
<button onClick={this.handleClick}>Вызвать метод компонента</button>
</div>
);
}
}

export default ParentComponent;


Важно помнить

- Прямое управление DOM может нарушить декларативный подход React, поэтому его следует использовать только тогда, когда это действительно необходимо.

- Когда необходимо использовать сторонние библиотеки, которые требуют прямого доступа к DOM-элементам.

- Состояние приложения и его логика должны по возможности управляться через состояния и пропсы React. ref следует использовать для случаев, которые не могут быть решены этим способом.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

🔥Podlodka React Crew – онлайн-конференция для React-разработчиков.

И в новом сезоне ребята решили разобраться, какие инструменты и знания включают в роадмапы профессионального развития и насколько они применимы.

Что в программе:

💬 Говорим на одном языке с пользователями: i18n в React-приложениях Виталий Баев, контрибьютор Next.js и Vite 🌍 Как выбрать инструменты и сделать интерфейс удобным для всех?

📡 OpenTelemetry для фронтенд-разработчика Валерий Катцин, frontend-разработчик в Точке 📊 Как собирать данные о работе приложения и использовать их для улучшения продукта?

🔥 "Долгожданный" React 19 – Алекс Рассудихин, разработчик с опытом во Vue, React, Next и Astro 🚀 Какие фичи вышли в продакшен, а какие – нет?

🤖 AI Integrated Developer Experience – Марк Байдебура, Senior Full-stack Engineer в Influencer 🧠 Где AI реально помогает, а где пока его лучше не использовать?

📅 Конференция пройдет 10-14 февраля.

Ты не просто узнаешь по новые фичи и подходы, но и определишься, какие из них включить в свой roadmap и как расти дальше.

🔗 Регистрируйтесь: podlodka.io/reactcrew

Промокод сообщества
react_crew_2_oMGfq4 даёт скидку в 500 руб 🥳

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Binary Addition

Реализуйте функцию, которая складывает два числа и возвращает их сумму в двоичном виде. Преобразование может быть выполнено до или после сложения

Возвращаемое двоичное число должно быть строкой

Пример:

1, 1  //  "10" (1 + 1 = 2 in decimal or 10 in binary)
5, 9 // "1110" (5 + 9 = 14 in decimal or 1110 in binary)


👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Без опыта вы не найдёте работу в Москве на HeadHunter

Но есть выход: перспективную и престижную работу легко найти в канале «Москва: работа, вакансии, удаленка». Там собраны вакансии для молодых специалистов и тех, кто хочет совмещать учебу с работой.

Вы найдёте лучшие предложения от Яндекса, Сбера, Т-Банка и других крупных компаний, у которых офис в Москва-сити.

Уже нашли вакансию для тебя:
/channel/+FC6cg-3KYF43ZTRi

Подписаться

#реклама
О рекламодателе

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Клавиатура прожжённого разраба

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Хочешь найти работу? Продай себя!

Я написала трилогию из статей по поиску работы, в которых покажу, что надо делать, чтобы компании наняли именно тебя. В этой статье я дам тебе новый взгляд на найм и обучу инструментам, с которыми ты выделишься среди конкурентов. Во второй укажу на ошибки в твоём резюме и мы вместе их исправим, чтобы игнорировать и фильтровать тебя компаниям стало невозможно. В третьей расскажу всё, что знаю про продающую самопрезентацию, благодаря которой ты сможешь получить работу с хорошей зарплатой.

План понятен? Хорошо. Осталась всего одна деталь!

Чтобы моя статья действительно дала тебе пользу, представь: ты заплатил мне за неё 100 тысяч рублей и она написана специально по твоему заказу.

Представил? Отлично, тогда продолжай читать внимательно, ведь деньги ты уже перевел.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Как задать начальные стили для элемента в момент его появления на странице?

При вёрстке сайтов бывает нужно привлечь внимание пользователя к появлению элемента на странице. Например, плавно сменить цвет фона блока в момент загрузки сайта. Или сделать открытие диалога плавным и аккуратным. То есть необходимо осуществить переход из начального состояния элемента в основное. При этом сделать это нужно один раз и именно в момент появления элемента на экране.

Чтобы сообщить браузеру, какие должны быть стили у элемента в его начальном состоянии, используется директива @starting-style.

Пример

.promo-block {
transition: opacity 0.4s ease-in;
opacity: 1;
}

@starting-style {
.promo-block {
opacity: 0;
}
}


В момент загрузки страницы .promo-block будет не виден, так как в начальном состоянии opacity равен нулю. После загрузки страницы применятся стили из основного состояния: opacity будет равен единице и .promo-block отобразится на экране.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Какие методы http запросов знаешь ?

HTTP (HyperText Transfer Protocol) поддерживает множество методов запросов, каждый из которых предназначен для выполнения определенных действий на сервере. Вот основные методы HTTP-запросов, которые широко используются:

GET
Запрашивает данные с сервера.
- Не изменяет состояние сервера (идемпотентный).
- Параметры запроса передаются в URL.
- Кэшируется.
- Можно сохранить в закладках браузера.

GET /api/users?id=123 HTTP/1.1
Host: www.example.com


POST
Отправляет данные на сервер для создания ресурса или выполнения действия.
- Изменяет состояние сервера.
- Данные передаются в теле запроса.
- Не кэшируется по умолчанию.
POST /api/users HTTP/1.1
Host: www.example.com
Content-Type: application/json

{
"name": "John Doe",
"email": "john.doe@example.com"
}


PUT
Отправляет данные на сервер для создания или замены ресурса.
- Идемпотентный.
- Данные передаются в теле запроса.
PUT /api/users/123 HTTP/1.1
Host: www.example.com
Content-Type: application/json

{
"name": "John Doe",
"email": "john.doe@example.com"
}


DELETE
Удаляет ресурс на сервере.
- Идемпотентный.
DELETE /api/users/123 HTTP/1.1
Host: www.example.com


PATCH
Частично обновляет ресурс на сервере.
- Не является идемпотентным, хотя в некоторых случаях может быть.
- Данные передаются в теле запроса.
PATCH /api/users/123 HTTP/1.1
Host: www.example.com
Content-Type: application/json

{
"email": "new.email@example.com"
}


HEAD
Запрашивает только заголовки ресурса, без тела.
- Идемпотентный.
- Используется для проверки наличия ресурса, размера, даты последнего изменения и т.д.
HEAD /api/users/123 HTTP/1.1
Host: www.example.com


OPTIONS
Запрашивает поддерживаемые сервером методы для указанного ресурса.
- Идемпотентный.
- Используется для CORS-запросов, чтобы определить разрешенные методы и заголовки.
OPTIONS /api/users HTTP/1.1
Host: www.example.com


CONNECT
Устанавливает туннель к серверу, обычно используется для прокси-серверов.
- Не используется в обычных RESTful API.
CONNECT www.example.com:443 HTTP/1.1
Host: www.example.com


👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Production Ready GraphQL

Данная книга содержит полное описании того, что входит в создание GraphQL API: дизайн, архитектура, реализация и даже документации.
Примеры в книге не зависят от языка. Вместо этого они фокусируются на концепциях и шаблонах, которые реализуются независимо от того, как вы создаете сервер GraphQL.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Как отрисовать компонент по условию?

В React отрисовка компонентов по условию осуществляется с помощью условных операторов JavaScript внутри JSX. Это позволяет отображать компоненты или элементы только тогда, когда выполняется определенное условие. Рассмотрим несколько способов условной отрисовки компонентов в React.

Использование тернарного оператора:
Тернарный оператор ? : позволяет компактно проверять условие и отрисовывать один из двух компонентов.

Пример:

import React from 'react';

const MyComponent = ({ isLoggedIn }) => {
return (
<div>
{isLoggedIn ? <p>Welcome back!</p> : <p>Please log in.</p>}
</div>
);
};

export default MyComponent;


Логическое И (&&)
Можно использовать логический оператор && для отрисовки компонента только тогда, когда условие истинно.

Пример:
import React from 'react';
const MyComponent = ({ showDetails }) => {
return (
<div>
<h1>Item</h1>
{showDetails && <p>Here are the details...</p>}
</div>
);
};
export default MyComponent;


Условный рендеринг с if...else
Для более сложной логики условного рендеринга можно использовать обычные операторы if...else внутри функции компонента.

Пример:
import React from 'react';
const MyComponent = ({ status }) => {
if (status === 'loading') {
return <p>Loading...</p>;
} else if (status === 'error') {
return <p>Error occurred!</p>;
} else if (status === 'success') {
return <p>Data loaded successfully!</p>;
} else {
return null; // Возвращаем null, чтобы не отрисовывать ничего
}
};
export default MyComponent;


Условный рендеринг с помощью функций
Можно вынести условную логику рендеринга в отдельную функцию для лучшей читаемости и повторного использования.

Пример:
import React from 'react';
const renderContent = (status) => {
switch (status) {
case 'loading':
return <p>Loading...</p>;
case 'error':
return <p>Error occurred!</p>;
case 'success':
return <p>Data loaded successfully!</p>;
default:
return null;
}
};
const MyComponent = ({ status }) => {
return (
<div>
{renderContent(status)}
</div>
);
};
export default MyComponent;


Использование IIFE (немедленно вызываемые функциональные выражения)

Можно использовать IIFE (Immediately Invoked Function Expression) для выполнения более сложной логики рендеринга внутри JSX.

Пример:
import React from 'react';
const MyComponent = ({ isLoggedIn, userName }) => {
return (
<div>
{(() => {
if (isLoggedIn) {
return <p>Welcome back, {userName}!</p>;
} else {
return <p>Please log in.</p>;
}
})()}
</div>
);
};
export default MyComponent;


👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Офер в Яндекс для опытных фронтендеров за два дня

15–16 февраля приглашаем фронтендеров с опытом работы от пяти лет получить офер в Яндекс через multitrack за 2 дня. Достаточно пройти несколько технических секций 15 февраля, чтобы уже 16-го получить офер и выбрать три команды, к которым вам было бы интересно присоединиться.

Как правило, за несколько собеседований сложно понять, подходит ли вам команда и наоборот. Multitrack позволит вам поработать в трёх разных командах Яндекса и выбрать подходящую. Вы сможете погрузиться в рабочие процессы, познакомиться с будущими коллегами и понять, с какими задачами и технологиями хотите работать.

Узнать подробности и зарегистрироваться.

Реклама. ООО "Яндекс". ИНН 7736207543

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Оптимизация React-приложений

Веб-приложения сегодня требуют всё большей интерактивности, отзывчивости и быстродействия. В ответ на это команда React постоянно совершенствует инструментарий, позволяющий нам тонко управлять рендерингом и пользовательским опытом. Если вы работали только с классическими методами оптимизации вроде useMemo, useCallback, мемоизации компонент через React.memo и другими известными приёмами, то вас могут заинтересовать следующие хуки:

useTransition - устанавливает приоритеты рендеринга, разделяя обновления на критические и фоновые.

useDeferredValue - откладывает обновление тяжёлых значений, чтобы интерфейс не фризился при вводе данных.

useOptimistic - помогает реализовать оптимистичные обновления "из коробки".

В этой статье мы разберём ключевые идеи каждого из этих хуков и рассмотрим практические примеры, чтобы стало ясно, как и когда их применять.

👉 @frontendInterview

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Цифровизация бизнеса: советы из первых уст

Хотите идти в ногу с цифровыми трендами? В канале «Цифровизируй это» команда российского вендора корпоративного ПО VK Tech делится опытом и рассказывает, как технологии помогают бизнесу работать эффективнее.

Подписывайтесь, чтобы:

✅ узнать, какие решения работают в реальных кейсах;
✅ перенять опыт тех, кто сам разрабатывает технологии для цифровизации.

Будьте в курсе того, что движет бизнес вперед.

Подписаться

#реклама
О рекламодателе

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Готовишься к собеседованию?

Разбираем для тебя самые актуальные вопросы для подготовки

Выбирай направление:

👩‍💻 Frontend
🖥 Backend
👩‍💻 JS
👩‍💻 Python
👩‍💻 Go
👩‍💻 Java
👩‍💻 C/C++
👩‍💻 C#
👩‍💻 PHP
👩‍💻 QA
📊 SQL
👩‍💻 Git

Читать полностью…

Frontend Interview - собеседования по Javascript / Html / Css

Count consonants

Напишите функцию, которая принимает строку англоязычного текста и возвращает количество согласных в строке.

Согласные - это все буквы, используемые для написания английского языка, за исключением гласных a, e, i, o, u.

Пример:

consonantCount('') => 0
consonantCount('aaaaa') => 0
consonantCount('XaeiouX') => 2


👉 @frontendInterview

Читать полностью…
Subscribe to a channel