AngularJS & Plone

Plone Open Garden 2014Timo Stollenwerk

Javascript

Photo: Trey Ratcliff / stuckincustoms.com

Modern Requirements

Photo: Trey Ratcliff / stuckincustoms.com

Choosing the right framework...

Photo: Trey Ratcliff / stuckincustoms.com

Choosing the right framework...

Full featured vs best of breed

Photo: Trey Ratcliff / stuckincustoms.com

Choosing the right framework...

Full featured vs best of breed

Components

Photo: Trey Ratcliff / stuckincustoms.com

Choosing the right framework...

Full featured vs best of breed

Components

Long term solution

Photo: Trey Ratcliff / stuckincustoms.com

Choosing the right framework...

Full featured vs best of breed

Components

Testable

Long term solution

Photo: Trey Ratcliff / stuckincustoms.com

A full featured front-end framework

Two-Way Data Binding

<input type="text"

ng-model="yourName">

<h1>Hello {{yourName}}!</h1>

Client Side Templates

<ul>

<li ng-repeat="item in items">

<a ng-href="{{item.url}}">

{{item.title}}

</a>

</li>

</ul>

Dependency Injection

function($scope, $http) {

…

}

Directives

<div navigation-directive></div>

Angular vs jQuery?

Angular & Plone?

Photo: Trey Ratcliff / stuckincustoms.com

Angular & Plone?

github.com/tisto/plone.app.angularjs

Photo: Trey Ratcliff / stuckincustoms.com

Plone Open Garden 2014Timo Stollenwerk