​Расскажите про координаты в браузере.

Чтобы перемещать и позиционировать элементы на экране в браузере имеется система координат. Оси координат начинаются в левом верхнем углу экрана и идут вправо для оси x и вниз для оси y.

Позиционирование с помощью координат может быть относительно окна браузера или относительно отдельного элемента. Всего существует две системы координат: одна начинается от угла HTML-страницы (документа), а вторая от угла окна браузера. С помощью первой можно определять как элемент расположен относительно всей страницы, а с помощью второй – как элемент расположен относительно окна браузера и того что там находится. Объекты события мыши и тач-события содержат координаты места на экране и в документе, где событие произошло: pageX/pageY – для документа, clientX/clientY – для экрана.

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

👉 @frontendInterview

Какие бывают стандартные ошибки в JavaScript и как создавать собственные типы ошибок?

Программа может работать правильно, только если код написан корректно и не содержит ошибок. JavaScript умеет обрабатывать некорректный код и сообщать об ошибке в коде. Существует семь встроенных видов ошибок, также можно создать свои собственные. Встроенные ошибки генерируются самим движком JavaScript при выполнении программы, а пользовательские — создаются с помощью конструктора Error. Оба типа ошибок можно ловить в конструкции try...catch.

Описание всех стандартных ошибок можно найти в прикрепленной статье.

👉 @frontendInterview

👉 @frontendInterview

Web Development and Design Foundations with HTML5, 9th Edition (2018)

Книга знакомит с темами из HTML и CSS, такими как конфигурация текста, цвета и макет страницы, уделяя много внимания дизайну, доступности и веб-стандартам. В книге рассматриваются как непосредственно разработка (HTML5, CSS и JavaScript), так и другие навыки (дизайн, электронная коммерция и стратегии продвижения), которые считаются основополагающими в современной веб-разработке. Акцент на практике поможет читателю начать карьеру веб-разработчика.

👉 @frontendInterview

What is between?

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

Пример:
a = 1
b = 4
--> [1, 2, 3, 4]

👉 @frontendInterview

Как проверить, поддерживается ли определенное CSS свойство в используемом браузере?

Директива @supports позволяет проверить, поддерживает ли браузер свойство, правило, селектор CSS. Если условие срабатывает, то будет выполнен CSS-код, написанный внутри фигурных скобок.

Пример
Если нужно проверить свойство или значение, нужная конструкция записывается сразу в круглых скобках:
@supports (transform: perspective(150px)) {
div {
transform: perspective(150px);
}
}

👉 @frontendInterview

👉 @frontendInterview

Что такое API?

Разные программы могут быть написаны на разных языках.

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

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

Давайте сразу рассмотрим пример: мы работаем в «Twitter» и делаем фичу для браузерного приложения на JavaScript.

Когда нам нужны какие-то данные, мы запрашиваем их у сервера. Однако сервер написан, скорее всего, не на JavaScript, а на каком-то другом языке: Python, C#, Java. Чтобы сервер понял, что мы от него хотим, нам нужно как-то объяснить наш запрос.

Именно для этого нужно API — оно позволяет разным системам общаться, понимая друг друга.

👉 @frontendInterview

Frontend на YaTalks: 30 лет — полёт нормальный!

Что происходит в вебе прямо сейчас обсудят на главной конференции Яндекса для IT-сообщества уже 3-4 декабря.

— Как и чему учиться для написания интерфейсов?
— Как создать универсальную UI-библиотеку?
— Как создать и поддерживать понятную навигацию по документации?
— В какой момент пора создавать новый репозиторий?
— Где найти пользователей для тестирования и как его организовать?
На конференции выступят эксперты из Яндекса, Microsoft, Meta, VK Group, Hexlet, HTML Academy, Evil Martians, Osome, Веб-стандартов и других компаний.

👉 Программа и регистрация по ссылке.

👉 @frontendInterview

​Как создать радиальный градиент в CSS?

Функция radial-gradient используется для задания фона в виде радиального (кругового, эллиптического) градиента.

Самый простой градиент задаётся двумя цветами.
.element {
background-image: radial-gradient(#6e4aff, #49A16C);
}

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

Цветов мы можем перечислить сколько угодно. Браузер сам распределит градиент таким образом, чтобы последний цвет всегда заходил в угол элемента.

Форма градиента задаётся ключевым словом circle или ellipse (по умолчанию).

Мы можем задавать положение центральной точки, используя те же ключевые слова, что и для background-position, но с приставкой at: at left, at top, at right, at bottom, at center (по умолчанию). Значения можно сочетать, чтобы поместить центр градиента в нужный угол элемента: at top left — центр градиента в верхнем левом углу.

👉 @frontendInterview

🔥 Какие навыки нужно освоить JavaScript разработчику, чтобы быть востребованным на рынке труда?

Об этом 13 декабря расскажет Александр Коржиков, Dev IT Engineer в международной финансовой корпорации ING Group.

Александр поделится своим опытом, расскажет, что ждут работодатели от специалистов и какие навыки нужны, чтобы стать заметнее среди коллег, а также представит программу онлайн-курса «JavaScript Developer. Professional».

В конце встречи у вас будет возможность занять место в группе по специальной цене.

👉 Записаться на полезный вебинар https://otus.pw/nNQ0/

👉 @frontendInterview

👉 @frontendInterview

Front-End Development Projects with Vue.js (2020)

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

👉 @frontendInterview