Plone mockup modernising plone front-end development

Embed Size (px)

Citation preview

PLONE UI TEAMand several other hard working ninjas

BRING YOU

[ modernising Plone front-end development ]

What?

It is a collection of different widgets

which... according to some people..should be part of Plone since last year already

Why?

We have full unit testing of Plone js

We gradually replace and fix Plone's javascript story *

We can avoid using z3c.form for making new widgets

We have an increased pool of potential new contributors

Allow front end developers to contribute easily to Plone

Improve the user experience for Plone 5 with modern widgets

So...

Rok Garbas started the Mockup Project

Interesting facts...

uses RequireJS (adheres to AMD)(development only)

Almond used instead of RequireJS for packaged production js code.

Uses LessCSS (dynamic stylesheet language)

In heavy development

is MIT licensed

But some minor Confusion?

But some minor Confusion?

from Mockup FAQ - Heavy inspiration from PatternsLib - no code shared

Uses PatternsLib registry - gives us nice way to trigger Patterns via pat- class.

side note:Every pattern is also jQuery plugin and the pattern can be triggered as such

but then.. Rok's (older?) blog post:

I want to try it!

How?

You need Git & Node installed

Standalone Git checkout

Plone interfaces with Mockup project viaplone.app.widgets & plone.app.toolbar

Plone 4.3 buildout: buildout.deco on Github

Or try the pattern demos online

Sources:

Mockup Project DocumentationRok Garbas' BlogPloneUI mailing list

Credits:

http://plone.github.io/mockup/dev/#abouthttps://github.com/plone/buildout.decohttp://lists.plone.org/pipermail/plone-ui/2013-July/ *http://www.coactivate.org/projects/plog2013/plone-mockup-plone-app-widgetshttp://garbas.si/blog/2013/escaping-april-weather-plog-reportouthttp://garbas.si/blog/2013/patternslib-plone-mockup-ok-time-to-explain-it

Time for some demos

@witekdev

Thanks!