[PPT] - E fg e c t i v e W e b A p p l i c a t i o n D PowerPoint Presentation

SLIDE 1

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

E fg e c t i v e W e b A p p l i c a t i

n

D e v e l

p

me n t w i t h A p a c h e S l i n g

E fg e c t i v e W e b A p p l i c a t i

n

D e v e l

p

m e n t w i t h A p a c h e S l i n g R

b

e r t M u n t e a n u A p a c h e C

n

C

r

e E u r

p

e 2 1 5

SLIDE 2

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

W h

I

a m

 $

D A Y J O B

 A

d

b

e E x p e r i e n c e M a n a g e r

 A

p a c h e S l i n g

 A

p a c h e J a c k r a b b i t

 A

p a c h e F e l i x

 F

O S S

 A

p a c h e S l i n g

 M

a n t i s B T

 M

y l y n C

n

n e c t

r

f

r

M a n t i s B T

 M

y l y n C

n

n e c t

r

f

r

R e v i e w B

a

r d

Speaker.currentSpeaker().interrupt();

SLIDE 3

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

A g e n d a

Q

u i c k f a c t s a n d f i g u r e s

C
n

c e p t u a l f

u

n d a t i

n

s

B

u i l d i n g b l

c

k s

B

u i l d i n g S l i n g a p p l i c a t i

n

s

SLIDE 4

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

Q u i c k f a c t s a n d f i g u r e s

SLIDE 5

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

Q u i c k f a c t s a n d f i g u r e s

2 7

i n c u b a t i

n

2 9

T L P

2 1 4

V e r s i

n

7

2 x

P r e

A

p a c h e

SLIDE 6

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

H i g h

l

e v e l V i e w

f

t h e C

d

e

S

u

r c e : O p e n H u b

SLIDE 7

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

L e v e l

f

a c t i v i t y

S

u

r c e : O p e n H u b S

u

r c e : s t a t u s . a p a c h e .

r

g

SLIDE 8

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

C

mmu

n i t y i n v

l

v e me n t

S

u

r c e : M a r k m a i l

SLIDE 9

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

C

n

c e p t u a l f

u

n d a t i

n

s

C

n

c e p t u a l f

u

n d a t i

n

s

SLIDE 10

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

C

n

c e p t u a l f

u

n d a t i

n

s R E S T

b

a s e d C

n

t e n t

d

r i v e n O S G i

p
w

e r e d S c r i p t i n g i n s i d e A p a c h e

SLIDE 11

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

A p a c h e O p e n S

u

r c e P r

j

e c t

4

A r i e s

1

S e r v i c e M i x

7

C

m

m

n

s

1 7

F e l i x

3

G e r

n

i m

6

J a c k r a b b i t

1

D e r b y

2

T i k a

SLIDE 12

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R E S T

b

a s e d

/ b l

g

/ / b l

g

/ { } . h t m l / B l

g

V i e w C

n

t r

l

l e r B l

g

L i s t C

n

t r

l

l e r H

m

e C

n

t r

l

l e r S l i n g M a i n S e r v l e t / / b l

g

/ b l

g

/ h e l l

w
r

l d

SLIDE 13

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

C

n

t e n t

d

r i v e n

blog hello-world images jcr:content some-cat.jpg

ther-cat.jpg

SLIDE 14

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

C

n

t e n t

d

r i v e n

jcr:primaryType = app:asset
jcr:title = Some Cat
jcr:description = A longer description of this picture
f a cat
jcr:created = 2014-06-03T00:00:00.000+02:00
jcr:lastUpdated = 2014-06-03T11:00:00.000+02:00
tags = [Animal, Cat, Color]
width = 400
height = 600

some-cat.jpg

SLIDE 15

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S c r i p t i n g i n s i d e J S P

SLIDE 16

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S c r i p t i n g i n s i d e

libs blogapp welcome.jsp welcome json.html

SLIDE 17

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

O S G i p

w

e r e d

P

r

v

i s i

n

a n d d e p l

y

b u n d l e s

C
n

f i g u r e , r e g i s t e r a n d l

k

u p s e r v i c e s

E

v e n t i n g

W

e b C

n

s

l

e

SLIDE 18

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

B u i l d i n g b l

c

k s

B u i l d i n g b l

c

k s

SLIDE 19

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S e r v i n g a r e q u e s t

G E T / b l

g

/ w e l c

m

e . h t m l / b l

g

/ w e l c

m

e m y b l

g

/ b l

g

. g r

v

y ? ? ?

SLIDE 20

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e s

u

r c e T y p e s

blog [blogapp/listing] hello-world images jcr:content [blogapp/blog/content] some-cat.jpg

ther-cat.jpg

SLIDE 21

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S c r i p t r e s

l

u t i

n

GET /blog.html Type: blogapp/listing Extension: html Method: GET /libs/blogapp/listing/html.jsp @SlingServlet(resourceTypes=”blogapp/listing”,...) /libs/blogapp/listing.jsp

SLIDE 22

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e q u e s t s e l e c t

r

s

GET /blog.rss.xml Type: blogapp/listing Extension: xml Selector: rss Method: GET /libs/blogapp/listing/rss.html

SLIDE 23

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e s

u

r c e P r

v

i d e r s

J C R M

n

g

D

B F S C a s s a n d r a

/ / c

n

t e n t / / c

n

t e n t / c

m

m e n t s / l

g

s

SLIDE 24

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

J C R

SLIDE 25

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

J C R I mp l e me n t a t i

n

s A p a c h e J a c k r a b b i t O a k

SLIDE 26

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

B u i l d i n g S l i n g A p p l i c a t i

n

s

B u i l d i n g S l i n g A p p l i c a t i

n

s

SLIDE 27

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

J C R M

d

e l i n g

images

F i l e u p l

a

d

some-cat.jpg renditions small.jpg ripple.jpg

O b s e r v a t i

n

annotations initial-review

A C L s

SLIDE 28

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

J C R M

d

e l i n g

etc rendition ripple

orientation = /etc/rendition/ripple/options

↵ /orientation/vertical

antialiasing = true
edges = /etc/rendition/ripple/options/↵

edges/wrap

wave type = /etc/rendition/ripple/options/

↵ wave_type/simple

period = 20
amplitude = 5

SLIDE 29

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

E v e r y t h i n g i s a R e s

u

r c e

E v e r y t h i n g i s a r e s

u

r c e

SLIDE 30

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e a d i n g f r

m

t h e r e p

s

i t

r

y @SlingServlet(resourceTypes = "blogapp/listing", extensions = "xml", methods = "GET") public class RSSFeedServlet extends SlingSafeMethodsServlet { @Override protected void doGet(SlingHttpServletRequest request, SlingHttpServletResponse response) throws ServletException, IOException { // actual implementation } }

SLIDE 31

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e a d i n g f r

m

t h e r e p

s

i t

r

y Resource res = request.getResource(); ValueMap properties = ↵ res.adaptTo(ValueMap.class); String title = properties.get(“jcr:title”,↵ “Missing”); Post post = res.adaptTo(Post.class); title = post.getTitle();

SLIDE 32

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

A n

t

h e r t e mp l a t i n g l a n g u a g e ?

S

e c u r e b y d e f a u l t – X S S p r

t

e c t i

n
B

a t t e r i e s n

t

i n c l u d e d t

e

n c

u

r a g e s e p a r a t i

n
f

c

n

c e r n s

N

a t u r a l t e m p l a t i n g b y b l e n d i n g i n H T M L 5 d

c

u m e n t s

SLIDE 33

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S i g h t l y

<h4 class="card--${card.itemprop['customStyle']}"> ${card.itemprop['description'] </h4> <div data-sly-list=”${resource.listChildren}”> <article data-sly-resource=”${childResource}”/> </div> <section data-sly-include=”template.html”/> <div data-sly-use.logic=”logic.js”> ${logic.hi} </div>

SLIDE 34

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S i g h t l y s e r v e r

s

i d e l

g

i c

/* logic.js / use(function() { return { hi: “hello, world” } }) / Logic.java */ public class Logic{ public String getHi() { return “Hello, world” } }

SLIDE 35

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

E x t e n s i

n

s

T

h r e a d P

l

s a n d S c h e d u l e d T a s k s

I

1 8 n

C

a c h i n g

M
d

e l s

H

e a l t h C h e c k s

E

v e n t i n g

SLIDE 36

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

S l i n g Q u e r y

G e t t h e c l

s

e s t F

l

d e r p a r e n t

$(resource).parents("sling:Folder").last();

G e t t h e s e c

n

d c h i l d

f

e a c h r e s

u

r c e

$(resource1, resource2).children(":eq(1)");

F i n d c h i l d r e n n a m e d e n

r

d e

$(resource).children("#en, #de")

SLIDE 37

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

D e p l

y

me n t

S

i n g l e e x e c u t a b l e J a r

r

W a r f i l e – t h e S l i n g l a u n c h p a d

C
n

f i g u r a t i

n

d e f i n e d i n m u l t i p l e t e x t f i l e s , d e f i n i n g b u n d l e s , c

n

f i g u r a t i

n

, v a r i a b l e s , b

t

s t r a p c

m

m a n d s , e t c

SLIDE 38

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

P r

v

i s i

n

i n g mo d e l

[feature name=main] [variables] io.version=1.4 [configurations]

rg.apache.jackrabbit.....SegmentNodeStoreService

name="Default\ NodeStore" repository.home="sling/oak/repository" [artifacts startLevel=5] commons-io/commons-io/${io.version}/jar commons-fileupload/commons-fileupload/1.3.1/jar

SLIDE 39

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

W e b C

n

s

l

e – D e v e l

p

me n t h e l p

SLIDE 40

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

W e b C

n

s

l

e – r u n t i me c

n

f i g u r a t i

n

SLIDE 41

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

T

l

i n g

M

a v e n P l u g i n s

B

u n d l e d e p l

y

m e n t

L

a u n c h p a d c r e a t i

n
M

a v e n A r c h e t y p e s

I

D E T

l

i n g

E

c l i p s e

N

e t b e a n s ( e x t e r n a l )

SLIDE 42

h t t p : / / r

b

e r t . mu n t e a . n u @r

mb

e r t

R e s

u

r c e s

h

t t p : / / s l i n g . a p a c h e .

r

g /

h

t t p : / / j a c k r a b b i t . a p a c h e .

r

g /

h

t t p : / / w w w . s l i d e s h a r e . n e t / r

m