18
Create

Create JS - A new kind of web editing interface

Embed Size (px)

DESCRIPTION

Presentation from the first HelsinkiJS meetup

Citation preview

Page 1: Create JS  - A new kind of web editing interface

Create

Page 2: Create JS  - A new kind of web editing interface

“Build a CMS, no forms allowed”

Page 3: Create JS  - A new kind of web editing interface

Just Edit

Page 4: Create JS  - A new kind of web editing interface

CMS and JavaScript must agree on the content model

Page 5: Create JS  - A new kind of web editing interface

RDFa: Your Content, Explained

Page 6: Create JS  - A new kind of web editing interface

RDFa: Your Content, Explained

Page 7: Create JS  - A new kind of web editing interface

Suddenly JavaScript can understand

Page 8: Create JS  - A new kind of web editing interface

Bonus: SEO

Page 9: Create JS  - A new kind of web editing interface

Entering editing state

Page 10: Create JS  - A new kind of web editing interface

Editing and saving

Page 11: Create JS  - A new kind of web editing interface

VIE – Bridging RDFa to JavaScript● MIT license, developed by IKS Project on GitHub● Depends on Backbone.js and jQuery● Load RDFa entities as JavaScript objects● Sync changes to server, and to DOM● References enable list

manipulation● Change events● http://viejs.org

Page 12: Create JS  - A new kind of web editing interface

Content Management

System

Database Content RepositoryDatabase

Web Framework

Web Editing Tool

Monolithic approach Decoupled approach

Page 13: Create JS  - A new kind of web editing interface

Web Framework

Web Editing Tool

HTML+RDFa JSON-LD over REST

Page 14: Create JS  - A new kind of web editing interface

Communicating changes to server

Page 15: Create JS  - A new kind of web editing interface

Shared JavaScript CMS API

Page 16: Create JS  - A new kind of web editing interface

Get started with VIE

1. Mark up your content with RDFa

2. Include vie.js to your pages

3. Implement Backbone.sync

Page 17: Create JS  - A new kind of web editing interface

http://createjs.org/

Page 18: Create JS  - A new kind of web editing interface

Questions?

[email protected]

@bergie

http://vieJS.org http://createJS.org