Front-End is about

CQ5 structures well HTML:

HTML = Markup + Content under the content node

under the component node

CSS = Layout
Client Libraries
JS = Behavior

2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 5

 Client Libraries

Each project usually has:

Various CSS & JS libraries Framework

Library A
Express relations between client libs
dependencies Library B

embed Component A

Various optimizations Component B

concatenated Component C
minified
Site Design
gzipped
Publish ClientLib

2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 6

 Client Libraries

/ Framework

etc Library A

clientlibs Library B

designs Component A

site Component B

apps Component C

site Site Design

components Publish ClientLib

2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 7