Experience Manager 6 Developer Features - Highlights

3,641 views

Published on

Circuit Chicago Presentation - a highlight of developer centric features for Adobe Experience Manager 6. Presented by Emily Stange and Cedric Huesler

Published in: Technology, Business

Experience Manager 6 Developer Features - Highlights

  1. 1. The New Developer Adobe Experience Manager 6
  2. 2. <div itemscope itemtype="http://schema.org/Person"> <span itemprop="name">Emily Stange</span> <span itemprop="jobTitle"> Senior Solution Consultant </span> for <span itemprop="affiliation">Adobe</span> </div> <div itemscope itemtype="http://schema.org/Person"> <span itemprop="name">Cedric Huesler</span> <span itemprop="jobTitle"> Group Product Manager Web Experience Management </span> for <span itemprop="affiliation">Adobe</span> </div>
  3. 3. 6._
  4. 4. TL:DR 1 2 3 Code save components quicker with Sightly New JCR repository that can handle more content faster Lots of new features/APIs and a fresh Touch- optimized UI
  5. 5. New code workflow 1
  6. 6. Adobe Experience Manager FilesystemGIT et al Filesystem Runtime & Repository IDE Preview in Browser commit hot-deploysave save
  7. 7. Less code… and keep it neat! 2
  8. 8. Adobe Experience Manager Component Model cq:Component Dialog Code ClientLibs Analytics Design Dialog Edit Config cq:Dialog (ExtJS) JSP ECMA Dialog: cq/gui/components/authoring/dialog HTML (Sightly)+JS HTML (Sightly)+Java cq:Dialog (ExtJS) cq:EditConfig cq:ClientLibraryFolder ‘analytics’ node
  9. 9. Adobe Experience Manager Code <%@include file="/apps/geometrixx-media/global.jsp"%><% %><%@ page session="false" import="java.util.Iterator, com.day.cq.wcm.api.PageFilter" %><% long absParent = currentStyle.get("absParent", 2L); Page rootPage = currentPage.getAbsoluteParent((int) absParent); Iterator<Page> childPages = null; if (rootPage != null) { childPages = rootPage.listChildren(new PageFilter(request)); } %> <div class="visible-phone btn-container"> <a class="btn btn-inverse authenticate"><i class="icon-cog icon-white"></i></a> <a class="btn btn-inverse menu-dropdown">Menu <i class="icon-chevron-down icon-white"></i></a> </div> <nav> <ul> <% if (childPages != null) { while (childPages.hasNext()) { String cssStyle = ""; Page childPage = childPages.next(); if (isCurrentPage(currentPage, childPage)) { cssStyle = "class='current-page'"; } String title = getTitle(xssAPI, childPage); %><li <%=cssStyle%>><a href="<%= childPage.getPath() %>.html"><%= title %></a></li> <% } } %> </ul> <cq:include path="search" resourceType="geometrixx-media/components/page/search"/> </nav> <%! boolean isCurrentPage(Page currentPage, Page page) { return currentPage.equals(page); } String getTitle(XSSAPI xssAPI, Page page) { String navTitle = page.getNavigationTitle(); if(navTitle == null) { navTitle = page.getTitle(); } if(navTitle == null) { navTitle = page.getName(); } return xssAPI.encodeForHTML(navTitle); } %> <div class="visible-phone btn-container"> <a class="btn btn-inverse authenticate"><i class="icon-cog icon-white"></i></a> <a class="btn btn-inverse menu-dropdown">${'Menu' @ i18n} <i class="icon-chevron-down icon-white"></i></a> </div> <nav data-sly-use-topNav="TopNav"> <ul data-sly-list-navItem="${topNav.items}"> <li class="current-${navItem.isCurrent}"><a href="${navItem.page.path}.html">${navItem.title}</a></li> </ul> <div data-sly-resource="${options: path='search', resourceType='geometrixx-media/components/page/search'}"/> </nav> package apps.geometrixx_media.components.topnav; import com.adobe.cq.sightly.WcmUse; import com.day.cq.wcm.api.Page; import com.day.cq.wcm.api.PageFilter; import java.util.*; public class TopNav extends WcmUse { private List<Map<String, Object>> items = new ArrayList<Map<String, Object>>(); private String getTitle(Page page) { String navTitle = page.getNavigationTitle(); if (navTitle == null) { navTitle = page.getTitle(); if (navTitle == null) { navTitle = page.getName(); } } return navTitle; } public void activate() throws Exception { Page currentPage = getCurrentPage(); int absParent = getCurrentStyle().get("absParent", 2); Page rootPage = currentPage.getAbsoluteParent(absParent); if (rootPage != null) { Iterator<Page> childPages = rootPage.listChildren(new PageFilter(getRequest())); while (childPages.hasNext()) { Map<String, Object> navItem = new HashMap<String, Object>(); Page childPage = childPages.next(); navItem.put("page", childPage); navItem.put("title", getTitle(childPage)); navItem.put("isCurrent", new Boolean(currentPage.equals(childPage))); items.add(navItem); } } } public List<Map<String, Object>> getItems() { return items; } } Component Code (HTML+JSP) Component Code (HTML+Sightly) Reusable Java or JavaScript Code vs
  10. 10. Automated Site Testing 3
  11. 11. New repo - same API 4
  12. 12. Adobe Experience Manager Microkernel Repository (aka Oak) Tar Set DataStore Indexes Tar Set JCR HTTP 5.x 6.x Microkernel ISMs for Session ISMs for Workspace Multiversion concurrency control Our & Your Code Our & Your Code SearchBinaries Nodes
 Properties Nodes, Properties, Binaries, Search CQSE Jetty
  13. 13. Update process 5
  14. 14. Adobe Experience Manager 2-step Upgrade Replace JAR
 file Startup runs
 in-place
 upgrade run
 crx2oak Choice: - TAR files - MongoDB Stop Start Stop Start
  15. 15. Mobile apps with PhoneGap 6
  16. 16. New APIs7
  17. 17. Adobe Experience Manager New & extended APIs • Sling Models • Sling Health-check • Sling Resource Merge • Translation API • Vault RPC • ContextHub • ContentInsight • eCommerce • Social Components • DAM Collection & Sets Dependencies for Maven/Gradle: http://repo.adobe.com/nexus/content/repositories/releases/com/adobe/aem/aem-api/6.0.0.1/
  18. 18. TL:DR 1 2 3 Code save components quicker with Sightly New JCR repository that can handle more content faster Lots of new features/APIs and a fresh Touch- optimized UI
  19. 19. What I always wanted to know?

×