Найти тему
HTML Academy

Как стать разработчиком в 2022

Оглавление

Познакомьтесь с основными направлениями

В разработке сайтов обычно участвуют фронтенд-, бэкенд- и фулстек-разработчик. Быстро пробежимся по основным отличиям и расскажем, кто чем занимается. Если вы уже знакомы с этим направлениями, можете пропустить блок.

Фронтенд-разработчик. Отвечает за видимую часть сайта. Получает макет от дизайнера и превращает его в готовую страницу — расставляет на места все элементы и проверяет, что всё правильно работает на разных экранах. Вёрстку пишет на языках HTML и CSS, оживляет страницу и делает так, чтобы кнопки работали на JavaScript, а с макетами работает в Figma.

Бэкенд-разработчик. Занимается той частью сайта, которую не видно. Он работает с информацией, которую сохраняют пользователи, и делает так, чтобы всё это сохранилось, где нужно, а потом отобразилось, где попросят. Бэкенд может быть «тяжёлым» — его пишут на PHP, Python или Ruby, или «лёгким» — его пишут на JavaScript с помощью Node.js.

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

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

Начните с бесплатных материалов

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

У нас в Академии для всех зарегистрировавшихся доступны бесплатные курсы по основам HTML и CSS, JavaScript и PHP, мы называем их тренажёры.

Каждый тренажёр — это практические задания, которые выполняются в редакторе кода, встроенном в браузер. Задание сопровождается кратким блоком теории, а для удобства запоминания ко многим тренажёрам прилагается конспект с основными понятиями и терминами.

интерфейс тренажёра
интерфейс тренажёра

Сюжет тренажёров строится вокруг приключений кота Кекса, который ищет себе подрядчиков для работы в веб-студии. Задания максимально приближены к реальным задачам веб-разработчика. Ученики сразу применяют теорию на практике, проходя задания будто уровни в игре. Это мотивирует выполнять все задания и не бросать тренажёр на половине. И потом — кто не любит котиков?

Вот ссылки на бесплатные части:

Тренажёр «Знакомство с HTML и CSS»

Изучаем основы HTML и CSS. На практике разбираемся с семантической разметкой и базовыми механизмами стилизации на примере небольшого сайта.

Тренажёр «Знакомство с JavaScript»

Узнаем, как работает JavaScript в браузере. Научимся оживлять интерфейсы. Будем решать задачи, с которыми регулярно сталкиваются веб-разработчики.

Тренажёр «Знакомство с PHP»

Познакомитесь с основами PHP и разберётесь, как работает внутренняя часть сайта.

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

Составьте план обучения

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

-3

Как составить план

  1. Найдите роадмап или карту компетенций по выбранной вами специальности. Ищите самый свежий, потому что технологии и требования всё время меняются.
  2. Посмотрите вакансии, которые сейчас открыты для фронтенд-, бэкенд- или фулстек-джунов, чтобы сверить ваш роадмап с требованиями на рынке. Если видите, что какая-то технология часто появляется в вакансиях, обязательно добавьте её в ваш план.
  3. Распишите языки и технологии, которые нужно изучить.
  4. Поставьте себе дедлайны и распределите нагрузку.

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

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

А ещё у нас есть готовый шаблон развития джуна в Notion, можете воспользоваться им.

-4

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

Начните практиковаться

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

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

Такие проекты можно будет положить в портфолио, что облегчит поиск работы.

Где взять тренировочный макет для практики

Frontend practice — большая библиотека проектов с подсказками. Берёте проект, верстаете, помощь найдёте там же.

Behance или Dribbble — можно вбить в поиск free website/app layouts и выбрать «Веб-дизайн» в разделе «Области творчества».

Figma community — через поиск можно найти много макетов, обычно у всех лицензия CC BY 4.0, но лучше проверить, чтобы потом не было неловко.

Если будете брать макет на Бехнасе, Дрибле или в сообществе Фигмы, проверяйте лицензию, должна быть CC BY 4.0 или можно написать авторам работ, чтобы получить разрешение на использование макета для программирования. Не забудьте объяснить, что вам только для портфолио, а не для коммерческого использования.

В Академии тоже есть макеты для вёрстки

Проекты делятся по уровню сложности и идут в комплекте с пошаговым планом вёрстки, эталонным решением и полезными ссылками для самостоятельного изучения.

Когда вы сделаете первый проект, пора переходить к оформлению портфолио и резюме.

Оформите портфолио

Чтобы начать поиск, достаточно двух-трёх проектов, которые будет не стыдно показать.

Чаще всего разработчики собирают портфолио на GitHub. Так будущий работодатель сразу может посмотреть качество вашего кода и процесс создания проекта.

Инструкция по созданию портфолио на GitHub

  1. Регистрируйтесь на GitHub;
  2. В профиле ставите на аватар фотографию, хорошо, если на ней будете вы;
  3. Указываете контакты для связи;
  4. Создаёте репозиторий, даёте ему название, например, «projects» или «portfolio»
  5. В репозиторий пушите проекты.

Готовы начать?

Мир разработки большой, место найдётся для каждого. Главное учиться и качать навыки.

Чтобы сделать первый шаг в айти прямо сейчас — регистрируйтесь и приступайте к первой тренировке.