Видит сайт насквозь: чем занимается веб‑разработчик и как им стать

Веб-разработка началась в 1990-х годах с появления интернета. Позже эти первые 10 лет развития сети назовут эпохой web 1.0. Сначала сайты были простыми HTML-страницами и по функциям напоминали библиотеку — посетители заходили, читали, но никак с ними не взаимодействовали. Публиковать контент было сложно — требовались технические навыки, которые были доступны в основном учёным и программистам.

Сам HTML разработали для нужд CERN — Европейской организации по ядерным исследованиям, чтобы обмениваться научными документами. Но тогда никто из учёных не мог представить, насколько далеко зайдёт эта разработка.

Первый веб-сайт в 1991 году выглядел примерно так. Его разработал британский физик Тим Бёрнерс-Ли. Сайт был посвящен технологии World Wide Web и содержал базовую информацию о проекте: как он устроен и что нужно для работы с веб-сайтами. Источник: CERN

Web-разработка делится на два направления: фронтенд и бэкенд. Разница между ними в частях проекта, на которых они работают.

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

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

Фулстек-разработчик (от англ. full stack — «полный набор») силён в обоих направлениях. Он занимается и клиентской, и серверной частью сайта. Участвует во всём цикле веб-разработки и знаком с основными языками, технологиями и фреймворками как для фронтенда, так и для бэкенда.

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

Спрос на разработчиков сайтов в ближайшее время будет расти по двум причинам:

1. Число пользователей интернета постоянно увеличивается. По данным исследования Global Digital 2023, в 2022 году число пользователей интернета достигло более 5 миллиардов человек — это 64,4% населения Земли. Всё больше компаний переносит бизнес в онлайн, поэтому нуждается в разработке сайтов и приложений.

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

«Хедхантер» по запросу «веб-разработчик» выдает 1506 результатов. Сервис Zarplan весной 2023 года проанализировал 408 вакансий с указанной зарплатой и вывел медианную зарплату веб-разработчика в России — 103 000 ₽. Если рассматривать каждое направление web-разработки отдельно, медианные зарплаты будут другими:
● фулстек-разработчик — 155 000 ₽;
● бэкенд-разработчик — 195 000 ₽;
● фронтэнд-разработчик — 179 000 ₽.

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

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

2. HTML / CSS — две связанные технологии, которые используют для определения структуры и стиля веб-страниц. Например, HTML может определить, где на странице разместить текст, картинки и другие элементы, а CSS добавляет визуальные элементы — цвет и шрифты.

3. React, Angular и Vue.js — фреймворки JavaScript, которые разработчики используют для создания пользовательских интерфейсов. Фреймворк – это готовый код для решения типовых задач. Например, задать маршрут для данных от сайта к серверу, обновить их или сохранить, если пользователь переходит в другой раздел сайта или приложения. Пользователь не видит все эти процессы, но разработчик должен их запрограммировать, чтобы приложение работало, как задумано. Если писать код для таких задач на обычном JavaScript, это займёт много времени и можно допустить в нём ошибки. Во фреймворке прописаны правила и ограничения для кода, поэтому он получается более однообразным, предсказуемым и с меньшим количеством ошибок. Так писать приложения получается быстрее — разработчик фокусируется на сути продукта, а не технических деталях.

4. TypeScript — это расширение JavaScript. С ним код более надёжный и читабельный.

5. Node.js — это среда выполнения JavaScript, которая позволяет разработчикам создавать серверные приложения на этом языке. Например, можно разработать сервер электронной почты, чтобы отправлять и получать сообщения. Другой пример бэкенда на Node.js — социальная сеть, где пользователи могут заполнить профиль и запостить фото с подписью.

6. Python — язык программирования, который поддерживает многопоточность и может выполнять одновременно несколько задач. С этой функцией веб-приложение можно усложнять и не бояться, что оно будет зависать. У Python много библиотек и фреймворков, которые помогают быстрее и проще писать код.

7. PostgreSQL — одна из лучших реляционных SQL баз данных. Её используют для хранения, организации и управления большими объёмами структурированных данных. Такую базу может внедрить онлайн-магазин — чтобы хранить данные о клиентах, заказах, товарах и складах.

8. MongoDB — одна из популярных нереляционных No-SQL баз данных, часто используется в стеке с Node.js на бэкенде.

В веб-разработку часто приходят специалисты с опытом в IT:

1. Дизайнеры — часто у них есть навыки в HTML и CSS, которые используются для создания интерфейса и макетов веб-сайтов.
2. Контент-менеджеры — работают с CMS-системами, такими как WordPress, и могут базово разбираться в HTML и CSS.
3. Инженеры по качеству ПО — тестируют программное обеспечение на соответствие техническим требованиям. Понимают, как работают веб-приложения.
4. Системные администраторы — у них есть знания в области сетевых протоколов и конфигурации серверов, что может быть полезно при развёртывании веб-сайтов.
5. Маркетологи — разбираются в SEO-оптимизации и как работают механизмы привлечения посетителей и поисковых систем на сайт.

Если опыта в IT нет, то начать стоит с основ веб-программирования. Например, базово освоить Python или Java и основные концепции: переменные, циклы и условия. Затем перейти к основам веб-разработки — изучить HTML, CSS и JavaScript. Это поможет понять, как создавать web-страницы и добавлять на них интерактивность.

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