15 Användbara AngularJS-verktyg för utvecklare

Tänker du att doppa tårna i vinkel? Om du har gått igenom våra 10 bästa tutorials för att lära dig AngularJS-post och vill spela runt med Angular på egen hand, är du på rätt post. Vi har här några verktyg som kan effektivisera ditt utvecklings arbetsflöde.

Vi tittar på 15 av bästa IDE, textredigerare, verktyg för testning och felsökning, moduler och utvecklingsverktyg och appar för att bygga med vinkel. Om du har dina favoritverktyg eller appar kan du dela dem med oss i kommentarerna nedan.

IDE & Text Editor

I programmeringsvärlden finns det två typer av redaktörer: fullfjädrad integrerad utvecklingsmiljö (IDE) och lätta textredigerare. Båda möjliggör snabbare utvecklingsarbete. IDE och textredigeraren som vi listade nedan är ganska bra verktyg för att påskynda din Angular-utveckling. De kan enkelt konfigureras för vinkelmiljön.

WebStorm

WebStorm passar inte bara för Javascript utan även HTML och CSS. Den har en fantastisk levande redaktör som låter dig se dina kodningsresultat i webbläsaren utan att behöva frekvent uppdatera. Som standard bär den senaste versionen AngularJS-pluginpaketet, även om du måste inkludera Angular-skriptet i ditt projekt först. För mer information, läs WebStorm blogginlägg.

Aptana

Aptana är en fri öppen källkod IDE som egentligen är den anpassade versionen av Eclipse med inriktning på Javascript, HTML, CSS och andra webgodis. För att förlänga Aptana för vinkelstöd, behöver du bara installera AngularJS Eclipse extension från Eclipse Marketplace.

Sublim Text

En av de mest populära textredigerarna finns, Sublime Text är älskad av många på grund av dess anpassningsförmåga att anpassa sig till någon form av programmeringsmiljö. Det är också snabbt och har anpassningsbar kodstödstöd och har många paket inklusive AngularJS-paketet som låter dig arbeta med Angular. Här är ett bra inlägg av Dan Wahlin du kan kolla på detta.

Mer om Sublim Text:

18 väsentliga Sublime Text plugins
12 Most Wanted Sublime Text tips och tricks
Så här infogar du filvägen i Sublime Text
Snabbhandsvisning Localhost-projekt med Sublime Text
Hantera anteckningar och listor med sublim text
Lägga till CSS-leverantörs prefix med sublim text

Testnings- och felsökningsverktyg

Testa och felsöka är viktiga delar av utvecklingsprocessen, särskilt i en miljö som Angular. Här är några av de verktyg som kan hjälpa dig att testa och felsöka din ansökan.

Karma

Karma är en bra testrunner gjord för Angular, men kan också användas med någon annan Javascript-ram. Den stöder alla typer av testning: enhetstestning, halvvägs testning och E2E-testning. Karma fungerar genom att öppna webbläsare som du listar i konfigurationsfilen. Den kommunicerar sedan med den aktiva webbläsaren med hjälp av socket.io och frågar om testet ska köras eller inte.

Jasmin

Jasmine används för beteendestyrd utveckling (BDD), men du kan använda den för testdriven utveckling (TDD) med lite anpassning. Det är vanligtvis kopplat till Karma: Karma som testlöpare, Jasmine som testram. Jasmine inspekterar automatiskt alla dina Javascript-klasser och funktioner och meddelar dig om obehandlad kod. Nackdelen är det vet inte vilken miljö (webbläsare) testet utfört, men karma kompenserar för denna nackdel.

MochaJS

Jämfört med Jasmine, MochaJS är mer flexibel men Jasmine kommer som ett allt-i-ett-paket. Med MochaJS, om du vill använda spionramar, måste du konfigurera Mocha med sitt lämpliga bibliotek som sinon.js. Och om du behöver anklagningsramar behöver Mocha konfigureras med ett ramverk som Chai.

Protractor

Protractor är förmodligen den mest kraftfulla automatiserade början till slut (e2e) Vinkelprovningsverktyg. Protractor utvecklas av Angular-teamet, byggt genom att kombinera några bra tekniker som finns tillgängliga idag NodeJS, Selen, WebDriver, Mocka, Gurka och Jasmin.

Vinkel Batarang

Förutom Protractor, Ett annat bra verktyg som utvecklats av Angular Team är Angular Batarang. Batarang är en Chrome-förlängning för felsökning av felsökning. Efter inspektion av din app kommer Batarang att visa dig modell, prestanda och beroende felsökning resulterar i tre olika flikar. Du kan också kontrollera inspektionen, bestämma om du ska visa applikationer, bindningar eller omfattningar.

ng-inspektör

ng-inspektör är en webbläsaretillägg som stöds i Chrome och Safari. Till skillnad från Batarang som visas i DevTools, föredrar ng-inspektören sidopanelens display istället. Du kan inspektera och markera DOM-element som du svävar över ett räckvidd. Du kan också se omfattningen och modellen uppdaterad i realtid.

moduler

Det bästa stället att hitta Angular modules är ngmodules.org. Men om du behöver en snabb översikt, nedan är en lista över några bra resurser som vi har samlat in för dig.

AngularUI

AngularUI är en samling av gränssnittskomponenter byggda med AngularJS. Dess användningsdirektiv hjälper dig att bygga snabba applikationer snabbare. Istället för widgets använder AngularUI råa riktlinjer som ui-router, ui-karta, ui-calendar etc. De direktiv som du förmodligen gillar mest är dess UI-Bootstrap som kan vara inbyggt skapa Twitter Bootstrap i Angular. Kolla in sin rena och trevliga dokumentationssida för att komma igång.

ng-tabell - Sortering och filtrering Tabell

Om du behöver tabeller i din webbapplikation, vilken sort som kan sorteras och filtreras, är ngTable det verktyg du letar efter. Det stöder också variabla radiehöjder och bra paginationsfunktioner.

Restangular

Med Angular kan du ha svårt att arbeta $ resurs och $ http för att skapa resten API. Restangulär kan hjälpa till att göra användningen av att få, radera, uppdatera och skicka dataförfrågningar lättare. Vissa funktioner som sätter Restangulär bortsett från $ resurs är HTTP-metodstöd, självlänkande element, löften och många fler. Ta reda på mer här och kolla live demo på Plunkr.

Angular Gettext

Angular-Gettext är en utmärkt vinkelmodul för super lätt lokalisering. Viktiga funktioner är att du kan översätta din webbapp så enkelt som att lägga till attribut. Det låter dig fokusera på din apputveckling och lämna alla översättningar till Angular-Gettext.

Verktyg & Apps

Slutligen kommer vi bara att lämna detta här. Det är en lista över fler verktyg och appar som kan göra din vinkelutvecklingsprocess enklare och mjukare. De fungerar bra med dem som bara börjar hämta Vinkel.

Generator Vinkel

Yeoman har en kodgenerator som heter Generator Angular. Med det här verktyget kan du påskynda din vinkelutveckling med bara par av terminalkommando. Det kan automatiskt generera utvecklingsserver, enhet och ramtest, visning, direktiv och mer.

ngDocs - AngularJS Reference

ngDocs är en Android-app som ger AngularJS dokumentation och referenser, trevligt och enkelt. Vissa grundläggande handledning finns också om du är ny på Angular. Det finns ytterligare funktioner som en utvecklarguide och en felreferens som du kanske vill se. Med detta på din Android-enhet hämtar du på Angular vart du än går.