Многие думают, что Angular слишком сложен, а другие фреймворки, такие как React или Vue.js, проще. Подумайте еще раз.

Французская версия этой статьи доступна здесь.

Angular сегодня: прогрессивное веб-приложение за 2 минуты

npm install @angular/cli -g
ng new myapp --routing
cd myapp
ng add @angular/pwa
ng build --prod

Вот и все. У вас есть настоящее веб-приложение, работающее в автономном режиме.

У вас также есть из коробки (неполный список):

  • полная среда разработки, без необходимости настройки
  • сверхоптимизированный производственный пакет, без необходимости настройки
  • среда e2e и модульного тестирования, без необходимости настройки
  • все, что вам нужно для создания приложения: компоненты, внедрение зависимостей, маршрутизация, AJAX, управление состоянием и т. д., все в официальном и однородном API.

Просто добавь:

ng add @angular/material

и теперь у вас есть официальные и готовые к использованию UI-компоненты.

Все еще думаете, что Angular слишком сложен?

Прошлые выпуски

Скажем откровенно: этой идее способствовали некоторые проблемы.

Угловое управление версиями

Поскольку Google решил сохранить то же имя из версии 1, нам сначала нужно было поговорить об Angular 2, чтобы различать версии. Итак, сейчас многие люди не понимают, почему Angular 6 уже выпущен.

Но подождите: какая версия React? 16. Кого-нибудь это беспокоит? Нет. Именно так работает семантическое управление версиями.

Итак, теперь это просто Angular, а обновления с Angular 2 до 4 и с Angular 4 до 5 проходят очень плавно и обычно занимают всего несколько минут, как и в любом другом фреймворке. . И начиная с Angular 6, миграции полностью автоматизированы.

Документация

Отсутствие документации не помогает понять инструмент. Документация по Angular сейчас в хорошей форме, а официальная команда больше общается с новым блогом по Angular.

Другие фреймворки вам лгут

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

Angular честен: он включает в себя все, что вам нужно для приложения. И ничего лишнего.

Vue.js

Vue.js - лучший тому пример. Это очень просто:

Большой. Является ли приложение одним или даже несколькими компонентами? Нет.

Вам понадобится маршрутизация, внедрение зависимостей, AJAX и так далее. Поскольку приложение не может допускать ошибок (или выйдет из строя), вам также понадобится инструмент, чтобы избежать ошибок (например, TypeScript). У вас также будут сотни компонентов, так что вам придется организовывать их с помощью ориентированного объектного программирования.

Итак, давайте посмотрим на реальный пример Vue.js.

Выглядит знакомо? Да, это точно так же, как Angular. На самом деле синтаксис Angular немного проще.

Реагировать

То же самое и с React:

Это приложение? Нет. Как вы думаете, Facebook построен только на React? Нет.

Вам понадобится маршрутизация, внедрение зависимостей, AJAX и так далее. И в отличие от Vue.js и Angular, они не включены. Вам придется самостоятельно искать другие библиотеки.

Вам также понадобится государственное управление. А вот и Redux. На этом этапе React уже не прост. На самом деле решить эту проблему в React гораздо сложнее, чем в Angular.

Как вы думаете, разработчики Facebook пишут код на простом JavaScript? Нет. Они используют Flow, инструмент статической печати, эквивалентный TypeScript.

И вам придется собрать и настроить все это самостоятельно.

Итак, окончательно: нет, React не проще, чем Angular.

Современные и эффективные инструменты в Angular

С этой точки зрения реального мира я даже говорю, что Angular проще других фреймворков.

Почему? Angular выбрал современные инструменты: ES6 +, TypeScript и RxJS. Все эти инструменты есть здесь по уважительной причине.

Например, TypeScript не общепринятый выбор: поскольку веб-приложение полагается на JavaScript, мы больше не можем писать код без какого-либо управления ошибками, как когда мы делали анимацию с помощью jQuery. Всего одна ошибка может привести к сбою вашего приложения, поэтому инструмент управления ошибками необходим, это не просто фантазия Google. . Опять же, Facebook использует аналогичный инструмент. Все разработчики, которых я встречал, влюбились в TypeScript, когда открыли для себя его.

То же самое и с RxJS: да, это непростая библиотека, потому что она касается самого сложного аспекта JavaScript: асинхронности . Но он здесь, чтобы упростить его. Для малых и средних приложений вы можете легко управлять состоянием с помощью только RxJS, в то время как в React вы бы напрямую переходили к Redux, по сравнению с тем, что вам в конце концов покажется простым RxJS.

Итак, нравится вам это или нет, легкость эпохи jQuery закончилась. Для обновления приложений до уровня инфраструктуры требуется JavaScript. Да, это сложнее, но это необходимо.

Добро пожаловать в разработчики PHP, Java и C #

Наконец, самый важный момент: благодаря этим инструментам Angular очень похож на Java, C # или OOP PHP:

Я считаю, что это важно, но элита JavaScript не замечает этого. Большинство разработчиков не JavaScript-экспертов: они либо внутренние веб-разработчики, пишущие на PHP, либо программисты, пишущие на Java, C # или аналогичные.

Разработчикам PHP / Java / C # действительно проще перейти на Angular, чем на React.

Дело идет еще дальше: Angular заставляет их переключиться на JavaScript. Я встречал много Java-разработчиков, которые долгое время избегали JavaScript, а теперь они говорят:

«Хорошо, с такими инструментами, как Angular, JavaScript достаточно развит, и к нему можно отнестись серьезно».

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

Угловые элементы

Одним из преимуществ других фреймворков, таких как React или Vue.js, является то, что вам не нужно создавать полное приложение, а создавать только некоторые компоненты.

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

Предупреждение и заключение

Как и любой пост, похожий на «Framework A vs. framework B», я полагаю, что он вызовет бурные дебаты и резкую реакцию людей, которые предпочитают другой фреймворк, но я не отвечу на такие комментарии. Этот пост не для того, чтобы сказать: «X лучше, чем Y». У каждого инструмента свой подход, есть свои преимущества и недостатки. Каждый человек, участвующий в каком-либо проекте, делает огромную работу. Не в этом дело.

Этот пост просто о том, чтобы добавить другую перспективу в мир JavaScript, что, на мой взгляд, важно, но отсутствует во многих вещах, которые я читал. Это не идеологическое мнение (я поддерживаю Firefox;), это основано на моем собственном опыте и на всех отзывах, полученных от моей работы тренера JS и сотен разработчиков, с которыми я встречался. У вас может быть другое мнение, и это нормально, не нужно бороться.

Демонстрация

Для практической демонстрации я написал второй пост Angular - это просто - Часть 2: демонстрация », где я показываю как создать прогрессивное веб-приложение с Angular всего за 5 минут и 10 шагов.

Того же автора

Примечание для троллей: я не продвигаю Angular, потому что это моя работа, я тоже могу пройти курсы React, но я предпочитаю не делать этого после тестирования обоих. ;)