AngularJS è un framework JavaScript relativamente nuovo di Google, progettato per rendere il tuo sviluppo front-end il più semplice possibile. Ci sono molti framework e plugin disponibili. Come tale, a volte può essere difficile setacciare tutto il rumore per trovare strumenti utili.

Ecco tre motivi per cui potresti scegliere AngularJS per il tuo prossimo progetto.

1 - È stato sviluppato da Google

Angular è costruito e gestito da ingegneri di Google dedicati.

Questo può sembrare ovvio, ma è importante ricordare che molte (non tutte) strutture sono fatte da hobbisti nella comunità open source. Mentre passione e guida hanno strutture forgiate, come Cappucino e Knockout, Angular è costruito e gestito da ingegneri dedicati (e di grande talento) di Google. Ciò significa che non solo hai una grande comunità aperta da cui imparare, ma hai anche ingegneri qualificati e altamente disponibili che hanno il compito di aiutarti a rispondere alle tue domande Angular.

Questo non è il primo tentativo di Google in un framework JavaScript; hanno dapprima sviluppato il loro completo Web Toolkit, che compila Java fino a JavaScript, ed è stato ampiamente utilizzato dal team di Google Wave. Con l'avvento di HTML5, CSS3 e JavaScript, sia come linguaggio front-end che back-end, Google si è reso conto che il Web non era pensato per essere scritto esclusivamente in Java.

AngularJS è nato per standardizzare la struttura delle applicazioni web e fornire un modello futuro per lo sviluppo delle app lato client.

La versione 1.0 è stata rilasciata poco meno di 6 mesi fa (a partire da dicembre 2012) ed è utilizzata da una miriade di applicazioni, che vanno dall'hobby ai prodotti commerciali. L'adozione di AngularJS come framework valido per lo sviluppo lato client sta rapidamente diventando nota all'intera comunità di sviluppo web.

Poiché AngularJS è stato creato da Google, puoi essere certo di avere a che fare con un codice efficiente e affidabile che si adatta al tuo progetto. Se stai cercando una struttura con una base solida, Angular è la tua scelta!

2 - È completo

Se hai familiarità con progetti, come QUnit, Mocha o Jasmine, non avrai problemi ad imparare l'API di test delle unità di Angular.

Angolare, simile a Backbone o JavaScriptMVC, è una soluzione completa per lo sviluppo rapido front-end. Nessun altro plug-in o framework è necessario per creare un'applicazione web basata sui dati. Ecco una panoramica delle funzionalità di spicco di Angular:

• Resto facile. Le azioni RESTful stanno rapidamente diventando lo standard per la comunicazione dal server al client. In una riga di JavaScript, puoi parlare rapidamente al server e ottenere i dati necessari per interagire con le tue pagine web. AngularJS trasforma questo in un semplice oggetto JavaScript, come Modelli, seguendo il modello MVVM (Model View View-Model).
• MVVM to the Rescue! I modelli parlano agli oggetti ViewModel (tramite qualcosa chiamato oggetto $ scope), che ascolta le modifiche ai Modelli. Questi possono quindi essere consegnati e resi dalle Views, che è l'HTML che esprime il tuo codice. Le viste possono essere instradate usando l'oggetto $ routeProvider, in modo da poter collegare e organizzare le viste e i controllori, trasformandoli in URL navigabili. AngularJS fornisce anche controller stateless, che inizializzano e controllano il $ portata oggetto.
• Iniezione dei dati e delle dipendenze. Tutto nel pattern MVVM viene comunicato automaticamente nell'interfaccia utente ogni volta che qualcosa cambia. Ciò elimina la necessità di wrapper, getter / setter o dichiarazioni di classe. AngularJS gestisce tutto questo, quindi puoi esprimere i tuoi dati semplicemente come con primitive JavaScript, come array, o complessi come desideri, attraverso tipi personalizzati. Poiché tutto avviene automaticamente, puoi chiedere le tue dipendenze come parametri nelle funzioni di servizio di AngularJS, piuttosto che in un gigante principale() chiama per eseguire il tuo codice.
• Estende HTML. La maggior parte dei siti web costruiti oggi sono una serie gigantesca di
  tag con poca chiarezza semantica. È necessario creare classi CSS estensive ed esaurienti per esprimere l'intenzione di ciascun oggetto nel DOM. Con Angular, puoi utilizzare il tuo HTML come XML, offrendoti infinite possibilità per tag e attributi. Angular realizza questo, tramite il suo compilatore HTML e l'uso di direttive per innescare comportamenti basati sulla sintassi appena creata che scrivi.
• Rende HTML il tuo modello. Se sei abituato a Moustache o Hogan.js, puoi cogliere la sintassi della parentesi quadra del motore di template di Angular, perché è solo HTML. Angolare attraversa il DOM per questi modelli, che contengono le direttive sopra menzionate. I modelli vengono quindi passati al compilatore AngularJS come elementi DOM, che possono essere estesi, eseguiti o riutilizzati. Questa è la chiave, perché, ora, hai componenti DOM grezzi, piuttosto che stringhe, consentendo la manipolazione diretta e l'estensione dell'albero DOM.
• Test a livello aziendale. Come detto sopra, AngularJS non richiede framework o plug-in aggiuntivi, inclusi test. Se hai dimestichezza con progetti come QUnit, Mocha o Jasmine, non avrai problemi ad imparare l'API di testing unitario di Angular e lo Scenario Runner, che ti guida nell'esecuzione dei test più vicino allo stato attuale della tua applicazione di produzione il più possibile.

Questi sono i principi fondamentali che guidano AngularJS alla creazione di un codebase front-end efficiente, basato sulle prestazioni e manutenibile. Finché hai una fonte per la memorizzazione dei dati, AngularJS può fare tutto il lavoro pesante sul client, fornendo al contempo un'esperienza ricca e veloce per l'utente finale.

3 - Inizia in pochi minuti

Iniziare con AngularJS è incredibilmente facile. Con alcuni attributi aggiunti al tuo codice HTML, puoi avere una semplice app Angolare in meno di 5 minuti!

1. Aggiungi il ng-app direttiva al tag in modo che Angular sappia eseguire sulla pagina:

2. Aggiungi l'angolare
3. Aggiungi normale HTML. Le direttive AngularJS sono accessibili tramite attributi HTML, mentre le espressioni vengono valutate con notazione a parentesi quadra:

    
   Le attività di oggi
    
    
     Activity.name 
    
     

function ActivitiesListCtrl ($ scope) $ scope.activities = ["name": "Wake up", "name": "Brush teeth", "name": "Shower", "name": "Fai colazione", "nome": "Vai a lavorare", "nome": "Scrivi un articolo di Nettuts", "nome": "Vai in palestra", "nome": " Incontra gli amici ", " nome ":" Vai a letto "]; 

function ActivitiesListCtrl ($ scope) $ http.get ('activities / list.json'). success (function (data) $ scope.activities = data;

Ordinare:
  In ordine alfabetico 

 
Infine, modifichiamo il 
 tag da riconoscere sortModel come un modo per ordinare la nostra lista:
 
 
 
Tutto il sollevamento pesante è fatto in modo intelligente da AngularJS.
 
 
E questo è tutto! Il segreto è il filtro che abbiamo aggiunto al ng-repeat direttiva nella voce di elenco. Il ordinato da filtro prende una matrice di input (il nostro elenco di attività), la copia e riordina quella copia dalla proprietà descritta nel selezionare etichetta. Non è una coincidenza che l'attributo value di opzione il tag è nome, lo stesso valore fornito dal nostro file JSON come proprietà di un attività. Questo è ciò che permette ad AngularJS di trasformare automaticamente il nostro valore di opzione HTML in una potente parola chiave per l'ordinamento del nostro modello di attività.
 
Nota come non stiamo ascoltando gli eventi di interazione dell'utente. Il nostro codice non è pieno di callback e gestori di eventi per gestire gli oggetti su cui abbiamo fatto clic, selezionati, toccati o abilitati. Tutto il pesante sollevamento è fatto in modo intelligente da AngularJS per trovare la funzione del controller, creare la dipendenza tra il modello e il controller e recuperare i dati per renderlo sullo schermo.
 
AngularJS offre un tutorial completo e robusto, che crea un'applicazione web molto simile e la espande ancora di più - tutto in pochi minuti!
 
 
Conclusione
 
AngularJS sta rapidamente diventando il framework JavaScript dominante per lo sviluppo web professionale. Puoi trovare moltissimi script e app AngularJS su Envato Market per aiutarti a ottenere di più con Angular JS, come strumenti di ritaglio, modelli di negozi online, app di valutazione e altro.
Script e app AngularJS su Envato Market
In questo tutorial:
 
 
Abbiamo esaminato come Google è venuta a sviluppare questo framework per sfruttare al meglio l'HTML. 
 
Abbiamo esaminato le funzionalità e le funzionalità di base che rendono Angular un piacere con cui lavorare. 
 
Infine, abbiamo sviluppato una demo dinamica e completamente funzionale in pochi minuti per dimostrare il vero potere di quanto sia facile passare dal nulla, a un'applicazione completa. 
 
 
Se stai cercando un framework robusto e ben mantenuto per progetti di qualsiasi dimensione, ti consiglio vivamente di dare un'occhiata ad AngularJS. Può essere scaricato gratuitamente su AngularJS.org, che contiene anche una grande quantità di informazioni, tra cui la documentazione completa dell'API, oltre a numerosi esempi e tutorial che coprono ogni aspetto dello sviluppo web front-end. In bocca al lupo!



		
			
	   
	




Codice


		











	

        
		
3 motivi per cui scrivere è un'abilità di progettazione UX
			
			
	
			
        				
	
		
	

        
		
3 principi per una forte esperienza utente attraverso la navigazione
			
			

					
        
	






	

	

			

							×