Kotisivu » Toolkit » 15 Hyödyllisiä AngularJS-työkaluja kehittäjille

    15 Hyödyllisiä AngularJS-työkaluja kehittäjille

    Ajatellaanko varpaiden kastamista kulmikkaaseen? Jos olet käynyt läpi 10 parasta opetusohjelmaa oppiaksemme AngularJS-viestiä ja haluaisit pelata itseäänsi kulmalla, olet oikeassa paikassa. Meillä on täällä joitakin työkalut, jotka voivat virtaviivaistaa kehitystyötäsi.

    Katsomme 15: tä parhaat IDE: t, tekstieditorit, työkalut testaukseen ja virheenkorjaukseen, moduulit ja kehitystyökalut ja sovellukset rakentamiseen kulmikas. Jos sinulla on suosikkityökalut tai sovellukset, jaa ne kanssamme alla olevissa kommenteissa.

    IDE & Text Editor

    Ohjelmointimaailmassa on kahdenlaisia ​​toimittajia: integroitu kehitysympäristö (IDE) ja kevyt tekstieditorit. Molemmat mahdollistavat nopeamman kehitystyön. Alla luetellut IDE- ja tekstieditorit ovat melko hyviä työkaluja kulmakehityksen nopeuttamiseen. Ne voidaan konfiguroida helposti kulmaympäristöön.

    WebStorm

    WebStorm sopii paitsi Javascriptille myös HTML: lle ja CSS: lle. Siinä on mahtava live-editori, jonka avulla voit nähdä selaimesi koodaustulokset ilman, että tarvitaan usein virkistävää. Oletuksena niiden uusin versio kuljettaa AngularJS-laajennuskokonaisuutta, vaikka sinun on ensin sisällytettävä projektin kulma-komentosarja. Lisätietoja on WebStorm-blogipostissa.

    Aptana

    Aptana on ilmainen avoimen lähdekoodin IDE, joka on itse asiassa mukautettu Eclipse-versio, joka keskittyy Javascriptiin, HTML: ään, CSS: ään ja muihin web-herkkuihin. Aptanan laajentamiseksi kulma-tuelle, sinun tarvitsee vain asentaa AngularJS Eclipse -laajennus Eclipse Marketplace.

    Sublime Text

    Yksi suosituimmista tekstieditoreista, Sublime Text on monien mielestä mukautettu mukautumaan mihin tahansa ohjelmointiympäristöön. Se on myös nopea ja siinä on muokattavissa oleva koodinpätkä, ja siinä on monia paketteja, jotka sisältävät AngularJS-paketin, jonka avulla voit työskennellä Angularin kanssa. Tässä on loistava viesti Dan Wahlinilta, jonka voit tarkistaa tästä.

    Lisää Sublime-tekstistä:

    • 18 välttämätöntä Sublime Text -sovellusta
    • 12 eniten halutun tekstin vinkkejä ja temppuja
    • Tiedoston polun lisääminen Sublime-tekstiin
    • Pikakatselu Localhost-projekti Sublime-tekstillä
    • Hallitse muistiinpanoja ja luetteloita Sublime-tekstillä
    • CSS-toimittajan etuliitteen lisääminen Sublime-tekstillä

    Työkalujen testaus ja virheenkorjaus

    Testaus ja virheenkorjaus ovat tärkeitä osia kehitysprosessista erityisesti ympäristössä, jossa on kulma. Seuraavassa on joitakin työkaluja, joiden avulla voit testata ja korjata sovelluksesi.

    karma

    Karma on suuri kulmajuoksu, joka on tehty kulmikas, mutta jota voidaan käyttää myös minkä tahansa muun Javascript-kehyksen kanssa. Se tukee kaikenlaista testausta: yksikkötestaus, keskitestaus ja E2E-testaus. Karma toimii avaamalla selaimet, jotka luet asetustiedostossa. Sitten se viestii aktiivisen selaimen kanssa käyttäen socket.io: ta ja kysyy, suoritetaanko testi vai ei.

    Jasmiini

    Jasmiinia käytetään käyttäytymiseen perustuvaan kehitykseen (BDD), mutta voit käyttää sitä testikäyttöiseen kehitykseen (TDD), jossa on vähän räätälöintiä. Se on yleensä yhdistetty Karmaan: Karma kuin testirata, Jasmine testikehyksenä. Jasmine tarkastaa automaattisesti kaikki Javascript-luokat ja toiminnot ja ilmoittaa käsittelemättömästä koodista. Haittapuolena on se ei tiedä, mitä ympäristöä (selaimia) testi on suorittanut, mutta Karma korvaa tämän haitan.

    MochaJS

    Verrattuna Jasmineen, MochaJS on joustavampi mutta Jasmine tulee monipuolisena pakettina. MochaJS: n avulla, jos haluat käyttää vakoojakehystä, sinun on määritettävä Mocha ja sen sopiva kirjasto kuten sinon.js. Ja jos tarvitset väitteitä, Mocha on määritettävä Chai-kaltaisella kehyksellä.

    Astelevy

    Protractor on luultavasti tehokkain automatisoitu päittäin (e2e) Kulmatestaustyökalu. Kulma-tiimin kehittämä Protractor on rakennettu yhdistämällä joitakin suuria nykypäivän tekniikoita SolmuJS, seleeni, web-ajuri, mokka, kurkku ja Jasmiini.

    Kulmainen Batarang

    sitä paitsi Astelevy, toinen suuri työkalu, jonka Angular-tiimi on kehittänyt, on Angular Batarang. Batarang on Chrome-laajennus, jonka avulla voidaan korjata kulma-sovelluksia. Kun olet tarkistanut sovelluksesi, Batarang näyttää sinulle malli, suorituskyky ja riippuvuus virheenkorjaustulokset kolmessa eri välilehdessä. Voit myös valvoa tarkastusta, päättää, näytetäänkö sovellukset, sidokset tai laajuudet.

    ng-tarkastaja

    ng-tarkastaja on selainlaajennus, jota tukee Chrome ja Safari. Toisin kuin Batarang, joka näkyy DevToolsissa, ng-inspektori mieluummin käyttää sivupaneelin näyttöä. Voit tarkastaa ja korostaa DOM-elementtejä, kun siirrät sen päälle. Näet myös laajuuden ja mallin päivittämisen reaaliajassa.

    moduulit

    Paras paikka löytää kulmamoduulit on ngmodules.org. Mutta jos tarvitset nopeaa yleiskatsausta, alla on luettelo hyvistä resursseista, jotka olemme keränneet sinulle.

    AngularUI

    AngularUI on kokoelma UI-komponentteja, jotka on rakennettu AngularJS: llä. Sen käyttöohjeiden avulla voit rakentaa kulma-sovelluksia nopeammin. Widgettien sijaan AngularUI käyttää raaka-aineita Ui-reititin, Ui-kartta, Ui-kalenteri jne. Direktiivit, jotka todennäköisesti pidät eniten, on sen UI-Bootstrap, joka voi luonnollisesti luo Twitter Bootstrap in Angular. Tutustu sen puhtaan ja mukavan dokumentointisivun alkuun.

    ng-Taulukko - Lajittelu- ja suodatustaulukko

    Jos tarvitset taulukoita Web-sovelluksessa, sellaista, jota voidaan lajitella ja suodattaa, sitten ngTable on työkalu, jota etsit. Se tukee myös muuttuvia rivikorkeuksia ja suurta sivutusmahdollisuutta.

    Restangular

    Kulma-asennossa voi olla vaikeaa työskennellä $ resurssi ja $ http Rest API: n luomiseen. Restangular voi auttaa tietojen pyytämisen, poistamisen, päivittämisen ja lähettämisen helpottaminen. Joitakin ominaisuuksia, jotka asettavat Restangularin erillään $ resurssi ovat HTTP-menetelmän tuki, itseliitoselementti, lupaukset ja paljon muuta. Lue lisää täältä ja katso live-esittely Plunkrista.

    Kulmainen Gettext

    Angular-Gettext on erinomainen kulmamoduuli, joka on erittäin helppo sijoittaa paikalleen. Tärkeimmät ominaisuudet ovat, että voit kääntää verkkosovelluksesi yhtä helppoa kuin lisätä ominaisuus. Sen avulla voit keskittyä sovelluskehitykseen ja jättää kaikki käännökset Angular-Gettextiin.

    Työkalut ja sovellukset

    Lopuksi jätämme tämän täällä. Se on luettelo useammista työkaluista ja sovelluksista, jotka saattavat helpottaa ja sujuvoittaa kulmakehitysprosessia. He työskentelevät hyvin niiden kanssa, jotka ovat juuri alkaneet poimia kulmasta.

    Generaattorin kulma

    Yeomanilla on koodigeneraattori Generator Angular. Tämän työkalun avulla voit nopeuttaa kulma-kehitystä vain terminaalikomennoilla. Se voi automaattisesti luoda kehityspalvelimen, yksikön ja kehyksen testauksen, näkymät, direktiivit ja paljon muuta.

    ngDocs - AngularJS-viite

    ngDocs on Android-sovellus, joka tarjoaa AngularJS-dokumentaatiota ja viittauksia, mukavia ja yksinkertaisia. Käytettävissä on myös joitakin perusopetuksia, jos olet uusi Angular. On muitakin ominaisuuksia, kuten kehittäjän opas ja virheviite, joita haluat ehkä nähdä. Ota tämä Android-laitteellasi kulmikkaaksi missä tahansa.