requirements bazaar powered by angularjs and polymer - talk at google developer group brussels
TRANSCRIPT
http://Learning-Layers-euhttp://Learning-Layers-eu
Learning Layers
Scaling up Technologies for Informal Learning in SME Clusters
Requirements Bazaar
powered by AngularJS & PolymerTalk at Google Developer Group Brussels
István Koren, Kristjan Liiva and Ádám Gavronek – RWTH Aachen University
1
http://Learning-Layers-eu
Continuous Innovation
• Involve end users in the development
• Allow developers to talk with end users
• Faster innovation cycles
• Web-based tool
• Mobile friendly
http://www.requirements-bazaar.org
5
Continuous Innovation
Continuous Integration
Continuous Delivery
Continuous Deployment
http://Learning-Layers-eu
Why AngularJS?
• Widely-used, modern framework• Model-View-Whatever pattern
– Better code readability
• Single-page application– Load application resources initially– Lazy-loading data
• Two-way data binding– Comfortable
• Using existing modules
6
http://Learning-Layers-eu
Why Polymer?
• Attractive for users and mobile usableMaterial Design
• Web Components are the next big thing!– Already today many components exist
• Responsive– Sidebar
– Inputs
• Code separation & readability
7
http://Learning-Layers-eu
Why AngularJS & Polymer
together?
• AngularJS moves into the direction ofWeb Components
• Complement each other
– Polymer in the view
– AngularJS in the controller
Because we can!
8
http://Learning-Layers-eu
AngularJS Architecture
CreateRequirementCtrl
10
http://Learning-Layers-eu
Used Polymer Components
• Polymer elements
– core-scaffold
– core-collapse
– paper-action-dialog
– paper-toast
– icons
• Polymer has great demos
11
http://Learning-Layers-eu
Combining AngularJS and
Polymer
• 1-way data binding
• For 2-way binding– OS library for basic components
– https://github.com/GabiAxel/ng-polymer-elements
– Polymer changes
– Binding some values, e.g. dialog opened
12
http://Learning-Layers-eu
Experiences & Recommendations
• The bad
– AngularJS refactoring
– Getting stuck is usual
– Performance
• The good
– Amazing progress
– Mistakes are easy to find
13
http://goo.gl/eOQDsk
http://Learning-Layers-eu
What will change with
AngularJS 2.0?
• Change of philosophy – Web components– NO BACKWARD COMPATIBILITY!
15
Angular 1 Angular 2
Pure JavaScript (ES5) Preferably TypeScript (ES6)
Controllers Component, Viewport, Decorator
Two-way data-binding One-way data-binding
$scope Implicit from components
ngRoute New router (usable in Angular 1)
http://Learning-Layers-eu
What will keep us busy…
• Libraries for HTML5, WebView for Android
• Plugins for WordPress
• Gamification
– Requirements Prioritization
– Development
• Personalized release notes
– ”Your idea has been implemented!“
16
http://Learning-Layers-eu
Thank you!
Find these and other ReqBaz slides on SlideShare.
István Koren, Kristjan Liiva, Ádám [email protected]
We‘re on GitHub:https://github.com/rwth-acis/RequirementsBazaar
Docker images available:https://registry.hub.docker.com/repos/rwthacis/
http://www.requirements-bazaar.org
17