Как стать веб-программистом с нуля самостоятельно? Часть 1.

В 21 веке, веб-разработчик - самая популярная сфера деятельности. Неудивительно, что открываются десятки онлайн-курсов и очных программ, которые помогают стать веб-программистом и найти высокооплачиваемую работу.
Отличные курсы можно найти на следующих сайтах: Lynda, Udacity, Coursera, Thinkful, General Assembly и других.
Ниже приведено практическое руководство, с помощью которого можно развить востребованные навыки и качества веб-программиста с нуля, найти высокооплачиваемую работу и стать превосходным специалистом. В основу анализа навыков легли следующие данные:

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

Руководство по обучению программированию

Веб-разработчик (full-stack) - это тот, кто может работать как с UI-разработкой(front-end), так и с серверной(back-end) частями приложения. Front-end обычно та часть приложения, которую пользователь будет видеть и взаимодействовать с ней, а внутренняя часть - это часть приложения, которое обрабатывает логику, взаимодействие с базами данных, аутентификацию пользователя, конфигурацию сервера и т.д. Должность Full-stack программиста не означает, что обязательно досконально знать все, что необходимо для работы и с интерфейсом, и с серверной частью. Однако, считается, что кандидат должен иметь навыки для работы со всеми частями приложения и иметь понимание, что происходит при создании приложения.
Для того, чтобы стать высококвалифицированным веб-разработчиком и устроиться на свою первую работу, ниже приведено справочное руководство со списком технологий, которые рекомендуется изучить.

1. HTML/CSS

Почти каждая обучающая программа (онлайн-курс или индивидуальные занятия), посвященная веб-разработке, начинается с HTML и CSS. Эти технологии - это строительные блоки Интернета. HTML позволяет добавлять контент на сайт, а CSSпомогает красиво оформить этот контент. Следующие темы, связанные с HTML/CSS, часто задают на собеседованиях и встречаются на реальных проектах на работе:

• Семантическая вёрстка
• Рассказать про CSS Box Model
• Преимущества препроцессоров CSS (не обязательно знать, как использовать их на глубоком уровне, но необходимо понимать, для чего они нужны и как они помогают при разработке). На русском языке можно прочитать тут.
• Медиа-запросы (и на русском тут) для настройки различных устройств и написания отзывчивого CSS.
• Bootstrap (фреймворк для поддержки дизайна и компоновки содержимого на странице. Многие онлайн-программы или школы в основном фокусируются на обучении Bootstrap, но на самом деле более важно иметь глубокие фундаментальные знания CSS, чем конкретные функции и методы Bootstrap).

2. Javascipt

Разумное продолжение HTML/CSS - это JavaScript

Язык JavaScript становится все популярнее с каждым годом. Новые библиотеки, фреймворки и инструменты выпускаются чуть ли не каждый месяц. Основываясь на опросе разработчиков Stack Overflow 2016, JavaScript является самым популярным языком как для Front-End, так и для Back-End разработки. Это единственный язык, который работает в браузере и может использоваться как серверный язык программирования(например, Node.js). Ниже приведены некоторые темы, которые нужно понимать разработчику Full-Stack:

• Понять, как работает DOM. Также необходимо знать, что такое JSON и как с ним работать.
• Важные языковые функции, такие как функциональная компоновка, прототипное наследование, закмыкание, делегирование событий, область видимости, функции.
• Управление асинхронным программированием, промисы и обратные вызовы.
• Узнайте, как правильно структурировать свой код и разбивать его на модули, что такое webpack, browserify. Инструменты сборки, такие как gulp, определенно будут полезны для понимания.
• Знать, как использовать хотя бы один популярный фреймворк (многие курсы по программированию будут сосредоточены на преподавании библиотеки или фреймфорков, таких как React или AngularJS, но на самом деле гораздо важнее иметь глубокое понимание языка JavaScript и не заострять внимание на функциях фреймворка. После того, как хорошо разобраться в JavaScript, фреймворк, который находится поверх языка программирования, не будет слишком сложной).
• Хотя некоторые и утверждают, что необходимо использовать его меньше или что он медленно умирает, код на jQuery по-прежнему существует в большинстве приложений, и понимание базовых вещей будет полезным.
• Базовые знания в области тестовых фреймворков и почему они важны (некоторые могут даже утверждать, что эта тема должна быть факультативной).
• Новые важные функции ECMAScript 6 (факультативно).

3. Back-end язык программирования

Как только появилась уверенность, что есть хорошее представление о HTML/CSS и JavaScript, нужно переходить на внешний язык, который будет обрабатывать операции с базами данных, проводить аутентификацию пользователей и отвечать за логику приложения. Все онлайн-программы и курсы обычно ориентированы на конкретный внешний язык, и в действительности не имеет значения, какой из них изучать. Можно получить массу различных ответов, если спросить кого-то, какой исходный язык лучше всего учить. Ниже есть перечисление нескольких популярных комбинаций. Важное замечание: в зависимости от того, что изучаете, просто придерживайтесь одного языка программирования и узнайте как можно больше о нем - есть рабочие места для всех языков, перечисленных ниже.

График зависимости языков программирования от предложенных рабочих мест

• Node.js (JavaScript): Это отличный вариант, потому что Node.js - это просто фреймворк JavaScript. Это означает, что нет нужды изучать новый язык. Это веская причина, почему многие онлайн-школы и курсы предпочитают преподавать Node.js. Наиболее популярный фреймворк, с которой будет помогать в разработке веб-приложений, - это Express.
• Ruby: Самые популярные фреймворки для разработки в Ruby - Rails и Sinatra. Множество программ обучают Ruby в качестве первого базового языка.
• Python: Некоторые популярные фреймворки для разработки на Python - Django и Flask.
• Java: Java язык не так популярен в наши дни, когда дело доходит до Full-Stack Web Development, но некоторые компании используют Java в качестве серверного языка программирования, и это по-прежнему очень популярный язык (см. изображение выше).
• PHP: в наши дни PHP редко преподается в программах, но, как и в Java, он по-прежнему очень востребован, и сегодня он является краеугольным камнем Интернета.
• C#: язык поддерживается компанией Microsoft. Популярен из-за технологии ASP.NET MVC(фреймворк). Изучить язык можно тут. 

4. Базы данных

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

• Понимание преимущества реляционных баз данных, например, SQL.
• Знание баз данных NoSQL, например, MongoDB.
• Понимание, что было бы лучше в определенных ситуациях.
• Подключение базы данных с выбранным исходным серверным языком (например, Node.js + MongoDB).
• Преимущества хранилищ данных в памяти, таких как Redis или memcached.
• Веб-хранилище для хранения сеансов, куки-файлов и кэшированных данных в браузере.
• Масштабирование баз данных, ACID и ORM (факультативно).

5. HTTP & REST

Схема работы HTTP соединения

HTTP - это протокол прикладного уровня без учета состояния в Интернете. Да, именно то, что позволяет клиентам связываться с серверами (например, ваш код JavaScript может сделать запрос AJAX к какому-то внутреннему коду, который у вас запущен на сервере, который будет происходить через HTTP). Ниже перечислены некоторые важные темы, которые стоит изучить:

• Что такое REST (и еще тут) и почему это важно в отношении протокола HTTP и веб-приложений.
• Лучшие подходы в разработке RESTful API. POST/GET запросы. 
• Изучение использования Chrome DevTools. 
• Что такое SSL-сертификаты. 
• HTTP/2&SPDY (факультативно). 
• WebSockets, Web Workers и Service Workers (факультативно).

Думаю, для того, чтобы занять позицию Junior Full-Stack Developer приведенных выше знаний будет достаточно. В следующей части будут представлены материалы по архитектуре, алгоритмам и системам контроля версий (это тут).