От автора: вы помните старые добрые времена, когда все, что вам нужно было сделать, это написать хорошие CSS и HTML? Может быть, немного PHP, JSP или (если вы были опытным front-end разработчиком) некоторые переменные Jade / Pug, импорт и некоторый код jQuery… ну, это все мертво. И это величайшая вещь, которая когда-либо могла случиться с front-end.
Отставание — проблема разработчика
Быть разработчиком означает «никогда не прекращать учиться». С другой стороны, некоторые технологии будут работать десятилетиями. Просто подумайте о Java, PHP, Ruby (и т.д.); как только вы настроите сервер, он будет обслуживать приложение вечно.
Во front-end все совершенно по-другому: некоторые API устаревают через несколько лет, некоторые браузеры будут развивать его поддержку, а некоторые наоборот отбросят. Некоторые новые интерфейсы заменят некоторые старые / уродливые / устаревшие библиотеки и помогут вам повысить производительность. Вы не можете игнорировать это.
Прыгать на волне инноваций — ответственность разработчика. Хотя в 2010 году jQuery была потрясающей библиотекой, сегодня она довольно бесполезна, безобразна и устарела.
Некоторые разработчики веб-интерфейса столкнутся с трудностями при попытке загрузить современный пользовательский интерфейс с помощью React, Vue или Angular, и это совершенно нормально. Им просто нужно узнать что-то новое, потому что это то, что делают разработчики.
Боязнь JavaScript
В последние годы JavaScript стал одним из самых популярных языков программирования. Некоторые разработчики веб-интерфейса все еще отказываются принимать его как основной язык для веб-интерфейса, и это крайне неправильно.
Дни, когда вы могли кодировать весь пользовательский интерфейс только с помощью HTML (или Jade / Pug) и CSS (SASS / Less), уже прошли. Примите это.
Как разработчику, иногда вам нужно забыть все, что вы узнали в прошлом. Умение хорошо программировать с помощью jQuery / Zepto / MooTools не означает, что вы будете хорошим разработчиком React / Vue / Angular. После нескольких лет написания этого:
<div id="content"> hi! </div> <script type="text/javascript"> var content = $("#content"); content.addClass("foo");
</script>будет довольно сложно понять это:
<template> <div :class="contentClass"> Hi! </div>
</template> <script> export default { name: "someComponent", data() { return { contentClass: "foo" } } }
</script>Но это нормально, вам просто нужно научиться чему-то новому. Преимущества написания компонентов Vue / React / Angular вместо какого-то грязного кода jQuery станут понятны очень скоро, когда вы перейдете к изучению реактивного программирования, разработке на основе компонентов и другим новым технологиям / идеологии.
Будучи специалистом в JavaScript-кодировании, сегодня это важный навык для каждого фронтенд-разработчика. Я скажу это снова: SASS, Pug и jQuery больше не достаточно.
Front-end инжиниринг
С приходом Backbone и Angular мы определенно попрощались с Front-end разработкой. Эти две библиотеки начали революцию, которая привела к Front-end инжинирингу, где знания Веб важны, но не достаточны.
Сегодня вам нужно знать, как настроить WebPack или Rollup для того, чтобы связать приложение. Возможно, вам нужно знать, как использовать Lerna для управления несколькими пакетами. А как насчет ESLint? Prettier? TypeScript или Flow? Yarn или NPM? Babel?
JavaScript — это не просто «чертов язык интерфейса», как говорят многие разработчики. Это сложный, быстро развивающийся язык программирования, который поможет вам больше, чем вы думаете. В его сообществе много умных инженеров, которые имеют различный опыт, они помогут вам разобраться с языком.
Цель Front-end инжиниринга проста. Пользовательские интерфейсы становятся сложными, и Front-end не будет завершенным, пока вы не найдете способ оптимизировать код. Подумайте о том, как вы писали код в 2005 году: действительно ли вы заботились о масштабируемости? Представлении? Чистоте кода? Тестах?
Сегодня мы часто работаем над написанием сложных алгоритмов для фронт-енд, модульных тестов и заботимся о производительности и размере страницы / пакета.
В 2005 году написание хорошего кода веб-интерфейса было проще, но даже ужасный код принимался (в большинстве случаев).
В 2019 году написание хорошего кода веб-интерфейса стало чрезвычайно сложным, и ужасный код больше не может быть принят. Почему? Потому что сегодня у пользователей высокие стандарты производительности, масштабируемости, плавности анимации, скорости выполнения… все имеет значение.
Просто будьте честны с собой и скажите: сколько раз вы заботились о размере библиотеки, прежде чем импортировать ее в свой проект?
Сколько раз вы производили рефакторинг всего скрипта, чтобы улучшить его поддержку? Сколько раз вы заботились о модульных тестах? А как насчет производительности?
Я буду честен: я часто записывал быстрое и грязное решение, потому что каждый разработчик, которого я когда-либо встречал, делал то же самое. За последние 5 лет я понял, что не могу так продолжать, поэтому я оставил jQuery, Zepto и принял React и Vue. Я узнал о ESLint, модульных тестах, чистом коде и изучил алгоритмы и структуры данных.
Это изменило мою жизнь и мой энтузиазм по поводу программирования.
Мантра Front-end инженера в 2020 году
Старые технологии несут экспоненциальные проблемы. Как только вы оставите их, вы оставите позади проблемы.
SEO важно, но это не повод избегать React / Vue / Angular. У нас есть SSR, и это решает проблему.
JSP, ERB, PHP недостаточно. Мы живем в 2019 году, у нас есть Nuxt, Next и другие замечательные технологии на стороне сервера. Примите их.
Чистый код является обязательным.
Алгоритмы и структуры данных могут сэкономить вам время. Изучите их!
Тесты необходимы.
JavaScript — ваш друг.
Автор: Michele Riva
Источник: https://www.jsmonday.dev
Редакция: Команда webformyself.