От автора: чтобы стать фулстек разработчиком, необходимо иметь много навыков. Новичкам зачастую трудно найти подобрать такой способ обучения, чтобы быстро получить результат. Сначала может показаться, что слишком много нужно выучить и понять, как что сочетается. Эта статья – обзор технологий, которые вам, возможно, придется выучить, чтобы ваша full stack разработка могла начаться в 2018 и далее. Начнем с основных вещей и языков программирования и постепенно перейдем к более продвинутым темам типа фреймворков и вспомогательных инструментов.
Этот список поможет вам найти свой путь в джунглях веб-разработки в 2018. Помимо краткого описания тематик, в статье есть ссылки на хорошие обучающие ресурсы, чтобы вы смогли быстро расширить набор своих навыков.
Основное
Начать осваивать веб-разработку лучше всего с HTML и CSS. Это основа для всего остального, это нужно очень хорошо знать.
HTML и CSS
Язык гипертекстовой разметки (HTML) – основа всего на сайте. С помощью HTML определяется и создается структура контента сайта. Каскадные таблицы стилей (CSS) – простой способ применения стилей к сайту (добавление шрифтов, цветов, макета и т.д.).
После того, как разберетесь в HTML, обязательно переходите к CSS. Убедитесь, что понимаете основу. HTML и CSS – две основные технологии, которые должен знать каждый веб-разработчик. Так было в 2017, так будет и в 2018…
Языки программирования
JavaScript
JavaScript – основной строительный блок для создания динамических функций на сайте. Язык JS – реализация базовой спецификации ECMAScript. Изучение JS с нуля – важная веха в становлении карьеры веб-разработчика. Во множестве фреймворков на front end (Angular, React, Vue.js) и back end (Node.js) знание JS обязательно.
Базовый язык JS легко понять. Однако по мере развития спецификации ECMAScript в язык добавляются все новые и новые продвинутые возможности. Например, в 2017 году были добавлены такие функции, как асинхронные функции, общая память и атомные операции.
Если вы начинаете изучение с JS, довольно сложно читать обо всех этих продвинутых JS концепциях. Здесь стоит сначала сосредоточиться на основе, после чего переходить к более продвинутым концепциям.
TypeScript
Благодаря росту популярности Angular, TypeScript также получил распространение. Если планируете изучить Angular, сначала обязательно изучите TypeScript.
TypeScript – дополнение к JS, поэтому всегда используется вместе с JS для активации таких функций, как проверка типа.
TypeScript обладает отличными инструментами, особенно если вы работаете в редакторах кода типа Visual Studio Code. Здесь вы найдете функции автоматического импорта модулей.
Python
Python – один из основных языков программирования, запрашиваемых компаниями в 2017/2018. Если вы еще не добавили Python в свой набор навыков, самое время начать его изучение.
Python предлагает широкий диапазон применения. С его помощью можно писать скрипты командной строки, GUI приложения и веб-приложения. Кроме того, Python участвует в научных вычислениях.
Если вы собираетесь изучать Python для веб-разработки, обязательно взгляните на фреймворки на его основе — Django и Flask.
Front end фреймворки
Фреймворки – front end и back end – упрощают и ускоряют разработку общей функциональности. Однако прежде чем перейти к использованию фреймворка, всегда необходимо попытаться понять базовый технологический стек (например, JS). Это поможет изучить фреймворк и понять концепцию.
Сначала давайте разберем самые важные front end фреймворки в веб-разработке:
Angular
Angular – фреймворк для создания клиентских приложений на HTML и JS/TypeScript. Фреймворк сочетает декларативные шаблоны, вставку зависимостей, инструментарий, а также интегрированные лучшие практики по решению задач в разработке.
В 2017 Angular стал одним из самых популярных фреймворков для создания одностраничных приложений. Этот год для Angular разработчиков будет захватывающим, их ждет 2 главных обновления (версии 4 и 5). Множество новых добавленных функций набирают популярность.
Одна из ключевых возможностей, добавленных в 2017 в Angular – досрочная компиляция. Представления компилируются в момент создания билда, а не в момент рендера. Результат – приложение становится намного быстрее. Более того, функция уменьшает размер пакета приложения в разы.
Если вы ищите новый JS фреймворк для изучения в 2018, получше присмотритесь к Angular. Все больше и больше компаний переходят на Angular. Команда Angular в 2018 придумает еще больше функций.
React
React – JS библиотека для создания UI. React сильно упрощает создание интерактивного UI. Проектируйте простые представления всех состояний в приложении, и React обновит и отрендерит нужные компоненты при изменении данных. Декларативные представления делают код более предсказуемым и упрощают отладку. Фреймворк полностью основан на компонентах. Вы можете создавать инкапсулированные компоненты, управляющие своим состоянием, после чего объединить их для создания сложного UI. Так как логика компонента находится в JS, а не в шаблонах, вы с легкостью можете передавать большие объемы данных через приложение и хранить состояние вне DOM.
React 16 вышел в сентябре 2017. В этом релизе команда решила полностью переписать архитектуру ядра, чтобы добавить поддержку асинхронного рендера в будущем релизе. В 2018 выйдет новая версия, в которой будет доступна эта функция. Это ускорит приложение и уменьшит время загрузки тяжелых приложений, так как основной поток больше не будет блокироваться.
React позволяет создавать по-настоящему мощные одностраничные приложения. Если вы не изучали React, вам обязательно нужно добавить его в свой набор навыков. Если вы рассчитываете разрабатывать на основе React более сложные приложения, то обратите внимание на Redux. В Redux вы сможете использовать центральное управление состоянием в приложении, что сильно облегчает обработку данных между компонентами.
Vue.js
2017 стал для Vue годом взрывного роста. Vue крайне прост в изучении. Это отличный выбор для небольших проектов. Порог понимания очень низкий, за небольшие сроки можно добиться значительного прогресса.
В 2017 Vue поднялся на GitHub с 37к звезд до 78к. Все больше компаний добавляют в свой стек Vue.js и требуют от разработчиков на Vue.js постоянного роста.
Back end фреймворки
Выбор среди back end фреймворков огромен. Ниже я остановил свой выбор на двух: один для JS (Node.js) и один для Python (Django).
Как можно понять из названия, back end фреймворки запускаются на back end (сервере) и динамически генерируют HTML, JSON (и т.д.) для сайта в зависимости от открытого URL.
Если вы разрабатываете только front end сторону проекта, то вам не нужно изучать back end фреймворки. Однако для глубокого понимания необходимо хотя бы разобраться в основах back end фреймворков.
Node.js
Node.js позволяет запускать JS код на back end. Это очень мощный инструмент, особенно если используется с промежуточным слоем Express.
Чтобы перейти к изучению Node.js, необходимо хорошо изучить JS. Так вы сможете быстро понять концепции ядра.
Django
Django полностью написан на Python. Если вы оценили элегантность Python, вам понравится Django. Django – мощный фреймворк, у которого множество способов применения. Если вы хорошо знаете Python, вы быстро освоите Django и найдете прагматичный подход.
Если на back end проекта будет Python, обязательно изучите Django.
Инструменты
Git
На данный момент Git самая популярная система контроля версий кода любого рода.
Если вы разработчик, то рано или поздно вы столкнетесь с Git и GitHub. Git использует множество компаний, а многие представленные в статье фреймворки и расширения хранятся на GitHub.
Чтобы завершить изучение веб-разработки, вам необходимо изучить хотя бы основы Git.
Webpack
Webpack – упаковщик модулей для современных JS приложений. Во время обработки приложения он рекурсивно строит граф зависимостей, который включает все необходимые модули, затем запаковывает все эти модули в несколько пакетов – зачастую один – которые потом загружаются в браузере.
В 2017 вышли Webpack 2 и Webpack 3. Инструмент стал стандартом в создании пакетов в JS.
Заключение
Навыки веб-разработки сейчас высоко востребованы, и если вы еще не начали, сейчас самое время начать изучать веб-разработку. Даже если вы уже опытный разработчик, вам все равно нужно уделить какое-то время на изучение новых технологий и фреймворков.
Источник: //codingthesmartway.com/
Редакция: Команда webformyself.
