15 strumenti AngularJS utili per gli sviluppatori

Stai pensando di immergere le dita dei piedi in Angolare? Se hai seguito i nostri 10 migliori tutorial per imparare il post di AngularJS e ti piacerebbe giocare con Angular da solo, sei nel posto giusto. Abbiamo qui alcuni strumenti in grado di semplificare il flusso di lavoro di sviluppo.

Stiamo guardando il 15 di i migliori IDE, editor di testo, strumenti per test e debugging, moduli e strumenti di sviluppo e app per costruire con Angular. Se hai i tuoi strumenti o app preferiti, condividili con noi nei commenti qui sotto.

IDE ed editor di testo

Nel mondo della programmazione ci sono due tipi di editor: completo Ambiente di sviluppo integrato (IDE) e editor di testo leggero. Entrambi consentono un flusso di lavoro di sviluppo più rapido. L'editor di testo e IDE che abbiamo elencato di seguito sono strumenti abbastanza buoni per accelerare lo sviluppo di Angular. Possono essere facilmente configurati per l'ambiente angolare.

WebStorm

WebStorm è adatto non solo per Javascript ma anche HTML e CSS. Ha un fantastico editor live che ti consente di vedere i risultati della codifica sul browser senza bisogno di frequenti aggiornamenti. Per impostazione predefinita, la loro versione più recente contiene il pacchetto di plugin AngularJS sebbene sia necessario includere prima lo script Angolare nel progetto. Per maggiori dettagli, leggi il post del blog WebStorm.

Aptana

Aptana è un IDE open source gratuito che è in realtà la versione personalizzata di Eclipse che si concentra su Javascript, HTML, CSS e altri gadget web. Per estendere Aptana per il supporto angolare, tutto ciò che devi fare è installare l'estensione AngularJS Eclipse dal Mercato Eclipse.

Testo sublime

Uno dei più popolari editor di testo disponibili, Sublime Text è amato da molti per la sua capacità di adattamento a qualsiasi tipo di ambiente di programmazione. È anche veloce e ha un supporto di snippet di codice personalizzabile, e ha molti pacchetti incluso il pacchetto AngularJS che ti permette di lavorare con Angular. Ecco un ottimo post di Dan Wahlin, puoi dare un'occhiata a questo.

Altro su Sublime Text:

• 18 plug-in essenziali per il testo sublime
• 12 suggerimenti e trucchi più ricercati del testo sublime
• Come inserire il percorso del file nel testo sublime
• Anteprima rapida Progetto Localhost con testo sublime
• Gestisci le note e le liste con il testo sublime
• Aggiunta del prefisso del fornitore CSS con testo sublime

Strumenti di test e debug

Test e debug sono parti importanti del processo di sviluppo soprattutto in un ambiente come Angular. Ecco alcuni degli strumenti che possono aiutarti a testare ed eseguire il debug dell'applicazione.

Karma

Karma è un ottimo runner di prova realizzato per Angular, ma può anche essere utilizzato con qualsiasi altro framework Javascript. Supporta qualsiasi tipo di test: test unitari, test intermedi e Test E2E. Karma funziona aprendo i browser elencati nel file di configurazione. Quindi comunica con il browser attivo utilizzando socket.io e ti chiede se eseguire il test o meno.

Gelsomino

Jasmine viene utilizzato per lo sviluppo comportamentale (BDD), ma è possibile utilizzarlo per lo sviluppo basato sui test (TDD) con un po 'di personalizzazione. Di solito è accoppiato con Karma: Karma come corridore test, Jasmine come framework di test. Jasmine ispezionerà automaticamente tutte le classi e le funzioni Javascript e ti informerà del codice non gestito. Lo svantaggio è non sa quale ambiente (browser) ha eseguito il test, ma il Karma compensa questo svantaggio.

MochaJS

Se confrontato con Jasmine, MochaJS è più flessibile ma Jasmine viene fornito come un pacchetto all-in-one. Con MochaJS, se vuoi usare spy framework, devi configurare Mocha con la sua libreria appropriata come sinon.js. E se hai bisogno di un assertion framework, Mocha deve essere configurato con un framework come Chai.

Goniometro

Il goniometro è probabilmente il più potente automatizzato da un capo all'altro (e2e) Strumento di prova angolare. Sviluppato dal team di Angular, Goniometro è costruito combinando alcune grandi tecnologie disponibili oggi come NodeJS, Selenium, webDriver, Mocha, Cetriolo e Gelsomino.

Angular Batarang

inoltre Goniometro, un altro grande strumento sviluppato dal team di Angular è Angular Batarang. Batarang è un'estensione di Chrome per il debug di applicazioni angolari. Dopo aver ispezionato la tua app, Batarang ti mostrerà il modello, prestazioni e dipendenza risultati di debug in tre diverse schede. Puoi anche controllare l'ispezione, decidendo se mostrare il applicazioni, associazioni o ambiti.

ng-inspector

ng-inspector è un'estensione del browser supportata su Chrome e Safari. A differenza di Batarang che si presenta in DevTools, ng-inspector preferisce il display del pannello laterale. È possibile esaminare ed evidenziare gli elementi DOM mentre si posiziona il mouse su un obiettivo. Puoi anche vedere l'ambito e il modello aggiornati in tempo reale.

moduli

Il posto migliore per trovare i moduli angolari è ngmodules.org. Ma se hai bisogno di una rapida panoramica, di seguito è riportato un elenco di alcune buone risorse che abbiamo raccolto per te.

AngularUI

AngularUI è una raccolta di componenti dell'interfaccia utente creati con AngularJS. Le sue direttive di utilità ti aiutano a costruire applicazioni Angular più velocemente. Invece di widget, AngularUI utilizza le direttive raw come ui-router, ui-map, ui-calendar ecc. Le direttive che probabilmente ti piaceranno di più sono le UI-Bootstrap che possono essere native creare Twitter Bootstrap in Angular. Controlla la sua pagina di documentazione pulita e piacevole per iniziare.

ng-Table - Tabella di ordinamento e filtraggio

Se hai bisogno di tabelle nella tua applicazione web, il tipo che può essere ordinato e filtrato, allora ngTable è lo strumento che stai cercando. Supporta anche altezze variabili delle file e grandi capacità di impaginazione.

Restangular

Con Angular, potresti avere difficoltà a lavorare lavorando $ risorsa e $ http per creare l'API Rest. Restangular può aiutare a fare l'utilizzo di get, delete, update e post richieste di dati più facili. Alcune funzioni che separano Restangular $ risorsa sono il supporto del metodo HTTP, l'elemento di auto-collegamento, promette l'utilizzo e molti altri. Scopri di più qui e dai un'occhiata alla demo live su Plunkr.

Gettext angolare

Angular-Gettext è un superbo modulo angolare per una localizzazione semplicissima. Le caratteristiche principali sono la possibilità di tradurre la tua app Web con la stessa facilità con cui si aggiunge attributo. Ti consente di concentrarti sullo sviluppo della tua app e di lasciare tutte le traduzioni su Angular-Gettext.

Strumenti e app

Infine, lasceremo questo qui. È una lista di più strumenti e app che possono rendere il tuo processo di sviluppo Angular più facile e agevole. Funzionano bene con coloro che stanno appena iniziando a prendere Angular.

Generatore angolare

Yeoman ha un generatore di codice chiamato Generator Angular. Con questo strumento, puoi accelerare lo sviluppo angolare con solo coppie di comandi da terminale. Può generare automaticamente server di sviluppo, test di unità e framework, viste, direttive e altro.

ngDocs - Riferimento AngularJS

ngDocs è un'app per Android che fornisce documentazione e riferimenti AngularJS, semplice e intuitiva. Alcuni tutorial di base sono disponibili anche se sei nuovo in Angular. Ci sono funzioni aggiuntive come una guida per sviluppatori e un riferimento agli errori che potresti voler vedere. Con questo sul tuo dispositivo Android, riprendi Angular ovunque tu vada.