15 Корисні інструменти AngularJS для розробників

Думаючи про занурення пальців у Angular? Якщо ви пережили наші 10 найкращих підручників, щоб дізнатися посаду AngularJS, і хотіли б пограти з Angular самостійно, ви знаходитесь на правильній посаді. У нас тут деякі інструменти, які можуть спростити ваш робочий процес розробки.

Ми дивимося на 15 з кращі IDE, текстові редактори, інструменти для тестування та налагодження, модулі і засоби розробки та програми для будівництва з Angular. Якщо у вас є улюблені інструменти або програми, поділіться ними з нами в коментарях нижче.

IDE і текстовий редактор

У світі програмування існує два типи редакторів: повнофункціональне середовище розробки (IDE) і легкі текстові редактори. Обидва дозволяють швидше розвивати робочий процес. Нижче перераховані нижче IDE і текстовий редактор є досить хорошими інструментами для прискорення розвитку Angular. Вони можуть бути легко налаштовані для середовища Angular.

WebStorm

WebStorm підходить не тільки для Javascript, але також HTML і CSS. Він має чудовий редактор, який дозволяє переглядати результати кодування в браузері без необхідності частого оновлення. Типово, їхня найновіша версія містить пакет плагінів AngularJS, хоча вам слід спочатку включити скрипт Angular у ваш проект. Для більш докладної інформації читайте пост блогу WebStorm.

Aptana

Aptana є вільним відкритим вихідним кодом IDE, який насправді є налаштованою версією Eclipse, що орієнтується на Javascript, HTML, CSS та інші веб-властивості. Щоб розширити Aptana для підтримки Angular, потрібно лише встановити розширення AngularJS Eclipse з Ринок Eclipse.

Високий текст

Один з найпопулярніших текстових редакторів доступний, Sublime Text любиться багатьма з-за його налаштування для адаптації до будь-якого виду середовища програмування. Це також швидко і має настроюється підтримка фрагмента коду, і має багато пакетів, включаючи пакет AngularJS, які дозволяють працювати з Angular. Ось велика посада Дана Уоліна, яку ви можете перевірити.

Детальніше про високий текст:

• 18 важливих плагінів Sublime Text
• 12 Найпопулярніші підказки і підказки
• Як вставити шлях до файла Sublime Text
• Швидкий перегляд проекту Localhost з високим текстом
• Керувати примітками та списками з високим текстом
• Додавання префікса постачальника CSS з високим текстом

Інструменти тестування та налагодження

Тестування та налагодження є важливими частинами процесу розвитку, особливо в середовищі, подібній до Angular. Ось деякі з інструментів, які допоможуть вам перевірити та налагодити програму.

Карма

Карма є прекрасним тестовим бігуном, створеним для Angular, але також може використовуватися з будь-якою іншою системою Javascript. Він підтримує будь-який тип тестування: модульне тестування, середнє тестування і Тестування E2E. Карма працює, відкриваючи браузери, які ви перераховуєте в конфігураційному файлі. Потім він зв'язується з активним браузером за допомогою socket.io і запитує, чи потрібно виконати тест чи ні.

Жасмин

Jasmine використовується для розвитку поведінки (BDD), але ви можете використовувати її для тестового розвитку (TDD) з невеликою настройкою. Як правило, це поєднується з кармою: Карма як тестовий бігун, Жасмин як тестовий фреймворк. Jasmine автоматично перевірятиме всі класи та функції Javascript та повідомлятиме вам про необроблений код. Недоліком є він не знає, в якому середовищі (браузерах) виконувався тест, але Карма компенсує цей недолік.

MochaJS

У порівнянні з Жасмин, MochaJS є більш гнучким але Жасмин поставляється як пакет «все-в-одному». З MochaJS, якщо ви хочете використовувати шпигунську структуру, вам потрібно налаштувати Mocha з відповідною бібліотекою, подібною до sinon.js. І якщо вам потрібна рамка твердження, Mocha повинна бути налаштована з рамками, як Chai.

Транспортир

Транспортир - це, мабуть, найпотужніший автоматизований кінець в кінець (e2e) Інструмент для кутового тестування. Розроблений командою Angular, транспортир будується шляхом поєднання деяких великих технологій, доступних сьогодні NodeJS, Selenium, webDriver, Мокко, огірок і Жасмин.

Кутова Батаранг

Крім того Транспортир, Іншим чудовим інструментом, розробленим командою Angular, є Angular Batarang. Batarang - це розширення Chrome для налагодження додатків Angular. Після перевірки вашої програми, Batarang покаже вам модель, продуктивність і залежність результати налагодження в трьох різних вкладках. Ви також можете контролювати перевірку, вирішуючи, чи показувати програми, прив'язки або області застосування.

ng-інспектор

ng-inspector - це розширення для веб-переглядача, що підтримується Chrome і Safari. На відміну від Batarang, який відображається в DevTools, ng-inspector віддає перевагу відображенню на бічній панелі. Під час наведення курсору миші на область видимості можна перевіряти та виділяти елементи DOM. Ви також можете побачити масштаб і модель, оновлені в режимі реального часу.

Модулі

Найкращим місцем для пошуку модулів Angular є ngmodules.org. Але якщо вам потрібен короткий огляд, нижче наведено перелік хороших ресурсів, які ми зібрали для вас.

AngularUI

AngularUI - це набір компонентів інтерфейсу користувача, побудованих за допомогою AngularJS. Його директиви допомагають швидше створювати програми Angular. Замість віджетів, AngularUI використовує такі директиви як raw ui-router, ui-map, ui-календар і т.д. Директиви, які ви, ймовірно, сподобаються найбільше, є його UI-Bootstrap, які можуть бути спочатку створити щебет Bootstrap in Angular. Ознайомтеся з його чистою та приємною сторінкою документації, щоб почати.

ng-Table - Таблиця сортування та фільтрації

Якщо вам потрібні таблиці у вашому веб-додатку, вид, який можна відсортувати і відфільтрувати, то ngTable є інструментом, який ви шукаєте. Він також підтримує змінні висоти рядків і великі можливості розбиття на сторінки.

Нестандартна

За допомогою Angular, можливо, вам важко працювати $ ресурс і $ http для створення API Rest. Restangular може допомогти зробити простіше користуватися послугами отримання, видалення, оновлення та публікації даних. Деякі функції, які встановлюють Restangular, крім $ ресурс є підтримка методу HTTP, самозв'язуючий елемент, обіцяє використання та багато іншого. Дізнайтеся більше тут і перевірте демонстрацію на Plunkr.

Кутовий Gettext

Angular-Gettext - чудовий кутовий модуль для суперлегкої локалізації. Ключові особливості - ви можете перекласти веб-додаток так само просто, як додавання атрибут. Вона дозволяє зосередитися на розробці програм і залишити всі переклади до Angular-Gettext.

Інструменти та програми

Нарешті, ми просто залишимо це тут. Це перелік додаткових інструментів і програм, які, ймовірно, можуть полегшити і згладити процес розробки Angular. Вони добре працюють з тими, хто тільки починає збирати Angular.

Генератор кутовий

Yeoman має генератор коду, який називається Generator Angular. За допомогою цього інструменту ви зможете прискорити розробку Angular лише парами команд терміналу. Він може автоматично генерувати сервер розробки, тестування одиниць і фреймів, перегляд, директиви та багато іншого.

ngDocs - AngularJS Reference

ngDocs - програма для Android, яка надає документацію та посилання AngularJS, приємні та прості. Деякі основні підручники також доступні, якщо ви новачок у Angular. Є додаткові функції, такі як посібник розробника та посилання на помилки, які ви можете побачити. За допомогою цього на своєму пристрої Android, підніміть на Angular куди завгодно.