Make the web less boring

Свёрстано на HTML и SCSS. Анимация реализована при помощи библиотеки Splitting.

👉 @seniorFront

​Когда разработчик тебе врёт: прокрастинация, отмазки и что с этим делать

Бро, если ты хоть раз руководил командой — ты это проходил. На стендапе всё звучит красиво: «делаю задачу, осталось чуть‑чуть», «почти готово», «просто баг странный». А потом проходит неделя, ты заглядываешь в код — и там либо ничего, либо половина сделано, либо вообще не туда копали.

Нет, это не обязательно саботаж. Иногда это банальная прокрастинация, страх ошибиться, потеря мотивации, или просто неумение сказать: «я застрял». Но проблема‑то реальная. Если не ловить и не разруливать — команда тонет в самообмане, а ты — в вечных переносах.

Что с этим делать (без угроз и тотального контроля)

1. Перевести коммуникацию в честный режим
Объясни, что красиво — не значит правильно. Лучше знать о залипании на старте, чем потом спасать сроки всей командой. Разработчик должен понимать, что от его темпа зависят не только задачи в трекере, но и работа коллег, планирование, демо, интеграции. Поделись кейсом, где сам застревал, ошибался, или делал что‑то неэффективно.

2. Ввести демо
Показывать прогресс не в конце спринта, а каждые 2–3 дня. Даже если это мок, даже если недоделано. Смысл — в процессе. Когда человек знает, что будет показ — он меньше залипает и раньше поднимает флаг, если что‑то не так.

3. Работать с мотивацией
Если кто‑то тупит — не значит, что он лентяй. Иногда у человека в жизни творится трэш. Иногда он просто перегорел. Иногда он не понимает, зачем делает задачу.
Не лечи всех одинаково. Один залип — потому что скучно. Другой — потому что боится. Третий — потому что его никто не слушает. И каждому нужен свой подход.

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

5. 1:1 как точка перехвата
Раз в неделю/две — короткая личная встреча. Без контроля. Просто поговорить. Часто люди на стендапе играют уверенность, а на 1:1 выдыхают и говорят, как есть. Слушай, не перебивай, не лечи. Иногда просто выговориться — уже половина решения.

6. Немного чайки - иногда работает
Да, чайка‑менеджмент — зло. Но иногда подлететь, пингануть и улететь — это встряска. Главное — не делать это стилем управления, а применять осознанно и дозировано как лекарства. Иногда это позволяет разбудить команду.

7. Парное программирование
Если задача критична — подключи второго. Даже если это джун. Когда работает пара, залипнуть труднее. А если один решит уйти в закат — второй хотя бы будет в курсе, что происходит.

8. Регулярное ревью кода и процессов
Не формальное, а живое. С разбором решений, обсуждением сложностей, поиском альтернатив. Часто человек тянет, потому что не уверен. А ревью снимает это напряжение и не даёт уйти в глухую оборону.

👉 @seniorFront

Frontend + Летний митап + Суббота = Я.Субботник по разработке интерфейсов 💛

7 июня в Москве Яндекс Go проводит Я.Субботник по разработке интерфейсов. В программе 4 доклада и воркшоп: 

👉 Артемий Карпов расскажет,  как команда выстраивает взаимодействие между разработкой и тестированием при написании автотестов и улучшении семантики приложения
👉 Миша Колосовский покажет, как сделать статические схемы интерактивными и причем тут SVG
👉 Давид Давыдов объяснит, что мы сделали с серверным API и как пришли к одной строчке кода вместо сотни
👉 Серёжа Алейников поделится опытом портирования нативного BDUI в вебе

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

Регистрируйтесь и зовите друзей!

Мероприятие бесплатное. Количество мест в офлайне ограничено — пожалуйста, дождитесь нашего подтверждения.

Человек-клей: как я нашел самого неэффективного сотрудника, чуть не уволил, а оказалось, что на нем все держится

Рано или поздно любой хороший продакт начинает покрывать метриками свою команду. В одной из продуктовых групп так и случилось: продакт ввел метрики, постепенно вычислил самого неэффективного сотрудника — назовем его Петя — и уже готовил бумаги на увольнение. Но во время этого веселого процесса вдруг выяснилось, что общие высокие показатели команды, это заслуга совсем не продакта (опаньки!), а именно «неэффективного» Пети. Потому что Петя оказался «человек-клей». Тот самый парень (или девушка), ради общения с которым собирается команда, который умеет поддержать, вдохновить, снять негатив и вообще настроить команду на продуктивный лад. При этом он вполне может быть распоследним раздолбаем.

👉 @seniorFront

CPC - Spotlight/Highlight (TMNT) 🐢

Реализовано на HTML и CSS. Логика переключения между картинками реализована в JS.

👉 @seniorFront

Creative CSS Round Out Corners Cards

В этом видео создаются карточки со скругленными углами на HTML и CSS

👉 @seniorFront

Было?

👉 @seniorFront

Media Player Widget

Анимации реализованы при помощи библиотеки TweenMax.

👉 @seniorFront

Ты IT-специалист и застрял на уровне Junior+/Middle и не знаешь, что делать дальше?

Каждый айтишник хочет перестать постоянно выполнять рутинные задачи, начать расти, занимать лидирующие позиции и выполнять интересные проекты, НО... не достигают этого из-за того, что обесценивают себя и не выстраивают систему!

10 июня с 14:00 до 18:00 пройдет оффлайн-нетворкинг «Карьерный хакатон: ВЗЛОМ УРОВНЯ MIDDLE», на котором разберём как тебе с текущими ресурсами пробить свой потолок и сделать рывок!

Что тебя ждёт:
🚀 Один день — один карьерный скачок
Ты не просто слушаешь. Ты разбираешься в себе, получаешь идеи от команды и собираешь прототип своей новой стратегии. Всё — за один день.

🧠 Мастер-майнды с трекерами
Реальная работа в мини-группах, где каждый получает фокус внимания и поддержку от трекера и команды. Выйдешь с понятным карьерным вектором.

🎤 Выступление Владилена
Как пробить потолок уровня Middle, перестать буксовать и выстроить карьеру осознанно — через личный опыт и практику.

👥 Тот самый нетворкинг
Тут будут айтишники, у которых такие же вопросы, как у тебя. Разговоры, которые действительно цепляют. А не просто small talk за кофе

🎙Спикер: Владилен Минин
На рынке IT с 2013 года, более 6 лет обучает IT-специалистов. 40 000+ человек прошло онлайн-курсы, 76% выпускников устраиваются в течение трех месяцев. Общая аудитория: 300к+

Стоимость: 1990₽
Длительность: 4 часа
Дата и время: 10 июня с 14:00 до 18:00
Место: г. Москва, Москва-Сити Башня Федерация

Для участия в мероприятии переходи по ссылке

Product page

Эта страница товара с выбором цвета реализована на чистом CSS.

👉 @seniorFront

Simple CSS Claymorphism Icon Hover Effects

В этом видео создаются иконки с эффектом при наведении на HTML и CSS.

👉 @seniorFront

Hover slider

Логика работы слайдера, а также переключение темы реализованы в JS.

👉 @seniorFront

parseInt() reloaded

Ваша задача - создать конвертер строки в число. Входящая строка представляет собой число, записанное словами.

Примеры:

 "one" => 1
 "twenty" => 20
 "two hundred forty-six" => 246
 "seven hundred eighty-three thousand nine hundred and nineteen" => 783919

👉 @seniorFront

Топ нейросетей 2025: маст-хэв для IT-специалиста

В этой статье собраны наиболее интересные и практически полезные нейросети, заслуживающие вашего пристального внимания в 2025 году. Это не просто очередной список, а подробный гайд: мы детально разберем каждую модель или инструмент, рассмотрим их ключевые функции, преимущества и потенциальные сценарии использования в вашей повседневной IT-деятельности.
Наша цель – помочь вам сориентироваться в этом быстрорастущем мире AI-решений и выбрать те, которые смогут принести реальную пользу именно вам. Пристегните ремни, мы погружаемся в мир передового ИИ, который уже сегодня меняет правила игры!

👉 @seniorFront

Как значения box-size влияют на размер элемента?

Значения свойства box-sizing в CSS определяют, как учитываются отступы (padding) и рамки (border) при расчете размера элемента (width и height). Это влияет на окончательные размеры и внешний вид элемента на странице.

Значение content-box
Это значение по умолчанию для всех элементов. Когда вы устанавливаете размеры элемента с box-sizing: content-box, ширина и высота элемента включают только содержимое (content), но не включают отступы и рамки.

.element {
    box-sizing: content-box; /* значение по умолчанию */
    width: 200px;
    padding: 20px;
    border: 10px solid black;
}

Расчет размера
Ширина - 200px (содержимое) + 20px (отступ слева) + 20px (отступ справа) + 10px (рамка слева) + 10px (рамка справа) = 260px.
Высота - аналогично рассчитывается с учетом отступов и рамок сверху и снизу.

Значение border-box
При использовании значения border-box, размеры элемента (width и height) включают содержимое, отступы и рамки. Это делает расчет размеров более простым и предсказуемым.

.element {
    box-sizing: border-box;
    width: 200px;
    padding: 20px;
    border: 10px solid black;
}

Расчет размера
Ширина - 200px уже включает отступы и рамки, то есть фактическая ширина содержимого будет 140px (200px - 20px (отступ слева) - 20px (отступ справа) - 10px (рамка слева) - 10px (рамка справа)).
Высота - аналогично, высота включает отступы и рамки.

Пример для сравнения

<div class="content-box">Content-box</div>
<div class="border-box">Border-box</div>

div {
    margin: 10px;
    padding: 20px;
    border: 10px solid black;
}

.content-box {
    box-sizing: content-box;
    width: 200px;
    height: 100px;
}

.border-box {
    box-sizing: border-box;
    width: 200px;
    height: 100px;
}

👉 @seniorFront

Star Wars Imperial Army's Product Slider

Свёрстано на HTML и SCSS. Логика работы слайдера реализована библиотекой Swiper.

👉 @seniorFront

​Soft skills которые изменили мою жизнь и могут изменить вашу

Четыре года назад я упёрся в стену. Я работал QA инженером, изучал инструменты, автоматизацию, базы данных — но карьерного роста не было. Мне хотелось развиваться, двигаться в сторону тест-менеджмента, но одних технических навыков оказалось недостаточно. Тогда я впервые осознал, что не только харды определяют успех.

Когда я понял, что без soft skills дальше не продвинусь, встал следующий вопрос: как их прокачивать? С хардовыми навыками всё просто — изучаешь инструмент, пишешь код, набиваешь руку. А вот с софтами всё сложнее. Их нельзя «выучить» по книжке, они развиваются только через практику.

Я начал с того, что выбрал навыки, которые нужны на следующем карьерном уровне. Если хочешь вырасти до сеньора или лида, логично начать прокачивать то, что потребуется в этих ролях:

1. Планирование
Раньше я не уделял этому внимания, но как только начал ежедневно планировать задачи, продуктивность выросла. Ведение списка дел, расстановка приоритетов, контроль за выполнением — всё это делает работу эффективнее.

Как я прокачивал:
- Каждый день с утра составлял план, учитывая задачи на день и ближайшую неделю.
- Раз в полгода прописывал стратегические цели и следил за их выполнением.
- Участвовал в командных планированиях, анализировал, как это делают другие.

2. Многозадачность
Считается, что многозадачность вредна, но в реальности важно не разбрасываться, а грамотно переключаться между процессами. Благодаря планированию я структурировал работу и смог заниматься сразу несколькими активностями.

Что помогло:
- Разделение задач на основные и второстепенные.
- Чёткое понимание приоритетов: что критично, а что можно отложить.
- Использование техник тайм-менеджмента, чтобы не терять фокус.

3. Наставничество
Менторство не только помогает новичкам, но и развивает самого наставника. Я начал помогать коллегам с онбордингом, составлять планы развития и отслеживать прогресс. Со временем это привело к тому, что я начал формулировать задачи понятнее, структурировать знания и лучше видеть слабые места в процессах.

Как я развивал этот навык:
- Помогал новым сотрудникам адаптироваться, отвечал на их вопросы.
- Разбирал сложные темы вместе с коллегами, объяснял, как устроены процессы.
- Составлял планы развития и контролировал их выполнение.

4. Постановка и контроль задач
Это навык, который делает специалиста более ценным. Если ты не просто выполняешь задачи, а умеешь их формулировать, раздавать и контролировать — ты уже на шаг впереди.

Как я прокачивал:
- Вёл встречи команды тестирования, ставил задачи на анализ, тестирование, документацию.
- Внедрил практику ревью тест-кейсов, что повысило качество работы.
- Следил за выполнением поставленных задач, анализировал причины срывов сроков.

5. Фасилитация встреч
Без этого навыка невозможно эффективно работать в команде. Я начал организовывать встречи между тестировщиками, разработчиками и менеджерами. Важно не просто поговорить, а зафиксировать договорённости и добиться их выполнения.

Что я делал:
- Проводил «3 Амиго» — встречи между тестировщиками, разработкой и менеджментом для уточнения требований.
- Вёл записи обсуждений, фиксировал итоги, контролировал выполнение решений.
- Следил за тем, чтобы встречи были продуктивными, а не превращались в пустую болтовню.

👉 @seniorFront

«Люди сами не знают, чего хотят»: как читать сигналы команды

В этой статье мы поговорим о том, что на поверхности не лежит, но разрушающим эхом бьёт по эффективности команды. Это — сигналы недовольства, усталости и скрытого сопротивления, которые члены команды подают… молча. Тема тонкая, неудобная и потому часто игнорируемая. Но если вы — тимлид, который не просто управляет задачами, а работает с людьми, вам нужно уметь слышать не только сказанное, но и несказанное.

👉 @seniorFront

Scroll List Animation

Плавная прокрутка реализована библиотекой smooth-scrollbar

👉 @seniorFront

Image Hover Effect

В этом видео создаются карточки, анимированные при наведении на CSS.

👉 @seniorFront