Angular JS QuickStart: extremely productive development of HTML5 webapps
DATE: Wednesday the 26th of November.
Many services and applications have demonstrated the power of HTML5 platform. However, designing, building and maintaining a complex Javascript is a remarkable challenge. The workshop presents an ever more popular and Open Source framework, the extremely robust, productive and simple Angular JS.
LANGUAGE
Italian
LEVEL
Medium
DURATION
The workshop is full-day (8 hours) from 9:00 to 18:00, with one hour lunch break.
LOCATION
Room Bl 27.1.3 – Politecnico di Milano – Bovisa | Building BL 27 - Via R. Lambruschini, 4 – Milano
CHECK IN: 8:30 – 9:00
PRICES:
Super Early Bird: 105 €, from the 10th September to the 30th September;
Early Bird: 125 €, from the 1st October to the 5th November;
Regular Ticket: 145 €, from the 6th November to the end of the sales.
CARLO BONAMICO
Carlo’s passion for Software Development began with his C128, then grew with Linux, Java/JavaScript, web & enterprise applications, and now to cloud & mobile. After a PhD and Research exp.at Univ.of Genoa and CNIT, an exciting time at startup Eptamedia, he’s now a Solution Architect and Senior Trainer at NIS srl. His communication style as an architect and trainer, both technically precise and able to present complex topics to an heterogeneous audience has been appreciated online (slideshare pres.on Hudson with 110Kviews) and at many JUG/Comm. events from Javapolis 2005 to Codemotion Rome.
ABSTRACT
The workshop presents an ever more popular and Open Source framework, the extremely robust, productive and simple Angular JS.
Angular JS provides a set of almost “magic” tools that automate and simplify front-end development, making it remarkably easier to
-develop web applications that can be ported on Desktop and Mobile
-easy to test
-extremely modular and reusable
-easy to integrate with graphic resources (CSS, HTML), in an integrated Designer->Developer workflow
while at the same time being extremely productive (a third of the lines of code with respect to a typical JS application)
TABLE OF CONTENTS
Features of a modern HTML5 web application
-interaction
-ease of use
-responsive design and multi-device support
-off-line support
-REST services integration
Limitation of traditional frameworks
The ideal framework
An example: managing online orders for Pizza5 franchise
-requirements
Enter Angular JS
Main concepts: MVC, data binding, HTML-oriented
Lab: writing Pizza5 Home Page
Data binding (two-way, applied to both values and tag attributes)
Lab: customer registration form
From Data Binding to MVC / MVVM
-controllers and their role
-form values initialization
Lab: defining model and controller for pizza menu and order cart
Managing state with scopes (local and global)
Lab: sharing data between page sections
Development and Debug tools: AngularJS Batarang
Advanced Data Binding: iterating on collections
Lab: generating the pizza menu
Writing controllers: reacting to page events and user actions
Lab: adding pizzas to cart
Advanced Views:
-filters
-search
Lab: filtering pizzas by name and ingredients
AngularJS’s secret: Dependency Injection
-what is it?
-how to configure it
Lab: integrating REST services with $resource
Application Structure
-modules
-configuration
Lab: splitting the menu and cart modules
Navigation, $routeProvider, partial views
Lab: splitting the app in navigable and bookmarkable sections
Test support (in two minutes)
Lab: unit testing controllers
References for further exploration
-Angular-ready component libraries
-integrating custom code
-what are directives?
-AngularUI
-learning resources
TRAINING OBJECTIVES
This workshop distilles a mix of theory and practice. Course topics will be explored by developing a simple but realistic web application, and Angular APIs and features will be introduced and demonstrated by implementing the requirements of a modern HTML5 app:
-high interaction
-stylish design
-integration with REST or event-based backends
-integrating components of heterogeneous libraries
-managing state and browser history
At the end of the workshop the learner will have acquired the tools and know-how needed to structure an AngularJS applications, including
-Angular features and potential
-the why’s and how’s of MVC
-exploiting Dependency Injection for modular and reusable apps
-making testing easier
The minimum necessary theory, and lots of examples and experiments to learn “hands on”.
WHO THE WORKSHOP IS DEDICATED TO?
This workshop is aimed at web developers, JavaScript developers but also developers with any background who, after learning JS basics, feel the need for learning a structured and productive approach to developing awesome HTML5 sites and apps with Angular JS.
PREREQUISITES NEEDED FROM ATTENDEES
Familiarity with HMTL and basic knowledge of programming language.
HARDWARE AND SOFTWARE REQUIREMENTS
Participants are required to bring their own laptop. The labs require an HTML5 Browser (Chrome or Firefox), text editor or IDE, supporting HTML5, CSS3, JavaScript.