Senior Frontend - javascript, html, css

2023-07-06 09:30:03 Верстаешь?

Оцени 7 причин пройти наш бесплатный интенсив по Frontend-разработке:

1. Сверстаешь веб-сайт на HTML + CSS;
2. Оживишь страницу с помощью JavaScript;
3. Используешь фронтенд-фреймворк Angular;
4. Подключишь Backend и загрузишь сайт на хостинг;
5. Получишь советы по доработке своего проекта;
6. Добавишь в портфолио 1 качественный проект;
7. Получишь в подарок чек-лист «45 мест для поиска работы».

А главное, ты проведёшь 7 дней в приятной компании Fullstack-разработчика с 10-летним стажем – Романа Чернова.

Проскочить на интенсив бесплатно

Начинаем 11 июля. Открыть/Комментировать

2023-07-05 20:02:04 Progress Bar

В этом видео создается и анимируется заполняемая шкала на HTML, CSS и JS.

@seniorFront Открыть/Комментировать

2023-07-05 12:02:03 Ripped 404 Page

Создано и анимировано на чистом CSS.

@seniorFront Открыть/Комментировать

2023-07-04 19:03:05 interactive puppy

Вёрстка создана на HTML и CSS. Логика следования за курсором реализована в JS.

@seniorFront Открыть/Комментировать

2023-07-04 12:02:05 ​Почему многие программисты не читают книг?

Есть три типичных анти-паттерна:
1. Не читает вообще. Ну там статьи кусочками или блог посты в основном по тем темам, которые нужны по работе.

2. Читает только книги по технологиям. Например ASP.NET MVC или там jQuery in Action. И дальше тишина. Книги по технологиям, конечно, полезны, но это скорее справочники, которые читать в целом не обязательно. Почему не пойти дальше? Не понятно.

3. Читал первые 1–3 года карьеры, а потом перестал. Тут обычно попадается какой-нить Рихтер, опять же технологии, и если повезет пару более фундаментальных книг типа Фаулера. Чего остановился? Все уже узнал? Ничего больше интересного в мире нет?
Все это плохо. Конечно же, обычно люди из этих трех категорий имеют узкий взгляд на вещи, не способы решать более-менее сложные задачи, не знают ФП, не способны вести связную дискуссию по основным проблемам разработки ПО.

Нужно развиваться. И книги — один из лучших способов расширить кругозор, узнать что-то новое, построить в голове модель, заглянуть в голову лучших разработчиков и мотивировать себя на нечто большее.

Откуда это отсутствие интереса? Откуда эти шильды senior developer после трех лет работы?

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

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

Любые оправдания будут выглядеть жалко. Вы работаете в кранче два года? У вас родился ребенок? У вас осенняя депрессия в марте? Вас перевели на скучный проект? На новой работе нет эвкалиптового чая? Всегда можно найти 1–2 часа в день для чтения. Сделайте это, или идите в менеджеры.

@seniorFront Открыть/Комментировать

2023-07-03 23:06:04 Particles - Springs

Создано и анимировано на чистом JS, без использования библиотек.

@seniorFront Открыть/Комментировать

2023-07-03 16:06:00 Frontend meetup (Online)

1. Построение микрофронтендной архитектуры. Первый взгляд, боли и решения —Никита Морозов, АО "МТТ"
В докладе будет представлен путь построения микрофронтендной архитектуры на примере проекта МТС «Exolve», а также поэтапный рассказ об эволюции проекта от webpack до vite, от SingleSPA до собственного решения

2. Бьем монолит. Основные практики — Гузенко Александр IT ONE
Рассмотрим основные подходы к разбиению монолитных фронтедов.

3. Безопасный TypeScript. Защищаемся от any в кодовой базе —Максим Земсков, Яндекс
Как получить максимум безопастности при использования TypeScript. Какие настройки стоит использовать и как улучшить типизацию стандартных функций.

4. Beyond Frontend — Алексей Тюльдюков, VK
Как T-shape подход может помочь фронтенд разработчику стать техническим менеджером

12 июля, начало в 19:00 мск, Среда

Телеграмм канал с анонсами митапов

Регистрация на мероприятие Открыть/Комментировать

2023-07-03 12:02:02 ​Глобальные атрибуты в HTML

Существует категория HTML-атрибутов, которые можно применить к любому или почти любому HTML-тегу.
Пример глобального атрибута, с которым вы точно работаете постоянно — class. Его можно задать абсолютно любому тегу.

Несколько глобальных атрибутов:

contenteditable
Делает любой элемент на странице редактируемым. В качестве значения для атрибута contenteditable используют true или false.

data-*
Это группа атрибутов, позволяющая перекидывать данные между HTML и DOM. Часто используется для взаимодействия с HTML при помощи JavaScript. Если не требуется менять внешний вид элемента, то это удобнее, чем передёргивать классы.

hidden
Не требует явного указания значения, наличие атрибута само по себе означает состояние true. Прячет со страницы любой HTML-элемент. Причём элемент невидим не только для глаз пользователя, но и для скринридеров.

spellcheck
С помощью этого атрибута мы указываем браузеру, что в элементе, которому он задан, нужно проверить правописание. Значение: true или false.

tabindex
Указывает браузеру, нужно ли видеть этот элемент при навигации по странице с помощью клавиатуры. Часто используется для неинтерактивных элементов.
Значение: отрицательное или положительное целое число.

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

@seniorFront Открыть/Комментировать

2023-07-02 19:02:04 Timepicker - Slider

Создано без использования библиотек. Вся логика прописана на чистом JS.

@seniorFront Открыть/Комментировать

2023-07-02 12:02:04 Среднее арифметическое

Напишите функцию, которая рассчитает среднее арифметическое чисел массива. При этом, постарайтесь реализовать эту функцию как можно компактнее.

Пример:
var a = [0, 1, 2];
avg(a) // output should be 1

@seniorFront Открыть/Комментировать