Sviluppare applicazioni web in AngularJS

Responsive Design Web App con HTML5 e CSS3
18 aprile 2017
Sviluppo componenti in React, ES2015 e Webpack
18 aprile 2017
Frontend Development

Sviluppare applicazioni web in AngularJS

Google AngularJS, uno dei framework Javascript più interessanti del momento, è utilizzato per lo sviluppo di applicazioni HTML5 modulari, solide e scalabili.
Il framework include moltissimi strumenti per velocizzare e semplificare lo sviluppo di applicazioni AJAX, tra cui un approccio MVW, dependency injection, gestione moduli, filtri, formatters, view e routing, validazioni form e moltissimi componenti (direttive) e servizi pronti all’uso. Configuratori prodotti, CMS e CRM, siti web, tool di collaborazione, software di domotica e IoT, frontend per arduino, applicazioni realtime multiutente, kiosk touch, prototyping, applicazioni per TV, Chromecast e Facebook sono solo alcuni esempi di progetti realizzabili in AngularJS.

Prerequisiti

Il partecipante dovrà possedere una certa familiarità con l’uso di HTML, Javascript (variabili, manipolazione array e oggetti, cicli) e preferibilmente aver già utilizzato in precedenza jQuery.

 

Obiettivi formativi

Durante il corso si analizzeranno le principali funzionalità offerte dal framework, dai concetti base alla creazione di direttive custom, allo scopo di fornire le nozioni fondamentali per la creazione di applicazioni web dinamiche. Il corso include diverse sessioni di teoria accompagnate da decine di esempi pratici.

 

Programma

Introduzione al framework

  • Panoramica sul framework
  • AngularJS jQuery vs AngularJS
  • Configurazione e Boilerplate

Controllers e two-way binding
Direttive built-in
Dependency injection e servizi built-in
Dynamic styling
Form e validators
Filters

 

Modules, confg e run

  • Sviluppo applicazioni modulari: moduli e dipendenze
  • Utilizzare il metodo run()
  • Condividere dati tra controller grazie agli strumenti forniti dal framework

 

Controllers multipli

  • Suddividere l’applicazione in diversi controller
  • Controller nidificati
  • Comunicazione tra controller

 

Navigazione e routing

  • Suddividere un’applicazione in parziali HTML e controller multipli
  • Gestire la navigazione tramite navigation bar
  • Gestire route con parametri

 

Dynamic dom, angularjs e bootstrap

  • Introduzione a Bootstrap e utilizzo dei template
  • Conversione di layout statici in dinamici grazie ad AngularJS
  • Menu, navigazione e suddivisione del sito in parziali HTML
  • View dinamiche con contenuti acquisiti da servizi REST
  • Tip & Tricks

 

Data-driven components

  • Utilizzo di menu e navigation bar di Bootstrap
  • Generare menu dinamici, la cui struttura e i cui contenuti sono definiti in un file di configurazione JSON
  • Caricare contenuti e template dinamici

 

Sviluppo direttive custom

  • Creazione direttive e componenti riusabili
  • Transclusion
  • Utilizzo dei templates all’interno di direttive
  • Scope isolation: “@”, “=”, true e false
  • Scope isolation “&” e comunicazione con l’esterno
  • Link function
  • Comunicazione con il server e integrazione REST API