Как стать мидлом
1.55K subscribers
530 photos
28 videos
288 links
Помогаем фронтенд-разработчикам прокачать навыки и получить повышение → https://htmlacademy.ru/frontend-engineering

Смотреть шоу «Фронтенд-инженерия» → https://youtube.com/playlist?list=PLQJNT2fdCJnjUCLyAnX8nkxLxWHNSuMDo

Ещё почитать? @htmlacademy
Download Telegram
Комплексная оценка уровня фронтенд-разработчика или техническое собеседование в IT-компании

Представьте, вы год работаете в компании на позиции джуна и уже успели разобраться со многими технологиями. Захотелось роста до мидла. Но тут появляется парочка нюансов… Не можете самостоятельно оценить свои навыки, а в компании всё на словах, нет детализации, плана действий, всё скатывается на «как-нибудь потом». Такая себе перспектива.

Чтобы не терять время в ожидании чуда — записывайтесь на комплексную оценку в Академию.

Пойдём по порядку:

– Оценим ваши навыки по всем технологиям. Выявим сильные и слабые стороны. Дадим ссылки на тренажёры, курсы, лайвы, статьи. Это поможет восполнить пробелы.
– На втором этапе интервью с экспертами «Яндекс», «Связной» — оно даст рекомендации по развитию хард-скиллов.
– В заключение софт-скилловое интервью, которое проверили на себе 150 разработчиков. Психолог оценит ваши навыки и поможет составить план их развития.

Узнать подробности и записаться: https://tml.io/ncbbn
🔥2
Грант от Академии: как выпускник наших курсов начал расти до мидла

В сентябре Академия запустила грант: мы выбрали трёх разработчиков для участия в программе роста. Программа включает три этапа: проверку знаний, обучение и помощь в повышении или трудоустройстве. Сергей Левин первым прошёл оценку навыков и получил план развития.

Наш редактор Анастасия задала Сергею пару вопросов про обучение, а ответы собрала в статью. На интервью поговорили про то, как оценка навыков повлияла на Сергея, как он справился с заданиями и что будет дальше.

Интересно? Скорее читайте: https://tml.io/nnchb
Как HTML Academy помогает стать мидлом?

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

Мы рассказали, как анализируем наши продукты и что в этом помогает, из чего составляем планы развития и как учим грамотно проходить собеседования в IT-компании.

Всё внутри, заглядывайте: https://tml.io/bbgfc
Зачем разработчику знать TypeScript?

Если фронтендер прокачал до совершенства навык вёрстки, то в его карьере наступает новый этап — разработка приложений. Вот там-то и начинается всё самое интересное: фреймворки, библиотеки, паттерны, алгоритмы и данные, ну и конечно, TypeScript. В карточках собрали самое важное об этом языке программирования. Сохраняйте себе или отправьте другу-разработчику.

А чтобы познакомиться с TypeScript поближе и приблизиться к разработке пользовательских интерфейсов, записывайтесь на курс «TypeScript: теория типов». До 24 октября обучение можно взять со скидкой 30%.

Узнать подробности и записаться: https://tml.io/nlloi
У программистов много созвонов, на которых они обсуждают, как будут писать код. При этом созвоны никто не любит, потому что они редко заканчиваются вовремя. Некоторые коллеги умеют захватывать внимание — говорят полчаса, а ощущается это как 5 минут. Но у кого-то и две минуты монолога растягиваются на целую вечность, после которой хочется отключиться и больше никогда не быть онлайн.

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

С помощью дизайн-систем можно улучшить качество кода и уменьшить количество ошибок на этапе тестирования.

Что такое дизайн-система?

Дизайн-система — набор инструментов и правил, упрощающих проектирование на всех этапах: от идеи до реализации.

Почему дизайн-системы стоит использовать

– Снижается уровень хаоса в продукте. Один и тот же элемент можно нарисовать множеством разных способов: варьировать цвет фона и границ, тень, скругления, отступы и другие свойства.
– Дизайн-система сокращает количество доступных вариантов, позволяет сохранить консистентность продукта и переиспользовать параметры в дизайне и коде. Это упрощает дальнейшую поддержку.
– Появляется общий язык для коммуникации дизайнеров и разработчиков. Команда тратит меньше времени на объяснения.
– Команда думает о продуктовых задачах, а не об интерфейсе. Работа над новыми задачами идёт быстрее там, где макеты можно собрать из готовых компонентов в устоявшемся стиле.

Задачи, в которых помогает дизайн-система:

– Ускорить разработку по макетам, собранным на той же системе, за счёт готовых компонентов.
– Сократить время, которое команда тратит на поддержку продукта.
– Улучшить качество кода за счёт его переиспользования. – Чем меньше кода, тем проще за ним следить.
– Сократить количество доработок после тестирования. Если базовые компоненты уже готовы и протестированы, ошибок будет меньше.
– Обеспечить доступность интерфейсов.

Почему дизайн-системы популярны?

Летом 2021 года мы провели исследование (подробнее здесь: https://htmlacademy.ru/blog/job/skill-map) и узнали, какие навыки нужны фронтендерам для повышения грейда. Оказалось, что в список наиболее востребованных качеств входит понимание архитектуры ПО и интерфейсов. При этом если от джунов работодатели ждут понимания методологии БЭМ, Атомик, фреймворков и Bootstrap, то от мидлов требуют ещё и опыт построения дизайн-систем.

Как создать дизайн-систему?

1. Формализуйте и систематизируйте принципы, на которых строится продукт.

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

3. Соберите UI Kit c компонентами, которые уже используются. При необходимости дополните и расширьте их.

4. Реализуйте компоненты в коде. Создайте витрину, где можно познакомиться с компонентом вне продуктового контекста, «в вакууме». Для этого можно использовать готовые решения или создать своё.

5. Сформируйте документацию с используемыми паттернами: указания по раскладке элементов, правила использования отдельных компонентов, tone of voice и другие особенности. Любое решение должно опираться на какой-то принцип или приводить к формулировке нового принципа и дополнению документации.

6. Документация дизайн-системы Consta
Организуйте прозрачный процесс работы над дизайн-системой. Определите, где будет находиться план и бэклог задач, где точка входа по доработкам, где пользователи смогут узнавать про обновления.
«Хочу стать мидлом за полгода». Выпускник Академии участвует в гранте.

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

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

Все интересные интересности уже в статье, скорее читайте: https://tml.io/wrewt
Как регулярные выражения помогают сократить время на разработку

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

Наше недавнее исследование вакансий показало: знание регулярных выражений и навык работы с ними требуется в 24% вакансий продуктовых компаний для фронтенд-разработчиков с опытом больше двух лет.

Давайте разберёмся, что такое регулярные выражения и как грамотно их применять.

Зачем нужны регулярные выражения?

Регулярные выражения — это формальный язык поиска подстроки в строке. Они поддерживаются многими программами: редакторами, системными утилитами, базами данных. Но особенно хорошо возможности этого инструмента раскрываются в языках программирования, в том числе в JavaScript.

Когда можно использовать регулярные выражения?

Типовые задачи в которых регулярные выражения действительно могут пригодиться, не так много. Среди них:

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

Какие типовые задачи решаются регулярными выражениями:
1. Поиск и гибкая замена в коде.
2. Подготовка и обработка данных. Когда вы выносите предварительные данные в текстовый редактор и готовите их для следующих операций.
3. Написание кода с большим количеством одинаковых конструкций.

Регулярные выражения справляются с задачами, которые сложно решить с помощью нативных методов языка, упрощает работу с кодом и даже его написание.
🔥1
5 лайфхаков, как впечатлить рекрутера и не провалиться на собеседовании

Наши друзья из IT-компании Outlines Tech поделились советами, как разработчикам подготовиться к собеседованиям. Лайфхаки составили исходя из личного опыта рекрутеров. Сохраните пост, чтобы не потерять.

🧑‍💻Больше карьерных лайфаков найдёте в тг-канале Outlines Tech. Здесь эксперты рассказывают, как построить карьеру в IT, прокачать скиллы и не выгореть. А еще публикуют вакансии.

👉Переходите по ссылке и подписывайтесь.
👍21🙏1