Frontend Interview - собеседования по Javascript / Html / Css
11.8K subscribers
2.08K photos
115 videos
316 files
521 links
Канал для подготовки к собеседованиям по фронтенду

Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Менеджер по рекламе: @Spiral_Yuri

Купить рекламу: https://telega.in/c/frontendinterview

Канал в реестре РКН:
https://rknn.link/su
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Наглядная разница между джунами и сеньорами

👉 @frontendInterview
24👍4🔥1
Чистый Agile. Основы гибкости

Автор: Роберт Мартин

Agile — это всего лишь небольшая подборка методов и инструментов, помогающая небольшим командам программистов управлять небольшими проектами,… но приводящая к большим результатам, потому что каждый крупный проект состоит из огромного количества кирпичиков. Пять десятков лет работы с проектами всех мыслимых видов и размеров позволяют Дяде Бобу показать, как на самом деле должен работать Agile. Если вы хотите понять преимущества Agile, не ищите лёгких путей — нужно правильно применять Agile. «Чистый Agile» расскажет, как это делать разработчикам, тестировщикам, руководителям, менеджерам проектов и клиентам.

👉 @frontendInterview
👍3
Reverse every other word in the string

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

Пример:
reverse("Reverse this string, please!") =>
"Reverse siht string, !esaelp"

👉 @frontendInterview
Array.of()

Это статический метод, который создаёт массив из переданных ему аргументов. Array.of() и конструктор массива Array() работают практически одинаково. Разница возникает, если передавать этим функциям один аргумент, причём этот аргумент должен быть числом. В этом случае для конструктора Array() аргумент будет считаться длинной массива, а для Array.of() — первым элементом массива.

Пример
Array.of('🐱', 0b001, document.createElement('div')); // ['🐱', 1, div]
Array.of(3); // [3]
Array(2) // [empty × 2] — массив из двух пустых элементов

// Для строк всё работает одинаково
Array.of('котик') // ['котик']
Array('котик') // ['котик']

Array.of(10.5) // [10.5]
Array(10.5) // RangeError: Invalid array length


👉 @frontendInterview
👍51🤔1
Скажите что-то на карьерном

Тинькофф в поиске крутых ИТ-спецов. С компании — профессиональный рост, интересные финтех-задачи, решение бытовых забот и работа там, где вы живете. С вас — выбрать вакансию и откликнуться тут

Реклама АО «Тинькофф Банк» ИНН 7710140679
👍3👎1🤔1
Какое значение примет result?
Anonymous Quiz
9%
undefined
22%
262
68%
2009
👍6
Если ты ждал знак, то это он!
🔹Перед тобой дверь в IT от YKul🔹

За ней тебя ждут:
📌 обучение с опытными разработчиками в комфортном режиме
📌 резюме с проектами, которые ты выполнишь во время обучения
📌 общение с ментором при любых возникающих вопросах
📌 быстрая обратная связь
📌 помощь в трудоустройстве

Кому подойдет обучение:
новичкам, которые хотят сменить работу
всем, кто уже начал обучение IT и хочет его продолжить
программистам, которые хотят выучить новый язык
студентам – после обучения будет возможность пройти практику на проекте, получить документальное подтверждение и кейс в портфолио

Убедись, что тебе подходит формат и содержание занятий: первая неделя обучения – ❗️бесплатно❗️

https://clck.ru/39VQsj

Реклама: ИП Кулагин Андрей Николаевич, ИНН: 740411652688
3👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Мгновенная валидация форм

Кто из нас не знаком с той неприятной ситуацией, когда усердно заполняешь форму, вводишь данные, а потом, с надеждой нажимая на кнопку «Отправить», обнаруживаешь, что что-то пошло не так и все усилия пропали даром? Для этого есть решение — мгновенная валидация при помощи JavaScript!

Отличный пользовательский опыт — ключ к успеху. Валидация форм с помощью HTML не может предоставить того уровня UX (пользовательского опыта), который требуется стандартами веб-разработки. Ему на помощь приходит валидация через JavaScript. Она обеспечивает мгновенную обратную связь при заполнении формы и аккуратно подсказывает, что нужно исправить прежде чем форма отправится.

В этой статье представлено готовое решение и пошаговый разбор того, как оно работает.

👉 @frontendInterview
3
Как создать монорепозиторий с несколькими сервисами, используя Lerna и Yarn?

Для разработчиков построение масштабируемых и поддерживаемых приложений может быть значительным вызовом, особенно при работе с большими кодовыми базами и несколькими сервисами. К счастью, использование подхода монорепозитория в сочетании с мощными инструментами, такими как NX, Lerna и Yarn, может обеспечить упрощенный процесс разработки, который повышает общность кода и возможность повторного использования.

Эта статья нацелена на помощь разработчикам в настройке монорепозитория с использованием NX, Lerna и Yarn. Она включает подробную информацию о начальной настройке, структуре каталогов, управлении зависимостями, тестировании и развёртывании.

👉 @frontendInterview
👍5
This media is not supported in your browser
VIEW IN TELEGRAM
Работаешь все праздники в надежде на премию
Начальство:

👉 @frontendInterview
👍4
Реализуйте полифил для Promise.allSettled

Для начала вспомним работу оригинального Promise.allSettled.

Он принимает коллекцию промисов, начинает одновременно их выполнять и возвращает массив результатов исполнения полученных промисов. Объект каждого результата содержит свойство status. Если status имеет значение fulfilled (выполнено), то объект будет содержать свойство value. Если status имеет значение rejected (отклонено), то объект будет содержать свойство reason. Свойства value или reason будут содержать значение, с которым был выполнен или отклонён промис.

Решение
// На вход приходит массив промисов
Promise.allSettled = (promises) => {
// Запустим все промисы с помощью .all
return Promise.all(
promises.map((promise) =>
Promise.resolve(promise)
// Если промис завершается успешно
.then((value) => ({ status: "fulfilled", value }))
// Если промис был отклонён
.catch((e) => ({ status: "rejected", reason: e }))
)
)
}


👉 @frontendInterview
👍12
Основы алгоритмизации и программирования

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

👉 @frontendInterview
👍3
Хочешь освоить или улучшить свои навыки во фронтенде?

В канале Frontend Developer есть всё необходимое — бесплатные курсы по фронтенду(HTML, CSS, JS , React и др.), готовый код, полезные ресурсы и статьи. А также чат, где мы помогаем друг другу и делимся опытом

Обучайтесь бесплатно вместе с @byFrontDeveloper
👍5
Ordered Count of Characters

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

Пример:
orderedCount("abracadabra") == [['a', 5], ['b', 2], ['r', 2], ['c', 1], ['d', 1]]

👉 @frontendInterview
👍3
Какая разница между hidden, aria-hidden="true", role="presentation" и role="none"?

1. hidden — это HTML-атрибут, который предназначен для скрытия элемента на странице. Это означает, что элемент не будет отображаться в пользовательском интерфейсе и скроется от вспомогательных технологий, но он все ещё существует в DOM.

2. aria-hidden="true" — это атрибут ARIA (Accessible Rich Internet Applications), который используется для указания, что элемент должен быть скрыт от вспомогательных технологий, таких как скринридеры. Это означает, что элемент не будет доступен для слушателей событий или считывания содержимого вспомогательными технологиями, но он все ещё виден в пользовательском интерфейсе.

3. role="presentation" — это ARIA-атрибут, который указывает, что элемент является частью представления или дизайна и не имеет никакой роли в вспомогательных технологиях. Это означает, что роль элемента будет игнорироваться такими технологиями.

4. role="none" — это синоним role="presentation", который тоже указывает, что элемент не имеет роли для вспомогательных технологий. Это означает, что роль элемента не будет доступна для слушателей событий или механизмов навигации вспомогательными технологиями.

👉 @frontendInterview
👍3
Что выведется в консоль?
Anonymous Quiz
54%
true
46%
false
👍12