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

​Почему не стоит использовать краткую запись свойств CSS? Существует небольшая, но на удивление важная проблема, которую я часто замечал в коде других людей — это использование краткой записи свойств CSS. Когда мы пишем что-то вроде этого:

 .btn {
   background: red;
 }

Мы всего лишь хотим, чтобы у нашей кнопки был красный фоновый цвет. Но на самом деле мы задаем целый набор правил: CSS .btn { background-image: initial; background-position-x: initial; background-position-y: initial; background-size: initial; background-repeat-x: initial; background-repeat-y: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: red; } За счет простого использования краткой записи, мы безоговорочно решили, что не хотим использовать фоновое изображение, заодно указав для него стартовую позицию с левого верхнего края, повторение по осям x и y и прокрутку вместе с элементом и т.д. Почти все проблемы, баги и регрессии в CSS происходят из-за того, что мы делаем слишком многое слишком рано, а через некоторое время сталкиваемся с последствиями этого. Из этого факта следует один простой вывод: в CSS вам нужно делать лишь то, что нужно и ничего более. 👉 @frontendInterview

😎Освой продвинутые инструменты фронтенда — изучи React! 6 февраля в 20:00 мск пройдет открытый урок «Хуки и мемоизация» в рамках онлайн-курса «React.js Developer» OTUS. На занятии мы научимся эффективно использовать возможности React.js и избегать лишних рендеров. Занятие будет полезно frontend JavaScript разработчикам и начинающим React разработчикам. 👉 Пройдите вступительный тест для регистрации https://otus.pw/zexL/

👉 @frontendInterview

Как работать с датами и временем в JavaScript? В JS есть встроенный объект: Date. Он содержит дату и время, а также предоставляет методы управления ими. Например, его можно использовать для хранения времени создания/изменения, для измерения времени или просто для вывода текущей даты. Для создания нового объекта Date нужно вызвать конструктор new Date() Без аргументов – создать объект Date с текущими датой и временем: let now = new Date(); alert( now ); // показывает текущие дату и время Существуют методы получения года, месяца и т.д. из объекта Date:

 getFullYear()

Получить год (4 цифры)

 getMonth()

Получить месяц, от 0 до 11.

 getDate()

Получить день месяца, от 1 до 31, что несколько противоречит названию метода.

 getHours(), getMinutes(), getSeconds(), getMilliseconds()

Получить, соответственно, часы, минуты, секунды или миллисекунды. Больше про объект Date можно узнать в статье. 👉 @frontendInterview

Найти пропавшую букву Напишите функцию, которая принимает массив букв в алфавитном порядке, следующие друг за другом. При этом одна буква будет пропущена. Функция должна вернуть пропущенную букву. Примеры: ["a","b","c","d","f"] -> "e" ["O","Q","R","S"] -> "P" 👉 @frontendInterview

Pro MERN Stack: Full Stack Web App Development with Mongo, Express, React, and Node (2017) Соберите полный стек, необходимый для создания современного веб-приложения, используя React: MongoDB (база данных NoSQL) и Express (фреймворк для серверов веб-приложений), который работает на Node (JavaScript на стороне сервера), очень хорошо дополняют React. В этой книге также будут рассмотрены многие другие инструменты, необходимые для создания полноценного веб-приложения: React Router, React-Bootstrap, Redux, Babel и webpack. 👉 @frontendInterview

Сборка мусора в JS Управление памятью в JavaScript выполняется автоматически и незаметно. Мы создаём примитивы, объекты, функции… Всё это занимает память. Основной концепцией управления памятью в JavaScript является принцип достижимости. Если упростить, то «достижимые» значения – это те, которые доступны или используются. Они гарантированно находятся в памяти. Любое другое значение считается достижимым, если оно доступно из корня по ссылке или по цепочке ссылок. В интерпретаторе JavaScript есть фоновый процесс, который называется сборщик мусора. Он следит за всеми объектами и удаляет те, которые стали недостижимы. Простой пример

 // в user находится ссылка на объект
 let user = {
   name: "John"
 };

Глобальная переменная user ссылается на объект {name: "John"} Если перезаписать значение user, то ссылка потеряется: user = null; Теперь объект John становится недостижимым. К нему нет доступа, на него нет ссылок. Сборщик мусора удалит эти данные и освободит память.

👉 @frontendInterview

👉 @frontendInterview

Сколько нужно времени, чтобы освоить востребованную профессию фронтенд-разработчика? Всего 10 месяцев! Вы можете совмещать обучение с любым своим занятием. Главное условие - желание. В Xeкслете вы можете пройти онлайн-курс по профессии «‎Фронтенд-разработчик». Во время программы вы: ✔️ Изучите JavaScript в связке с HTML и CSS. ✔️ Освоите React для создания сложных компонентов, которые легко поддерживать и использовать повторно. ✔️ Решите более 310 задач в браузере. ✔️ Создадите 4 проекта для портфолио на GitHubВыполните 150 тестовых заданий от наших партнёров. ✔️ Научитесь работать с чужим кодом и оформлять пул-реквесты в Open Source проектах. Обучение построено так, что его невозможно «отсидеть» или «прослушать». Мы не сторонники подхода «повтори за учителем»: вы будете не просто писать код, а научитесь самостоятельно находить лучшие решения. 📌 Пройдите первые 10 бесплатных уроков из профессии и получите дополнительно скидку 10% !

🟡Хардкорный тест по JS — Ответьте на 19 вопросов и проверьте, насколько хорошо вы знаете язык. Сможете сдать — пройдёте на продвинутый онлайн-курс по React.js со скидкой! 🚀За 4 месяца вы научитесь продвинутым возможностям Redux, Redux-Saga, Redux-thunk; созданию SPA-приложений и оптимизации их для production; чистому и лаконичному коду с TypeScript; применению интеграционных и юнит-тестов; работе в GraphQL, Apollo, Relay. 👉🏻ПРОЙТИ ТЕСТ ОНЛАЙН-КУРСА ПО REACT.JS

TypeScript Пересечение (Intersection Type) Пересечение (Intersection) - мощный механизм TypeScript, который позволяет рассматривать множество типов данных, как один. Пересечение указывается с помощью оператора амперсанда &, по обе стороны от которого указываются типы данных. Переменной, которой был указан тип пересечение A и B и С может быть присвоено значение, которое принадлежит к типам A и B и C одновременно.

 name: A & B & C; 
// значение должно принадлежать ко всем типам одновременно

👉 @frontendInterview

👉 @frontendInterview

​Как вырасти от junior до middle? Middle-специалист отличается не только опытом и уровнем владения технологиями, но и софт скилами. Курс Яндекс Практикума «Мидл фронтенд-разработчик» составлен так, чтобы вы могли освоить и то, и другое а ещё: •разработать мессенджер, используя только JavaScript, Typescript, CSS и API браузера; •познакомиться с теорией и отработать её на практике в больших проектах; •научиться брать ответственность за решения и вкладываться в общий результат; •самостоятельно декомпозировать задачи и распределять время;•исследовать смежные сферы программирования, без которых невозможен фронтенд: •информационную безопасность, прототипирование интерфейсов, командную работу, DevOps, ООП. На всех этапах вас будут сопровождать опытные разработчики: мы не дадим просесть по учёбе и поможем выкроить время на образование. Вы будете практиковаться на реальных кейсах и положите в портфолио работающие проекты. А карьерные консультации подготовят вас к разговору о повышении или помогут с поиском новой работы. Начать учиться 👉 @frontendInterview