Что такое angular и зачем он нужен
AngularJS — фреймворк для динамических веб-приложений от Google
AngularJS создан для тех разработчиков, которые считают, что декларативный стиль лучше подходит для создания UI, а императивный — для написания бизнес-логики.
Дзен Angular
AngularJS разрабатывается сотрудниками Google и используется, как минимум, в одном сервисе Google — DoubleClick.
Примеры
Основные понятия AngularJS
Директивы
На директивах держится практически вся декларативная часть AngularJS. Именно они используются для обогащения синтаксиса HTML. В процессе компиляции DOM директивы берутся из HTML и исполняются. Директивы могут добавить какое-то новое поведение и/или модифицировать DOM. В стандартную поставку входит достаточно большое количество директив для построения веб приложений. Но ключевой особенностью является возможность разработки своих директив, за счет чего HTML может быть превращен в DSL.
Директивы могут использоваться как элемент ( ), атрибут (), в классе () или в комментарии (). Это зависит от того, как конкретная директива была разработана.
Scope-ы
Scope — это объект, имеющий отношение к модели в приложении. Он является контекстом выполнения для выражений. Scope-ы выстраиваются в иерархическую структуру, похожую на DOM. При этом они наследуют свойства от своих родительских scope-ов.
Сервисы
Для использования сервиса необходимо указать его как зависимость для контроллера, другого сервиса, директивы и т.п. AngularJS позаботится обо всем остальном — создании, разрешении зависимостей и т.п.
Фильтры
Фильтры предназначены для форматирования данных перед отображением их пользователю, а также фильтрации элементов в коллекциях. Примеры фильтров (полный список можно посмотреть в документации): currency, date, orderBy, uppercase. Использование фильтров достаточно традиционно: << expression | filter1 | filter2 >>
Модули
Приложения в AngularJS не имеют основного исполняемого метода. Вместо этого модуль выполняет роль декларативного описания того, как приложение должно быть загружено. Благодаря этому, например, при написании сценариев тестирования можно подгрузить дополнительные модули, которые переопределят какие-то настройки, облегчая тем самым комплексное (end-to-end) тестирование.
Тестирование
Как пишут разработчики, для тестирования они сделали очень много в AngularJS, поэтому уже ничего не может извинить вас, если вы не будете тестировать свое приложение 🙂
Пример тестового e2e сценария:
Подробнее о модульном тестировании и e2e тестировании в руководстве разработчика.
AngularJS Batarang
Это расширение для Chrome, которое облегчает отладку AngularJS приложений. Позволяет работать с иерархией scope-ов, дает возможность профилирования приложения, визуализирует зависимости между сервисами, отображает содержимое scope-ов на странице элементов, позволяет выводить и менять значения в scope из консоли. Хорошее текстовое описание на странице в github. Хорошее видео на youtube.
Что такое Angular?
Иногда стоит обернуться назад и посмотреть на мир разработки глазами новичка. В компании Progress мы часто используем Angular. Angular — это основная составляющая нашего веб-фреймворка Kendo UI, так же, как и фреймворка для мобильных приложений NativeScript. Поэтому у нас часто спрашивают, что такое Angular и как его использовать. Когда появился Angular? Кем он поддерживается? Почему мы используем Angular? Когда его лучше не использовать?
В этой статье мы ответим на эти и некоторые другие вопросы. Мы рассмотрим, что являет собой Angular, как он появился и в каких случаях его лучше всего применять. После этого кратко рассмотрим несколько примеров того, как работают Angular-приложения. Но давайте все по порядку.
Как же появился Angular?
Miško рассказал о том, как возникла идея создать фреймворк в интервью 2013 года:
“Мы хотели понять, можно ли упростить работу веб-дизайнеров, а не только разработчиков. Смогут ли они добавить еще больше HTML в свой код, чтобы превратить обычную статическую форму во что-то более стоящее, что можно отправить по емейлу. Идея заключалась в следующем: будь у вас небольшой бизнес, продающий пиццу или что-либо другое, то вы могли бы добавить простую систему заказа, используя необходимые теги, и они действительно отправляли бы письмо на сервер.»
Поскольку домен angular.com был занят – собственно, как и сейчас – создатели фреймворка переименовали Angular в GetAngular и выпустили небольшой сайт, на котором можно было узнать о всех фичах фреймворка.
Домашняя страница Angular по состоянию на декабрь 2009 года (из Internet Archive).
Скоро Miško начал работать в Google, а в 2010 году занялся проектом Google Feedback. Miško убедил своего менеджера, Brad Green, переписать проект, используя его Angular. Оптимизация сроков и кода, которые показала команда в работе, помогли убедить Google в силе Angular.
Brad Green и Miško Hevery показывают, как много времени и сил удалось сэкономить на проекте, используя Angular. Это скриншот презентации на конференции ng-conf 2014 keynote, которую стоит посмотреть, если вы хотите знать всё о происхождении Angular.
Вскоре после успеха Google Feedback та же команда переписала open-source библиотеку и в мае 2011 года была выпущена версия Angular 1.0. В течение нескольких лет Angular стремительно набирал популярность, и сегодня Google заявляет, что более 1,5 миллиона разработчиков используют Angular.
Что делает Angular?
Angular — фреймворк JavaScript, который помогает разработчикам создавать приложения. Библиотека предоставляет множество фич, которые делают простые реализации сложных задач современных приложений, таких как привязка данных, маршрутизация и анимация.
Когда использовать Angular?
Технически вы можете использовать Angular где угодно, но лучше всего он работает в нестандартных приложениях с данными. Если вы ознакомитесь с различными приложениями Angular, собранными на madewithangular.com, вы увидите реальные приложения, которые собирают данные из форм и работают с ними.
Angular работает не только с формами. Разработчики создали множество игр при помощи Angular и такие сумасшедшие вещи, как приложения с дополненной реальностью. Однако, большинство туториалов и документации по Angular все равно содержат информацию о создании некоторых form-based приложений. Например, вы встраиваете документацию Angular в приложение, где вы создали героев и их список через форму.
Окончательный результат демо-приложения Tour of Heroes из Angular документации.
Angular также хорошо подходит для приложений, которые должны работать в нескольких средах разработки. Если приложение должно работать на веб, а также на Windows или Maс, вы можете придерживаться одного из многочисленных туториалов для запуска Angular-приложений с популярным Electron project.
Если же у вас приложение, которое нужно запустить на веб, iOS или Android, можете использовать NativeScript для рендеринга вашего приложения в мобильной среде. В некоторых случаях вы даже можете распространять код через эти платформы, экономя ценное время разработки.
Кто поддерживает Angular?
Angular Core Team состоит из большого количества людей во всем мире и из сообщества Angular. При этом большая часть разработок Angular изо дня в день осуществляется сотрудниками Google. Примерно 20 сотрудников Google входят в Angular Core Team и все ТОП-разработчики проекта Angular являются сотрудниками Google.
Следует отметить, что, несмотря на контроль Google над Angular, сам фреймворк по-прежнему много в чём зависит от усилий сообщества. Более двух тысяч человек внесли свой вклад в open-source репозиторий Angular, в общем доступе есть бесчисленные туториалы и guides, многочисленные компании предлагают обучение и набор инструментов для разработчиков.
Если контроль над проектом принадлежит одной компании, это неплохо, так как снижает конфликтные вопросы при принятия нестандартных решений.
Какую версию Angular мне лучше использовать?
На данный момент существует две популярные версии Angular. Версия 1 доступна на https://angularjs.org/ и является обновлённой версией того Angular, что был представлен Miško и его командой в 2011 году. Другая популярная версия теперь называется просто Angular и доступна на https://angular.io/. Современный Angular – это полностью переделанная версия для новых браузеров, рабочих процессов и платформ разработки.
Почти во всех случаях вам следует придерживаться последней версии Angular. В ближайшем будущем команда Angular будет стремиться поддерживать Angular 1, но нет никаких оснований полагать, что они будут поддерживать и более старые версии. Более того, Angular 1 не допускает использования библиотеки вне браузера, поэтому вы не можете воспользоваться такими библиотеками, как NativeScript для создания мобильных приложений.
Как выглядит Angular-приложение?
Теперь, когда вы имеете некоторое представление об Angular, давайте углубимся в код. Начнём с небольшого приложения “hello world”. Все приложения Angular начинаются с НТМL-страницы, которая выглядит следующим образом.
В реальном приложении тег внутри тега может быть немного сложным, но в высокоуровневых приложениях он такой же, как и другие веб-приложениях – вы загружаете кусок JavaScript-кода в HTML-документ, и приложение работает.
Такие пользовательские теги называют компонентами, и вы можете определять их поведение в коде. Вот простейшая реализация элемента :
Есть несколько моментов, которые вам нужно знать, чтобы понять, что происходит в данном фрагменте кода. Первое – это код на TypeScript, а не на JavaScript. TypeScript может показаться вам пугающим, если вы не встречались с ним раньше, но его основы понять нетрудно.
TypeScript – надстройка над JavaScript, то есть весь синтаксис JavaScript доступен на TypeScript. Кстати, весь приведённый выше синтаксис – import, export, @Component и остальные – это или нынешние фичи JavaScript, или те, что появятся в ближайшем будущем. Так что, когда вы учите TypeScript, вы изучаете будущее JavaScript. TypeScript, к тому же, отличается превосходной документацией, к которой вы можете обратиться в любое время.
TypeScript был создан и поддерживается Microsoft. Он стал очень популярным за последние несколько лет, поэтому можете смело использовать его в разработке своих приложений. Он никуда не денется.
Давайте еще раз посмотрим на TypeScript-код, определяющий компонент :
Отображение базового примера “Hello World” в браузере.
Зачем мне использовать Angular?
Angular- не самый простой в мире фреймворк, и понадобится время, чтобы понять те концепции, на которых он построен. Но когда вы возьметесь за Angular, то сможете делать действительно крутые приложения, обходясь небольшим количеством кода. Например, вы хотите добавить привязку данных к предыдущему примеру. Для этого используется очень простой синтаксис.
Хотите построить форму для запуска приложения? Хотите, чтобы эта форма имела валидацию данных и двустороннюю привязку? Для этого есть простой гайд. Ваше приложение слишком большое и вы хотите структурировать его? И для этого тоже создан гайд. Попали в модульное тестирование и хотите знать, как проверить код?
Такая возможность тоже есть. Хотите добавить такие профессиональные виджеты, как диаграммы и графики? Kendo UI и похожие фреймворки упрощают добавление этих высококачественных компонентов пользовательского интерфейса.
Пользуясь Angular, не рассчитывайте на простоту фреймворка, но будьте уверены в его невероятной надёжности и хорошей документации. Этот фреймворк прошёл не одно боевое испытание и заслужено используется миллионами разработчиков для написания крутых приложений. Сообщество Angular – огромное, и все хелпы легко найти в Google, Stack Overflow и по всему интернету. Ищите разработчика? Тысячи Angular девелоперов откликнутся на ваш запрос. Есть даже специальные рекрутинговые сайты.
А вот как этот код работает в нативных iOS и Android приложениях.
Angular делает это и многое другое возможным. От создания потрясающих приложений до расширения мультиплатформенной разработки, Angular может стать отличным решением для вашего следующего проекта.
Если вы ищите больше информации о том, что может предложить Angular, начинайте изучать туториалы по быстрому старту работы с Angular и начинайте кодить. Если вы хотите использовать Angular для разработки мобильных приложений, посмотрите, как использовать его с NativeScript. Вы изучите один из самых популярных фреймворков JavaScript, когда будете знакомиться со столь популярным миром мобильной разработки.
Введение в Angular: что это за фреймворк и зачем его использовать
Дата публикации: 2018-03-30
От автора: в этой статье я общими словами расскажу вам про крайне популярный и широко используемый клиентский фреймворк Angular. Это введение в основном предназначено для новичков в разработке, у кого мало опыта работы с JS фреймворками, но кто хочет изучить основные идеи Angular, а также понять разницу с AngularJS. JS фреймворк – умное словечко сегодня: все обсуждают эти фреймворки, множество разработчиков спорят о лучшем решении. Начнем же знакомство с Angular.
Зачем нужен фреймворк?
Если вы не знаете, то JS (или клиентский) фреймворк – это технология, обеспечивающая нам инструментами для создания веб-приложения, но также задающая дизайн приложения и организацию кода.
Большинство фреймворков сейчас слишком самоуверенны. У них есть своя философия того, как должно строиться веб-приложение. Вам придется потратить время, чтобы изучить базовые концепции. Другие решения типа Backbone не указывают разработчикам, как строить проект. Поэтому некоторые даже называют такие технологии просто библиотеками, а не фреймворками.
На самом деле, JS фреймворки появились не так давно. Я помню, когда сайты писали с плохо структурированным JS кодом (в большинстве случаев под управлением jQuery). Однако клиентские UI становились все сложнее, и JS потерял репутацию «игрушечного» языка. Современные сайты сильно полагаются на JS, поэтому необходимость правильной организации (и тестирования!) кода возросла. Поэтому клиентские фреймворки стали популярны, и на данный момент их, как минимум, десяток.
Введение в Angular: что такое Angular
Раньше среди JS фреймворков AngularJS был любимчиком, так как был представлен корпорацией google в 2012. Он был построен по концепции Model-View-Controller. Авторы же фреймворка называли концепцию “Model-View-*” или даже “Model-View-Whatever”.
Бесплатный курс «Laravel + Angular. Быстрый старт»
Изучите курс и узнайте, как создать веб-приложение с нуля на Angular и Laravel
Фреймворк на чистом JS должен был разъединить логику приложения и манипуляции с DOM. Его целью были обновления динамических страниц. Но это было не так навязчиво: под контролем AngularJS могла быть только часть страницы. Этот фреймворк представил много мощных функций, позволяющих разработчикам легко создавать богатые, одностраничные приложения.
В частности, была представлена интересная концепция привязки данных, по которой представление автоматически обновляется при любом изменении модели и наоборот. Поверх этого представили идею директив, которые позволяют создавать собственные HTML теги и оживлять их через JS. Например, можно написать:
AngularJS обработает этот пользовательский тег и превратит в полноценный календарь, как сказано в исходном коде. (конечно, ваша задача будет заключаться в программировании подходящей директивы)
Также была представлена важная концепция инъекции зависимостей, которая позволяет связывать компоненты приложения, облегчая повторно использование и тестирование кода. Мы не будем в этой статье подробно углубляться, но в AngularJS еще много всего.
AngularJS стал популярен очень быстро и получил большую поддержку. Тем не менее, разработчики решили пойти еще дальше и перешли к созданию новой версии Angular 2 (позже просто Angular без части JS). Фреймворк получил новое имя не просто так: он был полностью переписан и перепроектирован, а многие концепции были пересмотрены.
Первый стабильный релиз Angular 2 опубликован в 2016, после чего AngularJS стал терять популярность в угоду новой версии. Одна из главных функций Angular 2 – возможность разрабатывать под несколько платформ: веб, мобильные устройства и нативный десктоп (AngularJS по умолчанию не имел мобильной поддержки).
Чтобы еще сильнее все усложнить в конце 2016 вышел Angular 4. «А где же версия 3?», спросите вы. У меня был тот же вопрос. Как оказалось, версии 3 вообще не было опубликовано! Но как так? В официальном блоге разработчики объяснили, что с Angular 2 перешли на семантическое управление версиями.
Следуя этому принципу, изменение основной версии (например, 2.х.х становится 3.х.х) означает переломные изменения. Проблема в том, что компонент Angular Router уже был в версии 3. Чтобы исправить это несоответствие, было принято решение пропустить Angular 3. К счастью, переход с Angular 2 на 4 прошел легче, чем с AngularJS на Angular 2, но разработчиков все же смутила вся эта путаница.
В ноябре 2017 вышел Angular 5. Он совместим с предыдущими версиями Angular. Скоро должен выйти Angular 6 и должен привнести еще больше крутых функций и улучшений.
Введение в Angular: преимущества Angular
Так почему же Angular? Потому что он поддерживается на разных платформах (веб, мобильные устройства, нативный десктоп), он мощный, современный, у него отличная экосистема, и он просто крутой. Не убеждены? Позвольте немного углубиться в подробности:
Angular представляет не только инструменты, но и шаблоны дизайна для создания обслуживаемого проекта. При правильном создании Angular приложения у вас не будет путаницы классов и методов, которые сложно править и еще сложнее тестировать. Код удобно структурирован, можно быстро понять, что к чему.
Это JS, но лучше. Angular построен на TypeScript, который, в свою очередь, полагается на ES6. Вам не нужно учить полностью новый язык, и вы получаете функции типа статической типизации, интерфейсов, классов, пространства имен, декораторы и т.д.
Не нужно изобретать велосипед. В Angular уже есть много инструментов для создания приложения. Благодаря директивам, HTML элементы могут вести себя динамически. Вы можете усилить формы с помощью FormControl и представить различные правила валидации. Можно легко посылать асинхронные HTTP запросы различных типов. Можно без труда настроить маршрутизацию. В Angular есть еще много функций!
Компоненты разъединены. Angular старался убрать жесткую связь между различными компонентами приложения. Инъекция проходит подобно NodeJS, что позволяет легко заменять компоненты.
Бесплатный курс «Laravel + Angular. Быстрый старт»
Изучите курс и узнайте, как создать веб-приложение с нуля на Angular и Laravel
Все манипуляции с DOM проходят там, где должны. В Angular представление и логика приложения не связаны, что сильно очищает и упрощает разметку.
Тестирование в центре внимания. Angular тщательно протестирован и поддерживает юнит тесты и сквозное тестирование с помощью инструментов типа Jasmine и Protractor.
Angular подготовлен к мобильным устройствам и десктопу – один фреймворк под множество платформ.
Angular активно обслуживается и имеет большое сообщество и экосистему. По фреймворку можно найти много материалом и полезных сторонних инструментов.
Можно сказать, что Angular не просто фреймворк, а платформа, которая позволяет разработчикам строить приложения для веба, мобильных устройств и десктопа. Более подробно архитектуру можно изучить в этом руководстве.
Введение в Angular: сложности Angular
Должен сказать, но к сожалению, Angular довольно большой и сложный фреймворк с своей философией. Новичкам будет сложно понять и привыкнуть. Изучение концепций фреймворка – не единственная задача. Вам необходимо знать множество дополнительных технологий:
Рекомендуется писать приложения Angular на TypeScript, поэтому его нужно понимать. Можно писать код на современном JS (ES6), но я редко вижу такое.
TypeScript – надстройка JS. Поэтому ее тоже нужно знать.
Чтобы еще сильнее ускорить процесс разработки, нужно понять Angular CLI.
Для установки Angular и других компонентов активно используется npm. Его также нужно знать.
Умение настраивать таск раннеры типа Gulp или Grunt также может пригодиться. С их помощью можно много чего сделать перед развертыванием приложения в продакшене.
Сейчас широко используются минификаторы типа UglifyJS и упаковщики типа Webpack.
Во время разработки приложения очень важно иметь возможность отлаживать код. Нужно уметь работать в инструментах отладки типа Augury.
Очень важно тестировать приложения Angular, которые могут стать очень сложными. Один из самых популярных инструментов тестирования — Jasmine (фреймворк для тестирования) и Protractor (используется для сквозного тестирования).
Как видите, нужно много чего изучить, чтобы начать создавать клиентские веб-приложения. Но не опускайте руки: в сети полно ресурсов по изучению всех этих инструментов и техник. Конечно, понадобится какое-то время на изучение, но вы получите ценный опыт и сможете создавать сложные приложения с легкостью.
Стоит отметить, что иногда использовать Angular для приложения будет излишне. Если проект маленький или средний без сложного UI и взаимодействия, возможно, лучше взять старый добрый JS. Поэтому очень важно оценить все требования, функции нового приложения и дедлайны перед принятием решения об использовании JS фреймворка.
Заключение
В этом введении в Angular мы обсудили Angular, клиентский фреймворк с поддержкой нескольких платформ. Мы узнали о его некоторых функциях и концепциях, а также узнали об отличии от AngularJS, предыдущей версии фреймворка.
Надеюсь, теперь вы понимаете основную идею Angular, и где он может пригодиться!
Автор: Ilya Bodrov-Krukowski
Редакция: Команда webformyself.
Бесплатный курс «Laravel + Angular. Быстрый старт»
Изучите курс и узнайте, как создать веб-приложение с нуля на Angular и Laravel
Что такое Angular
И зачем он фронтенд-разработчику.
Если посмотреть на вакансии фронтендеров, мы часто заметим там три слова: Angular, React и Vue. Это равнозначные технологии, которые одинаково популярны и различаются в деталях. Погружение в детали отнимает время, и поэтому обычно разработчики выбирают что-то одно — изучают то, что больше понравилось.
Сегодня мы познакомимся с Angular. Разберёмся, как устроена технология и что нужно знать для её изучения.
Angular — это фреймворк компании Google. Он нужен для разработки браузерных, десктопных и мобильных приложений — таких, где можно быстро и бесшовно перемещаться по сайту.
Что было до Angular и других SPA-фреймворков
Angular работает по принципу SPA, single-page application. Чтобы понять, что это такое, надо сначала понять, чем это не является.
Традиционный подход к веб-приложениям был примерно такой:
Это можно сравнить с заказом еды в ресторане, с той лишь разницей, что заказать можно только одно блюдо за один раз. Заказал салат, съел, только потом заказал горячее. Теперь сидишь ждёшь, пока тебе его принесут. Съел горячее — заказал чай. Ждёшь, пока вскипит чайник. Принесли чай — заказал десерт. Ждёшь, когда поднимутся коржи. Вот то же самое, только в тысячу раз быстрее.
Медленные сайты всех раздражали, и разработчики придумали SPA — сначала появилась технология, а затем Angular и другие инструменты для её реализации.
Что такое SPA, single-page application
Single-page application расшифровывается как «приложение на одной странице». Работает так:
👉 Single-page означает, что сайт технически работает как бы на одной странице: там есть шапка, подвал, какое-то меню, а основное «мясо» страницы загружается динамически, в фоновом режиме, без участия пользователя. Самый наглядный пример такого приложения — это соцсеть VK: пока вы листаете ленту, вам могут написать сообщение, и оно появится на экране само, без необходимости перезагружать страницу.
Без SPA вам приходилось бы постоянно перезагружать страницу с сообщениями, чтобы понять, написали вам или нет. А с SPA всё происходит само.
Как устроен Angular: компоненты
Angular-приложения состоят из независимых элементов. Эти элементы называются компонентами, и у каждого компонента своё поведение.
Например, лента новостей — один компонент. Отвечает за отображение списка новостей на странице. Кнопка «Прочитать» — другой компонент. Отвечает за переход со страницы списка новостей к выбранной новости.
Обычно компонент программируют так, чтобы он отображал элемент на экране и выполнял какое-то действие. Компонент может реагировать на клик, сворачиваться, разворачиваться, скрываться, перебрасывать на другую страницу и так далее.
Компоненты подчиняются жизненным циклам — меняются и работают по нескольким запрограммированным сценариям. Возьмём ситуацию, когда мы переходим со страницы списка новостей к одной новости. В этом случае компонент «Лента новостей» уничтожается и при необходимости создаётся повторно. Жизненные циклы разгружают память и ускоряют приложение.
Страница с шапкой, лентой новостей и тремя кнопками. Каждый элемент — независимый компонент, который выполняет какое-то действие внутри приложения
Как устроен Angular: модули
Все компоненты подключаются к главному или дополнительным модулям. Модули управляют компонентами. Главный модуль контролирует всё приложение, а дополнительные модули следят за работой отдельных элементов.
Дополнительных модулей много. Они выполняют узкую задачу, подчиняются основному модулю и нужны для его разгрузки — отвечают за навигацию, анимацию, хранилище компонентов, взаимосвязь с браузером и прочие действия.
Взаимосвязь компонентов и модулей. К главному модулю можно подключить любое число дополнительных модулей, а к дополнительным модулям — любое число компонентов
Как устроен Angular: сервисы
Для сложных операций вместо компонентов используют сервисы. Они отвечают только за тот набор логических операций, для которых он предназначен.
Например, мы можем подключить сервис «Таблицы». Это поможет отслеживать страницы с большим количеством данных, которые после обновлений меняют содержимое сайта. Никаких других действий сервис «Таблицы» выполнять не будет.
Взаимосвязь компонентов, модулей и сервисов
Как устроен Angular: директивы
Иногда один компонент с одинаковой логикой используется в разных частях приложения. Например, если нажать на кнопку переключения валют и выбрать доллар, то возле всех цен на сайте должен появиться значок доллара.
Этот значок можно получить с помощью компонентов и директив. Компоненты проставлять долго — если на сайте 1 000 позиций с ценой, то возле всех нужен компонент со значком доллара. Директивы упрощают процесс — вы создаёте один новый блок, и он будет отвечать за значок доллара возле всех цен на сайте.
Взаимосвязь компонентов, модулей, сервисов и директив. Директивы работают независимо от модулей и могут встраиваться в любую часть приложения
Как устроен Angular: формы
Практически в любом приложении есть формы с полями и кнопками — отправить, сохранить, оставить номер телефона и так далее. В Angular для этих форм не нужно продумывать логику и тратить время на разработку — достаточно выбрать блоки с подходящими формами и подключить их к главному модулю.
Взаимосвязь компонентов, модулей, сервисов, директив и форм в Angular-приложениях
Как изучить Angular
Angular — это фреймворк для опытных фронтенд-разработчиков. Его не изучают на курсах программирования с нуля, потому что для коммерческой разработки нужные общие знания:
Требования к Angular-разработчикам периодически обновляются и публикуются на roadmap.sh. Ещё мы рекомендуем посетить madewithangular.com — это сайт с перечнем приложений и сервисов на Angular. Если не понравится результат, то вы не потратите время и выберете для обучения другой фреймворк — React или Vue.
Карта навыков фронтенд-разработчика в 2021 году. Если хотите изучить Angular — придётся освоить больше половины обязательных технологий
Что дальше
Мы рассмотрели структуру и базовые возможности Angular. Чтобы узнать больше — посмотрите официальную документацию.