sviluppare applicazioni con angularjs e bootstrap - indiceviii sviluppare applicazioni web con...

5
Indice generale Introduzione ........................................................................................ xi Gli argomenti del libro.................................................................. xi Che cosa occorre per il libro ........................................................ xii A chi si rivolge il libro ................................................................. xii Convenzioni ................................................................................ xii Scarica i file degli esempi ............................................................ xiii L’autore ................................................................................................ xv I revisori ............................................................................................. xvii Capitolo 1 Hello, {{name}} ................................................................ 1 Impostazione ................................................................................. 1 Installazione di AngularJS e Bootstrap............................................. 2 Installazione di Bootstrap .......................................................... 2 Installazione di AngularJS .......................................................... 3 Utilizzare AngularJS .................................................................. 3 Bootstrap .................................................................................. 6 Quiz .............................................................................................11 Riepilogo .....................................................................................11 Capitolo 2 Sviluppare con AngularJS e Bootstrap....................... 13 Impostazione ................................................................................13 Scaffolding ....................................................................................14 Barra di navigazione ................................................................14 Utilizzare le direttive................................................................20 ng-click e ng-mouseover .........................................................21 ng-if ........................................................................................24 Quiz .............................................................................................27 Riepilogo .....................................................................................27

Upload: others

Post on 13-Aug-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: sviluppare applicazioni con AngularJS e Bootstrap - Indiceviii Sviluppare applicazioni web con AngularJS e Bootstrap Riorganizzare il progetto.....116 Quiz..... 118 Riepilogo

Indice generale

Introduzione ........................................................................................xiGli argomenti del libro .................................................................. xiChe cosa occorre per il libro ........................................................ xiiA chi si rivolge il libro ................................................................. xiiConvenzioni ................................................................................ xiiScarica i file degli esempi ............................................................ xiii

L’autore ................................................................................................xv

I revisori .............................................................................................xvii

Capitolo 1 Hello, {{name}} ................................................................1Impostazione ................................................................................. 1Installazione di AngularJS e Bootstrap............................................. 2

Installazione di Bootstrap .......................................................... 2Installazione di AngularJS .......................................................... 3Utilizzare AngularJS .................................................................. 3Bootstrap .................................................................................. 6

Quiz .............................................................................................11Riepilogo .....................................................................................11

Capitolo 2 Sviluppare con AngularJS e Bootstrap.......................13Impostazione ................................................................................13Scaffolding ....................................................................................14

Barra di navigazione ................................................................14Utilizzare le direttive ................................................................20ng-click e ng-mouseover .........................................................21ng-if ........................................................................................24

Quiz .............................................................................................27Riepilogo .....................................................................................27

Page 2: sviluppare applicazioni con AngularJS e Bootstrap - Indiceviii Sviluppare applicazioni web con AngularJS e Bootstrap Riorganizzare il progetto.....116 Quiz..... 118 Riepilogo

vi Sviluppare applicazioni web con AngularJS e Bootstrap

Capitolo 3 I filtri ..............................................................................29Applicare un filtro dalla vista .........................................................29

Currency e number .................................................................30Lowercase e uppercase .............................................................30limitTo ....................................................................................31Date ........................................................................................31Filter .......................................................................................33orderBy ...................................................................................34JSON ......................................................................................34

Applicare i filtri da JavaScript ........................................................35Sviluppare un filtro .......................................................................36

Moduli ....................................................................................37Creare un filtro ........................................................................38

Quiz .............................................................................................39Riepilogo .....................................................................................39

Capitolo 4 Routing .........................................................................41Installare ngRoute ........................................................................41Creare route di base ......................................................................42Route con parametri ....................................................................45Route di fallback ..........................................................................45Routing in HTML5 o eliminazione del simbolo # .......................46

Abilitare HTML5Mode ...........................................................46Collegare le route .........................................................................47Quiz .............................................................................................47Riepilogo .....................................................................................47

Capitolo 5 Le viste ..........................................................................49Popolare la vista Index ..................................................................49Popolare la vista Add Contact ........................................................52

Form orizzontali .....................................................................54Popolare la vista View Contact .....................................................56

Titolo e gravatar ......................................................................56La classe form-horizontal ........................................................56

Quiz .............................................................................................58Riepilogo .....................................................................................59

Capitolo 6 CRUD .............................................................................61Read ............................................................................................61

Condividere i dati tra le viste ..................................................62Creare una direttiva personalizzata ...........................................68Rispettare i fine riga ................................................................73Impostare la ricerca e aggiungere la pageClass active ...............74

Create ...........................................................................................75

Page 3: sviluppare applicazioni con AngularJS e Bootstrap - Indiceviii Sviluppare applicazioni web con AngularJS e Bootstrap Riorganizzare il progetto.....116 Quiz..... 118 Riepilogo

vii

Update .........................................................................................76Scope ......................................................................................77Controller ...............................................................................78Assemblare il tutto ...................................................................79

Delete ...........................................................................................81Quiz .............................................................................................82Riepilogo .....................................................................................82

Capitolo 7 AngularStrap ................................................................83Installare AngularStrap ...................................................................83Utilizzare AngularStrap .................................................................84

La finestra modale ....................................................................85Tooltip ....................................................................................86Popover ...................................................................................87Alert ........................................................................................88

Utilizzare i servizi di AngularStrap .................................................89Integrare AngularStrap ..................................................................90Quiz .............................................................................................92Riepilogo .....................................................................................92

Capitolo 8 Connessione al server ..................................................93Connettersi con $http ...................................................................93

Inviare i dati ............................................................................95Connettersi con ngResource .........................................................96

Includere ngResource ..............................................................96Configurare ngResource ..........................................................96Richiedere al server .................................................................98Inviare al server ........................................................................98Cancellare i contatti ...............................................................100Gestione degli errori ..............................................................101

Sistemi alternativi di connessione ................................................101RestAngular ..........................................................................101Firebase .................................................................................102

Quiz ...........................................................................................104Riepilogo ...................................................................................104

Capitolo 9 I task runner ...............................................................105Installare Node e NPM ...............................................................105Utilizzare Grunt..........................................................................107

Installare l’interfaccia a riga di comando .................................107Installare Grunt ......................................................................107

Utilizzare gulp ............................................................................113Installare gulp globalmente .....................................................113Installare le dipendenze di gulp ..............................................113Impostare gulpfile ..................................................................114

Page 4: sviluppare applicazioni con AngularJS e Bootstrap - Indiceviii Sviluppare applicazioni web con AngularJS e Bootstrap Riorganizzare il progetto.....116 Quiz..... 118 Riepilogo

viii Sviluppare applicazioni web con AngularJS e Bootstrap

Riorganizzare il progetto.............................................................116Quiz ...........................................................................................118Riepilogo ...................................................................................119

Capitolo 10 Personalizzare Bootstrap ..........................................121Compilare Less con Grunt o gulp ...............................................121

Scaricare il sorgente ...............................................................122Compilare con Grunt ............................................................122Compilare con gulp ...............................................................125

Less ............................................................................................128Importazione di file ...............................................................128Variabili .................................................................................128Regole annidate ....................................................................129Mixin ....................................................................................130

Personalizzare gli stili di Bootstrap ...............................................130Caratteri tipografici ...............................................................130navbar ...................................................................................131Form .....................................................................................132Pulsanti .................................................................................133

I temi di Bootstrap ......................................................................134Dove trovare altri temi di Bootstrap ............................................134Quiz ...........................................................................................134Riepilogo ...................................................................................134

Capitolo 11 Validazione .................................................................137Validazione dei form ...................................................................137

Validazione dei pattern...........................................................142Utilizzare minlength, maxlength, min e max ..........................143Creare un validator personalizzato ..........................................143

Quiz ...........................................................................................145Riepilogo ...................................................................................146

Capitolo 12 Strumenti della community ......................................147Batarang .....................................................................................147

Installare Batarang ..................................................................148Verificare lo scope e le proprietà .................................................148

Monitorare la performance ....................................................150Visualizzare le dipendenze .....................................................151Opzioni di Batarang ..............................................................152

ng-annotate ................................................................................153Installare ng-annotate .............................................................153Utilizzare ng-annotate con Grunt ..........................................154Utilizzare ng-annotate con gulp .............................................161

Quiz ...........................................................................................162Riepilogo ...................................................................................163

Page 5: sviluppare applicazioni con AngularJS e Bootstrap - Indiceviii Sviluppare applicazioni web con AngularJS e Bootstrap Riorganizzare il progetto.....116 Quiz..... 118 Riepilogo

ix

Appendice A Persone e progetti .....................................................165Progetti e persone dietro Bootstrap ............................................165

Il team principale ...................................................................165Bootstrap Expo ......................................................................166BootSnipp .............................................................................166Linee guida sul codice di @mdo ............................................166Roots ....................................................................................167Shoelace ................................................................................167Snippet di Bootstrap 3 per Sublime Text.................................167Font Awesome .......................................................................168Bootstrap Icons ......................................................................168

Progetti e persone dietro AngularJS ............................................168Il team principale ...................................................................168RestAngular ..........................................................................169AngularStrap e AngularMotion ..............................................169AngularUI .............................................................................169Mobile AngularUI .................................................................170Ionic .....................................................................................170AngularGM ...........................................................................170

Ora tocca a voi… .......................................................................171

Appendice B In caso di dubbio ........................................................173La documentazione ufficiale ........................................................173L’issue tracker di GitHub ............................................................173Stack Overflow ...........................................................................174Il gruppo Google AngularJS ........................................................174Egghead.io ..................................................................................174Twitter .......................................................................................174

Appendice C Risposte ai quiz ..........................................................177Capitolo 1 ..................................................................................177Capitolo 2 ..................................................................................177Capitolo 3 ..................................................................................177Capitolo 4 ..................................................................................178Capitolo 5 ..................................................................................178Capitolo 6 ..................................................................................178Capitolo 7 ..................................................................................179Capitolo 8 ..................................................................................179Capitolo 9 ..................................................................................179Capitolo 10 ................................................................................179Capitolo 11 ................................................................................180Capitolo 12 ................................................................................180

Indice analitico..................................................................................181