Що входить в Angular
Angular називають фреймворком «з батарейками»: базові інструменти не треба шукати й поєднувати самостійно. У нього вбудовані:
- маршрутизація з перевіркою прав доступу до розділів і відкладеним завантаженням модулів;
- два підходи до форм, зокрема реактивні форми для складних анкет із залежними полями;
- клієнт для запитів до сервера з можливістю централізовано додавати авторизацію й обробку помилок;
- впровадження залежностей — механізм, який дозволяє легко підміняти частини системи і тестувати їх окремо;
- інструмент командного рядка, що створює модулі, компоненти й сервіси за однаковим шаблоном.
Для роботи з потоками даних Angular використовує бібліотеку RxJS, а в нових версіях з’явилися простіші способи керування станом компонентів.
Переваги Angular
- Однакова структура в усіх проєктах. Розробник, знайомий з Angular, швидко розбирається в чужій системі, бо файли й правила скрізь організовані схоже.
- Масштабування на велику команду. Чіткі межі модулів дозволяють кільком групам працювати паралельно, не заважаючи одна одній.
- TypeScript від початку. Типізація вбудована у фреймворк, тому помилки в даних виявляються до запуску, а рефакторинг великих частин безпечніший.
- Сильна сторона — форми. Складні перевірки, залежні поля, динамічні блоки реалізуються стандартними засобами, без сторонніх бібліотек.
- Передбачуване оновлення. Нові версії виходять за відомим графіком, а для переходу між ними є офіційні інструкції та автоматичні інструменти.
Недоліки, які варто враховувати
- Високий поріг входу. Впровадження залежностей, RxJS, власні правила фреймворку — розробнику без досвіду Angular потрібен помітний час на навчання.
- Багато коду навіть для простого. Невелика функція вимагає кількох файлів. Для маленьких проєктів це зайві витрати.
- Менше розробників, ніж на React. Спеціалістів на ринку достатньо, але вибір вужчий, і це варто враховувати, плануючи власну команду.
- Не для публічних сайтів «з коробки». Серверний рендеринг в Angular є, але для контентних сайтів, орієнтованих на пошук, зазвичай є простіші варіанти.
Коли краще обрати React чи Vue
- Потрібен гнучкий інструмент для продукту, який швидко змінюється, і важливо мати найбільший вибір готових бібліотек та розробників — варто розглянути React.
- Невелика команда хоче швидко стартувати з простим і зрозумілим кодом — підійде Vue.js.
- Сайт компанії зі сторінками послуг, новинами й формою заявки — тут фреймворк для застосунків не потрібен узагалі.
Якщо ж у вас уже є команда на Angular або система, написана на ньому, переходити на інший фреймворк заради моди не варто: дешевше й безпечніше розвивати наявне.
Де Angular розкривається
Angular виправдовує свою складність там, де інтерфейс — це робочий інструмент для багатьох людей. Наприклад:
- корпоративні та веб-портали з розділами для різних відділів і партнерів;
- системи обліку, планування й звітності з десятками форм;
- кабінети з розгалуженою моделлю прав: хто може переглядати, редагувати, погоджувати;
- інтерфейси, де дані оновлюються з кількох джерел одночасно.
Новий проєкт на Angular: з чого починаємо
У великій системі найдорожчі помилки — ті, що закладені на старті. Тому перш ніж писати код, ми домовляємося з вами про основу:
- як система ділиться на модулі і які з них можна буде доручити окремій команді;
- яка модель ролей і прав, і де саме перевіряється доступ — у маршрутах, на екранах, на сервері;
- який набір компонентів інтерфейсу використовуємо: готову бібліотеку чи власну під ваш дизайн;
- як контракт з бекендом перетворюється на типи, щоб зміни в API одразу були видні у фронтенді.
Ці рішення фіксуємо в документації проєкту. Так нові розробники, і наші, і ваші, працюють за однаковими правилами.
Перехід з AngularJS і оновлення старих версій
AngularJS — перша версія фреймворку, яка суттєво відрізняється від сучасного Angular. Офіційна підтримка AngularJS завершена, а системи на ньому дедалі складніше підтримувати: бібліотеки застаріли, розробників, готових з ними працювати, стає менше.
Переписувати все одразу ризиковано. Ми переносимо систему частинами: нові розділи пишемо на Angular, старі переводимо по одному, і користувачі весь час працюють в одному застосунку. Детальніше про підхід — на сторінці модернізації застарілих систем.
Якщо проєкт уже на Angular, але відстав на кілька версій, оновлюємо його послідовно, версія за версією, перевіряючи сумісність бібліотек на кожному кроці. Перестрибувати через кілька версій одразу зазвичай дорожче.
Тестування й якість коду
Великі системи ламаються не там, де змінювали код, а поруч. Тому в проєктах на Angular ми покриваємо автоматичними тестами бізнес-логіку в сервісах, складні форми й сценарії, від яких залежить робота компанії: оформлення заявки, погодження документа, розрахунок. Тести запускаються автоматично при кожній зміні, і помилка виявляється до того, як потрапить до користувачів.
Що впливає на вартість і терміни
- Масштаб системи: скільки в ній модулів, ролей користувачів і бізнес-процесів.
- Складність форм і таблиць: залежні поля, перевірки, редагування в таблиці, експорт.
- Стан бекенду й інтеграцій з обліковими та внутрішніми системами компанії.
- Вимоги до тестування і документації.
- Для старих проєктів — версія Angular або AngularJS, обсяг коду й кількість застарілих бібліотек.
Точну оцінку даємо після розбору задачі або технічного аудиту наявної системи.
Часті запитання
Чим Angular відрізняється від AngularJS? Це фактично різні фреймворки з різною архітектурою. Автоматично перетворити код з одного на інший не можна, потрібна поетапна міграція.
Чи можна підтримувати систему на Angular своїми силами після запуску? Так. Стандартна структура фреймворку, типізація й тести полегшують передачу проєкту вашим розробникам.
Чи підходить Angular для мобільних пристроїв? Інтерфейс на Angular можна зробити адаптивним, і він працюватиме в браузері смартфона. Для повноцінного застосунку в App Store та Google Play зазвичай обирають інші технології.
Як часто треба оновлювати Angular? Нові версії виходять регулярно. Ми радимо не відкладати оновлення надовго: послідовний перехід між сусідніми версіями значно простіший, ніж стрибок через кілька.
Чому Promodex
Promodex створює сайти, веб-системи й мобільні застосунки з 2015 року — за цей час набралося 750+ проєктів. Фронтенд, бекенд і дизайн виконують 30+ співробітників агентства, без сторонніх команд, тому інтерфейс і серверна частина проєктуються узгоджено. Формат роботи підлаштовуємо під ваш бюджет і графік, кожне рішення пояснюємо, а після запуску беремо систему на підтримку, плануємо оновлення Angular і розробку нових модулів.
