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

Как сохранять мотивацию при разработке в одиночку Один из основных камней преткновения для разработчиков, работающих в одиночку – поддержание мотивации на должном уровне. В последнее время автор вел записи о попытках себя замотивировать, отмечал, что работает, а что не работает. В статье приведены несколько рабочих методов. 👉 @frontendInterview

Разрабатываете бизнес-логику для проекта, но сталкиваетесь с трудностями в выборе между конечными автоматами (state machines) и рабочими процессами (workflows)? Ищете метод, который поможет вам лучше управлять состояниями и процессами в системе? После прохождения нашего вебинара вы сможете эффективно описывать бизнес-логику с помощью конечных автоматов, успешно реализовывать процессы с пакетом workflow и четко понимать разницу между workflow и state machines. Ваша разработка станет значительно более структурированной и управляемой. Встречаемся 2 июля в 20:00 мск в преддверии старта курса «Symfony Framework». Все участники вебинара получат специальную цену на обучение! Спикер Михаил Каморин — Dev Tech Lead в Skyeng, участник и организатор конференций по PHP, член ПК Podlodka PHP Crew. Регистрируйтесь прямо сейчас, чтобы не пропустить бесплатный урок: https://otus.pw/F7XU/ Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru erid 2SDnjcohEAe

Как изменить вид нажатой кнопки? Чтобы пользователь понимал, что его щелчок по кнопке сработал, в момент щелчка меняют вид самой кнопки. Для этого используется псевдокласс :active, который добавляется к селектору button. Стилевые правила для этого селектора определяют вид нажатой кнопки Результат данного примера показан на рисунке ниже. Для селектора button:active используется свойство box-shadow со значением inset, оно создаёт внутреннюю полупрозрачную тень, за счёт чего кнопка кажется вдавленной. 👉 @frontendInterview

👉 @frontendInterview

​Как вывести картинку заданных размеров без искажений? Для элемента <img> размеры картинки задаются с помощью атрибутов width и height. <img src="image/redfox.jpg" alt="Лиса" width="500" height="286"> Если оставить только один размер, к примеру, ширину равную 100%, то браузер высоту вычислит самостоятельно и выведет картинку с сохранением исходных пропорций. Если требуется при гибкой ширине ограничить высоту изображения заданным размером и сохранить исходные пропорции картинки, то есть два метода: - с помощью свойства object-fit; - вывести изображение в виде фона через свойство background. Использование свойства object-fit Свойство object-fit применяется для масштабирования картинки, ограниченной заданными размерами. Значение cover у этого свойства заставляет изображение полностью заполнить область указанных размеров при сохранении пропорций картинки. .hero { width: 100%; /* Ширина */ height: 300px; /* Высота */ object-fit: cover; /* Изображение вписывается в вышеуказанные размеры */ } Центр картинки при масштабировании по умолчанию остаётся в центре области. Не для всех изображений это является подходящим, поэтому с помощью свойства object-position можно задать выравнивание картинки относительно её края object-position: center top; /* Положение изображения */ 👉 @frontendInterview

Такси для бизнеса. Яндекс Go Оптимизируйте свои расходы и повысьте эффективность бизнеса с Яндекс Go Узнать больше #реклама business.go.yandex О рекламодателе

isItLetter Создайте функцию, которая проверяет, является ли переданный символ буквой. Примеры: isItLetter('a') => true, `'a' is a letter` isItLetter('1') => false, `'1' is not a letter` 👉 @frontendInterview

Жемчужины проектирования алгоритмов: функциональный подход В этой книге Ричард Бёрд представляет принципиально новый подход к проектированию алгоритмов, а именно проектирование посредством формального вывода. Основное содержание книги разделено на 30 коротких глав, называемых жемчужинами, в каждой из которых решается конкретная программистская задача. Эти задачи, некоторые из них абсолютно новые, происходят из таких разнообразных источников, как игры и головоломки, захватывающие комбинаторные построения и более традиционные алгоритмы сжатия данных и сопоставления строк. Каждая жемчужина начинается с постановки задачи, формулируемой на функциональном языке пpoгpaммиpoвaния Haskell, чрезвычайно мощном и в то же время лаконичном, позволяющем легко и просто выражать алгоритмические идеи. Новшество книги состоит в том, что каждое решение формально вычисляется из исходной постановки задачи посредством обращения к законам функционального программирования. 👉 @frontendInterview

Атрибут autofocus в HTML5: нужно ли указывать значение? HTML-атрибут autofocus позволяет немедленно после загрузки страницы установить фокус на конкретном элементе. Оба варианта — autofocus="autofocus" и autofocus — верны, однако предпочтение отдается короткой записи autofocus для сокращения и очистки кода. <input type="text" autofocus> При этом, текстовое поле станет активным сразу после завершения загрузки страницы. 👉 @frontendInterview

​Представьте, что вы хотите создавать мощные и интерактивные веб-приложения, но каждый раз сталкиваетесь с трудностями в структуре кода и управлении компонентами. Вы чувствуете, что ваши текущие знания и навыки недостаточны для достижения результата. А теперь представьте, что вы без труда создаете современные веб-приложения с помощью Angular, успешно используя компоненты, TypeScript, RxJS и Reactive Programming. Вы уверенно разрабатываете интерфейсы, которые нравятся пользователям и используете передовые инструменты для упрощения разработки. Хотите это реализовать? Приглашаем вас на практический открытый урок «Angular Framework: работа с Компонентами» 24 июня в 20:00 мск. На вебинаре мы разберём структуру фреймворка Angular и научимся использовать компоненты для создания приложений. А еще создадим приложение при помощи ng терминала, поставляемого Angular, и компоненты, которые отобразим на странице. Этот урок специально разработан для junior-разработчиков, которые хотят познакомиться с фреймворком Angular. Регистрируйтесь прямо сейчас, чтобы не пропустить бесплатный урок: Регистрация Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru Erid 2SDnje2owTg

Успел на созвон 👉 @frontendInterview

Хватит терять время на уже готовый код! Frontend Trends — библиотека фронтендера, где собраны готовые CodePen решения для ежедневных задач. Эффекты при наведении, 3D-анимации, готовые карточки и др. Зашли – сохранили – применили в своём проекте. Пользуйтесь: @trends_frontend

Обучаем Java-разработчиков оплата после выхода на работу В Kata Academy можно выучиться на Java-разработчика бесплатно, а заплатить уже после трудоустройства по специальности из фактической зарплаты. Если задуматься, то все в выигрыше: — ты получаешь работу в Москве или Санкт-Петербурге с хорошей зарплатой, мы получаем процент за инвестиции в тебя; — в наших интересах научить тебя так, чтобы твоя зарплата была как можно выше; — мы прокачиваем твои навыки еще 2 года после курса: проводим выездные мероприятия и мастер-классы — и доходы наших выпускников растут; — мы не зависим от банков и их рассрочек — кризис не повлиял на доступность курсов. Чтобы попасть на курс, нужно выполнить небольшое тестовое задание. Переходи по ссылке и оставляй заявку! Узнать больше #реклама 16+ kata.academy О рекламодателе

Вечный покой .env: как эффективнее удалять закомиченный файл .env из Git-репозитория В этой статье автор рассказывает как удалить файл из репозитория так, чтобы его было трудно откопать. Может быть полезно на случай, если вы залили в репозиторий то, чего там быть не должно. 👉 @frontendInterview

Совет фронтендерам и дизайнерам: Хватит тратить время на поиск макетов Figma Все макеты реальных сайтов, которые заказчики присылают на вёрстку уже нашли и бесплатно выкладывают на канале Figma Portal Пополняйте свое портфолио настоящими работами вместе с @maket_figma

Разбираем как решать задачи на LeetCode ✅ Примеры решений ✅ Пояснения Выбери своё направление: 1. Python 2. JavaScript 3. Java 4. C# 5. Golang 6. С/C++ 7. PHP 8. Kotlin 9. Swift