Presentation held at Web Monday Stockholm in March 2008. I am introducing JCR, Sling and the µjax AJAX-based access layer to a JCR repository. The presentation included a demo of a small Dojo application built using the µjax-Dojo-integration.
9. What’s JCR?
“The API should be a standard,
implementation independent, way
to access content bi-directionally
on a granular level to a
content repository.”
10. What’s JCR?
“The API should be a standard,
implementation independent, way
to access content bi-directionally
on a granular level to a
content repository.”
?
11. What’s JCR?
“The API should be a standard,
implementation independent, way
to access content bi-directionally
on a granular level to a
content repository.”
?
12. Best of both worlds.
database fi les yste m
content repositor y
13. Best of both worlds.
database fi les yste m
hier-
integ archi
rity structu
re es
read streams
tx query write locking
access
control
multi-
value g
un-
versionin
structured “full- sort obser-
text” order vation
content repositor y
24. Introducing µjax
JCR
the other side
de
ve
h a lope
t r
“i want to build webapps”
a rs )
me ( l
25. Introducing µjax
JCR
the other side
de
ve
h a lope
t r
“i want to build webapps”
a rs )
me ( l
26. Introducing µjax
JCR
the other side
de
ve
h a lope
t r
“i want to build webapps”
a rs )
me ( l
27. Introducing µjax
JCR
de
ve
h a lope
t r
a rs )
me ( l silve
r
µjax
28. Introducing µjax
JCR
de
ve
h a lope
t r
a rs )
me ( l silve
r
µjax
very simple
projection:
fits the bill
29. Introducing µjax
JCR
de
ve
h a lope
t r
a rs )
me ( l silve
r
µjax
very simple
projection: “usecas
fits the bill driven
e”
30. Introducing µjax
I browser & ujax.js
reading: json & resource GET’s
writing: form-POST & GET
s s
J2EE Web
Server
3
2
Browser I
2 UjaxServlet.java
translating requests
to JCR calls
3 JCR Compliant
Content Repository
31. Introducing µjax
I browser & ujax.js
reading: json & resource GET’s
writing: form-POST & GET
s s
J2EE Web
Server
3
2
Browser I
very simple js A 2 UjaxServlet.java
translating requests
read content, FoPI to to JCR calls
rms
to write conten
t 3 JCR Compliant
Content Repository
32. Introducing µjax
I browser & ujax.js
reading: json & resource GET’s
writing: form-POST & GET
s s
J2EE Web
Server
3
2 handles all the h
particularly se
eavy lifting,
curity
Browser I 16 t
ons
very simple js A 2 UjaxServlet.java
translating requests
read content, FoPI to to JCR calls
rms
to write conten
t 3 JCR Compliant
Content Repository
35. simple write example
tle>
examp le</ti
write
simple
<html> itle>µjax: OSTquot;>
<hea d><t hod=quot;P
y> aquot; met
d><bod ion=quot;/mydat
</hea m act
or -->
<f <!-- title > equot; />
/h2
<h2>Title< textquot; name =quot;Titl
=quot;
<input type ion -->
pt ionquot;>
<!-- descri on</h2> script
ti quot;De
<h2>Descrip s=quot;5quot; name=
ow
<textarea r
area>
</text -->
olor
<!-- c r</h2>
<h2>Colo orquot;>
e=quot;Col redquot;>red
<select nam alue=quot;
v >green
<option lue=quot;greenquot;
<option va
</select>
write me!
http://localhost:7402/firs
tsteps/1_write.html
rm>
</
</body
fo
>
>
</html
36. simple read example
title>
mple</
ad exa
simple re
<html> itle>µjax:
<t
<head>
</head
> cript
ax.jsquot;></s
<body> pt src=quot;/rj +'quot;>';
<scr i ataquot;); +node.Color
(quot;/myd :'
<s cri pt> getContent round-color
=Ujax. backg
va r node div style=quot;
v='< ;
var di .write(div)
nt
docume >
pt
</scri ript> Title)
;
2><sc e(node.
<h cument.writ
d o
></h2> ion);
</script t> script
rip de.De
<p><sc nt.write(no
docume p>
pt></
</scri
div>
</
read me!
http://localhost:7402/firs
tsteps/2_read.html
</body
</html
>
>
37. add new entry
itle>
ple</t
y exam
w entr
add ne
<html> itle>µjax:
<t
<head> body> es/*quot; taquot;>
/entri art/form-da
>< mydata p
</head m action=quot;/ type=quot;multi
or nc
<f od=quot;POSTquot; e
meth
lequot; />
tle </h2> quot; name=quot;Tit
<h2>Ti ype=quot;text
<input t tarea>
></tex
2> ptionquot;
cription</h ame=quot;Descri
<h2>Des rows=quot;5quot; n
<textarea
/h2>
<h2> Color< =quot;Colorquot;>
e red
<select nam alue=quot;redquot;> green
v quot;>
<option alue=quot;green
v
<option
</select>
agequot;/>
add new
http://localhost:7402/firststeps/3_addnew.html
age</h2> equot; name=quot;Im
<h2>Im ype=quot;fil
<inp ut t
nput t
ype=quot;s
ubmitquot;
></p>
><i
<p
form>
</
>
</body
>
</html
38. list entries
itle>
ple</t
s exam
list entrie
<html> itle>rjax:
t squot;);
<head>< /entrie
mydata
[ ...] ent(quot;/
etCont
<s cript> ries=Ujax.g
t
var en
pt>
</scri quot;>');
olor+'
<div> ntry.C
t> ries) { lor:'+e
<scrip ar a in ent s[a]; und-co
ackgro h3>');
for (v ntry=entrie iv style=quot;b le+'</
var e .write('<d +entry.Tit
nt >' );
docume .write('<h2 Description
nt y.
docume .write(entr
nt
docume
ge) {
ry.Ima
if(ent
[...] }
v>');
('</di
.write
http://lo
list entries
calhost:7
document
</a>
402/first
} > dd new
steps/4_l pt tmlquot;>a
ist.html </scri quot;3_addnew.h
f=
<a hre
</div>
>
</body
>
</html