Angular — мощный JavaScript-фреймворк, разработанный корпорацией Google. С его помощью можно создавать клиентские приложения любой сложности. Компания Google представила свое детище в далеком 2009 году и с тех пор множество разработчиков активно используют этот инструмент. Расскажем о нем немного подробнее.
Необходимо отметить, что Ангуляр нацелен на разработку преимущественно Single Page Application-решений (SPA), то есть мы сейчас говорим об одностраничных приложениях. В данном плане этот фреймворк от Google можно назвать наследником AngularJS, однако Ангулар все же не обновленная версия AngularJS, а принципиально новый продукт, хоть и написанный той же командой из Google.
Раз мы вспомнили про AngularJS, то скажем, что в нем реализована поддержка мобильных устройств. Наиболее простым способом разработки мобильных приложений с AngularJS является применение HTML и CSS, позволяющих создавать работоспособные мобильные приложения (AngularJS-приложения сами по себе базируются на HTML, а это оставляет возможность выбора архитектуры в целях взаимодействия с разными устройствами для реализации нужных проектов).
В чем сила, брат?
Скажем несколько слов про особенности Angular от Google:
— 2-стороннее связывание, которое позволяет динамически менять данные в одном месте интерфейса в случае изменения данных модели в другом месте. Речь идет о концепции 2-сторонней привязки данных — two-way data binding. Согласно ей, изменения в данных будут тотчас отражаться на странице, в то время как пользовательские изменения будут сохраняться в связанных переменных.
— наличие шаблонов;
— поддержка маршрутизации;
— более быстрое написание приложений за счет отказа от дополнительного слоя обработчиков действий на формах. Плюс происходит передача измененных данных в общее хранилище с последующим извлечением их из этого хранилища для отображения обновленной страницы;
— внедрение зависимостей (Dependency Injection). Очередная фишка Angular. Технология известна давно, применялась в языках типа Java и C#. Для фронтенда она тоже очень пригодилась. Нужен HttpClient? Не вопрос — внедряй и пользуйся на здоровье;
— применение TypeScript в качестве языка программирования (эту особенность нередко называют ключевой, поэтому вам понадобится знать основы этого языка).
Однако не стоит думать, что мы ограничены лишь TypeScript. Если очень хочется, есть возможность писать Angular-приложения посредством Dart либо JavaScript. Но все же стоит понимать, что TypeScript — это основной язык для Angular.
Начало работы с Angular от Google
Для начала работы надо инсталлировать сервер Node.js, а также пакетный менеджер npm (если их нет на вашей рабочей машине). Прохождение дополнительных уроков и какие-то специализированные профессиональные знания для работы с NodeJS/npm вам не понадобятся. Инсталляцию Node.js можно выполнить специальной программой. Хорошая новость — одновременно с сервером установится и npm.
На момент написания материала последней версией Angular от Google была версия № 12, которая увидела свет в мае 2021 г. Официальный репозиторий этого фреймворка вы можете без проблем найти в документации на GitHub: https://github.com/angular/angular. Там же есть исходные файлы и различная дополнительная информация. Также в наличии исчерпывающая документация на русском: https://github.com/AngularjsRUS/angular-doc. Найти подробный цикл документации на русском можно и здесь: https://nodejs.org/ru/docs/.
Важно понимать, что Angluar 12 поддерживает лишь те node.js-версии, которые на момент инсталляции находятся в следующих статусах:
- «Active LTS»;
- «Maintenance LTS».
Проверить статус версии node.js вы можете в следующем документе: https://nodejs.org/en/about/releases/. Если же Node.js раньше уже был инсталлирован, однако имеет устаревшую версию, то лучше его обновить.
Аналогичным образом обстоит ситуация и с npm, поэтому при работе с Angular желательно полагаться на ту версию пакетного менеджера, которая инсталлируется совместно с LTS-версией Node.js.
Хотите стать специалистом по разработке приложений web и mobile? Желаете освоить полный спектр современных технологий: Node.js, Angular, React, Vue, Svelte, TypeScript? Добро пожаловать на специализированный цикл уроков по JavaScript в Otus для продвинутых! Преподавание ведется практикующими экспертами на русском языке.
Статья написана по материалам уроков https://metanit.com/web/angular2/1.1.php и цикла статей по JavaScript: https://otus.ru/nest/javascript-art/.