15 Полезни AngularJS инструменти за разработчици

Мислите ли да потапяте пръстите си в ъглова? Ако сте преминали през нашите 10 най-добри уроци, за да научите публикацията на AngularJS и бихте искали да си поиграете с Angular сами, вие сте на правилния пост. Имаме тук някои инструменти, които могат да рационализират работния процес за развитие.

Разглеждаме 15 от най-добрите IDE, текстови редактори, инструменти за тестване и отстраняване на грешки, модули и инструменти за разработка и приложения за строеж с ъглови. Ако имате любимите си инструменти или приложения, споделете ги с нас в коментарите по-долу.

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

В света на програмирането има два вида редактори: пълна интегрирана среда за разработка (IDE) и леки текстови редактори. И двете позволяват по-бърз работен процес за развитие. IDE и текстовият редактор, изброени по-долу, са доста добри инструменти за ускоряване на развитието на ъгъла. Те могат лесно да бъдат конфигурирани за ъгловата среда.

WebStorm

WebStorm е подходящ не само за Javascript, но също и за HTML и CSS. Той има страхотен редактор на живо, който ви позволява да виждате резултатите от кодирането в браузъра, без да е необходимо честото опресняване. По подразбиране най-новата им версия носи приставката AngularJS, въпреки че първо трябва да включите Angular script в проекта си. За повече подробности прочетете блога на WebStorm.

Aptana

Aptana е безплатен отворен IDE, който всъщност е персонализираната версия на Eclipse, фокусираща се върху Javascript, HTML, CSS и други уеб екстри. За да разширите Aptana за Angular support, всичко, което трябва да направите, е да инсталирате разширението AngularJS Eclipse от Eclipse Marketplace.

Възвишен текст

Един от най-популярните текстови редактори на разположение, Sublime Text е обичан от много хора, тъй като той може да се адаптира към всякакъв вид среда за програмиране. Той също така е бърз и има възможност за персонализиране на кодовия фрагмент и има много пакети, включително пакет AngularJS, който ви позволява да работите с Angular. Ето един чудесен пост от Dan Wahlin, който можете да проверите за това.

Повече за високия текст:

• 18 основни Sublime Текст плъгини
• 12 Най-издирвани възвишени текстови съвети и трикове
• Как да вмъкнем Пътя на файла в Sublime Text
• Бърз преглед на Localhost проект с Sublime Text
• Управление на бележки и списъци с висок текст
• Добавяне на CSS Vendor префикс с Sublime текст

Инструменти за тестване и отстраняване на грешки

Тестване и отстраняване на грешки са важни части от процеса на развитие, особено в среда като Angular. Ето някои от инструментите, които могат да ви помогнат да тествате и отстранявате грешки в приложението си.

Карма

Карма е чудесен тест за Angular, но може да се използва и с всяка друга Javascript рамка. Той поддържа всеки тип тестване: единично изпитване, междинно изпитване и E2E тестване. Карма работи чрез отваряне на браузъри, които сте посочили в конфигурационния файл. След това той комуникира с активния браузър, използвайки socket.io и ви пита дали да изпълните теста или не.

жасмин

Jasmine се използва за развитие, основаващо се на поведението (BDD), но можете да го използвате за разработка, основана на теста (TDD), с малко персонализиране. Обикновено е съчетано с Карма: Карма като тест-бегач, Жасмин като тестова рамка. Jasmine автоматично ще инспектира всичките ви класове и функции на Javascript и ще ви уведоми за необработен код. Недостатъкът е не знае коя среда (браузъри) е извършила теста, но Карма компенсира този недостатък.

MochaJS

В сравнение с Жасмин, MochaJS е по-гъвкава но Жасминът се предлага като пакет "всичко в едно". С MochaJS, ако искате да използвате шпионска рамка, трябва да настроите Mocha със съответната библиотека като sinon.js. И ако имате нужда от рамка на твърдение, Mocha трябва да бъде конфигуриран с рамка като Chai.

транспортир

Протракторът е може би най-мощният автоматизиран от край до край (e2e) Инструмент за ъглово изпитване. Разработен от екипа на Angular, Protractor е изграден чрез комбиниране на някои велики технологии, достъпни днес NodeJS, Селен, webDriver, Мока, Краставица и жасмин.

Ъгловият Batarang

Освен това транспортир, друг голям инструмент, разработен от ъгловия екип, е Angular Batarang. Batarang е разширението на Chrome за отстраняване на грешки в приложения с ъглово действие. След проверка на приложението ви, Batarang ще ви покаже модел, производителност и зависимост отстраняване на грешки в три различни раздела. Можете също да контролирате инспекцията и да решите дали да я покажете приложения, обвързвания или обхвати.

NG-инспектор

ng-inspector е разширение за браузър, поддържано от Chrome и Safari. За разлика от Batarang, който се показва в DevTools, ng-inspector предпочита вместо това дисплеят на страничния панел. Можете да инспектирате и маркирате елементите на DOM, когато задържите курсора на мишката върху обхват. Можете също да видите обхвата и модела, актуализирани в реално време.

модули

Най-доброто място за намиране на Angular модули е ngmodules.org. Но ако имате нужда от бърз преглед, по-долу е даден списък на някои добри ресурси, които сме събрали за вас.

AngularUI

AngularUI е колекция от UI компоненти, изградени с AngularJS. Неговите директиви за комунални услуги ви помагат да изграждате приложенията Angular по-бързо. Вместо джаджи, AngularUI използва подобни директиви UI-рутер, UI-карта, UI-календар Директивите, които най-вероятно ще ви харесат най-много, са UI-Bootstrap, които могат да бъдат оригинални създайте Twitter Bootstrap в Angular. Проверете страницата за чиста и приятна документация, за да започнете.

Таблица - Таблица за сортиране и филтриране

Ако имате нужда от таблици във вашето уеб приложение, от вида, който може да се сортира и филтрира, тогава ngTable е инструментът, който търсите. Той също така поддържа променливи височини на редове и големи възможности за страниране.

Restangular

С Angular, може да имате трудно работно време $ ресурс и $ HTTP за създаване на API за Rest. Restangular може да помогне по-лесното използване на заявки за получаване, изтриване, актуализиране и изпращане на данни. Някои функции, които поставят Restangular освен $ ресурс са поддръжка на HTTP метод, самосвързващ елемент, обещания за използване и много други. Научете повече тук и проверете демото на Plunkr.

Ъгловият Gettext

Angular-Gettext е превъзходен модул Angular за супер лесна локализация. Основните характеристики са, че можете да преведете уеб приложението си толкова лесно, колкото да добавите атрибут. Тя ви позволява да се съсредоточите върху развитието на вашите приложения и да оставите всички преводи на Angular-Gettext.

Инструменти и приложения

И накрая, просто ще оставим това тук. Това е списък с повече инструменти и приложения, които вероятно могат да направят процеса на развитие на Angular по-лесен и по-гладък. Те работят добре с тези, които току-що започват да вземат Angular.

Генераторът ъглов

Yeoman има генератор на код, наречен Generator Angular. С този инструмент можете да ускорите развитието на ъгъла само с двойки от командния терминал. Той може автоматично да генерира сървър за разработка, тестване на единица и рамка, изглед, директиви и др.

ngDocs - AngularJS Reference

ngDocs е приложение за Android, което предоставя документация и препратки на AngularJS, приятни и прости. Някои основни уроци също са достъпни, ако сте нови за Angular. Има допълнителни функции като ръководство за разработчици и справка за грешки, които бихте искали да видите. С това на вашето устройство Android, вземете Angular, където и да отидете.