Веб-разработка сегодня является одним из самых востребованных отраслевых навыков. Если мы посмотрим на загрузки популярных пакетов, таких как express, react или jquery, то вы увидите, что за последние 5 лет общее между ними состоит в том, что их использование быстро растет с каждым годом.
Фактически, опрос stackoverflow за 2020 год включает «полный стек» и «интерфейс» как две из трех ведущих профессий разработчиков в мире на данный момент.
Таким образом, очевидно, что сегодня веб-разработка – это отличный навык. В этой статье посмотрим, что именно вам нужно сделать, чтобы стать веб-разработчиком в 2021 году и далее на перспективу.
Эта проблема
Проблема с сетью сейчас – это информационная перегрузка и шум. jQuery, Angular, Ember, Vue, React, Next.js, Nuxt.js, TypeScript, Sass, Webpack, NPM, Yarn, ESbuild, snowpack, …! Есть так много вещей, так много инструментов, так многому вы можете научиться – что часто становится обескураживающим даже начинать.
Тогда есть смысл того, что актуально сегодня, что будет актуально через 3 года и т. д. Давайте проясним несколько вещей в этом блоге:
Вам не нужно все учить
Распространенное заблуждение состоит в том, что вам нужно научиться всему, чтобы стать отличным разработчиком. Это совершенно неверно.
- У вас должен быть «полный» технический стек. Полный технический стек – это стек, с помощью которого вы можете создать практически любой проект, который захотите.
- Вам нужно знать большинство, если не все популярные инструменты в экосистеме. Обратите внимание, это не означает, что вам нужно знать, как с ними работать. Но вы должны знать, что они существуют.
Вам нужно сделать ставку на стек
Angular vs React vs Vue vs Svelte vs xyz. Это обсуждение никогда не закончится. По правде говоря, все популярные фреймворки/библиотеки популярны, потому что люди их используют и хорошо умеют делать то, что делают.
Если хотите, можете попробовать провести время с разными технологиями. Но моя личная рекомендация – не менять основные библиотеки/фреймворки каждые месяц или два.
Конечно, вы можете переключиться с React на Angular, просмотрев Х-часовой курс. Однако помните, что при работе с технологией вам необходимо разработать определенную ментальную модель, и на то, чтобы освоиться с ней, могут потребоваться недели, если не месяцы.
Не переключайтесь на самые передовые технологии на рынке, придерживайтесь технологического стека, с которым вы работаете.
Фреймворк для изучения веб-разработки в 2021 году
Хорошо. Теперь большой вопрос. Чему вы на самом деле научились из всего шума в мире? Давайте разделим вопрос на две части – (Что и как), чтобы изучить интерфейс веб-разработки. Оба вопроса одинаково важны, так как в зависимости от принятого решения вы можете сэкономить или потратить впустую много времени. Давайте начнем.
Что нужно узнать о веб-разработке?
Это полный список вещей, которые вам следует изучить для веб-разработки. Обратите внимание, что это было бы самоуверенным, потому что у меня большой опыт работы с этими технологиями (платформа, на которой вы это читаете, codedamn, была построена со всеми этими технологиями).
Основы Интернета
Для многих это может стать неожиданностью. Большинство сайтов рекомендуют начинать с HTML/CSS, но я чувствую, что даже раньше вы должны понимать, как Интернет и сеть работают на высоком уровне. Что такое HTML-документы, как они отправляются с внутреннего сервера, что такое DNS, что именно происходит, когда вы вводите google.com в браузере и т. д.
Конечно, вам не нужно углубляться в какую-либо из тем, но он дает очень четкое понимание вещей, когда вы внезапно используете dev-серверы для разработки, слегка начинаете переходить на бэкэнд или пытаетесь отлаживать сетевые запросы. позже в вашем путешествии.
HTML5/CSS3
HTML и CSS – фундаментальные строительные блоки Интернета. Несомненно, это должно быть первое, чему вы должны научиться что бы быть специалистом во фронтенд-разработке.
Некоторые очень важные моменты:
- Обязательно изучите современный синтаксис HTML5.
- Попробуйте узнать о семантических тегах в HTML5 вместо того, чтобы вставлять все в div.
- Узнайте о современных методах макета в CSS (flexbox, grid)
- Узнайте о современном синтаксисе CSS и получите ясное представление о селекторах, медиа-запросах, свойствах, значениях и т. д. – основах.
- Не придерживайтесь старого и устаревшего синтаксиса ( centerтег marqueeи т. д.)
- Не тратьте много времени на изучение старых методов компоновки в CSS с плавающей точкой и т. д.
- Не пробуйте каждую передовую функцию CSS3/4. Многие из них могут еще не поддерживаться в браузерах. По большей части придерживайтесь широко поддерживаемых функций CSS3.
JavaScript
JavaScript очень важен для интерактивности и всего, что вы делаете, кроме простой статической целевой страницы HTML/CSS. Его можно широко использовать и за пределами внешнего интерфейса (в Node.js/Deno/TypeScript), поэтому важно, чтобы вы правильно понимали свои основы с помощью JavaScript.
Некоторые очень важные моменты:
- Обязательно изучите синтаксис ES6 +. Не используйте их varи даже не следуйте инструкциям. В большинстве случаев они не нужны. Один из способов проверить это – попробовать следовать руководствам, созданным после 2017 года.
- У JavaScript есть некоторые особенности поведения, которые могут застать вас врасплох. Например, почему 0,1 + 0,2 не равно 0,3 или почему null == undefined верно в JS. Помните, что у такого поведения всегда есть причины. Чтобы понять такие вещи, нужно выполнить поиск в Google.
- JavaScript – это, по сути, язык асинхронного и неблокирующего ввода-вывода. Это означает, что вы должны понимать, как некоторые основные части асинхронных вещей, такие как промисы, работают в JavaScript.
- Узнайте о DOM API и поймите, что это API, предоставляемый вашим браузером вашему JS-коду для взаимодействия с вашим HTML/CSS.
Продолжение: