Adobe Experience Manager Tutorial

Adobe Experience Manager Tutorial

Welcome to Adobe Experience Manager Tutorial. The purpose of creating this post is that most AEM blogs and tutorials available online are not properly indexed. For example, if a beginner wants to learn AEM he doesn’t have any proper guide, where to start learning AEM from and how to learn AEM. So, I have decided to create this index post that will consist of all topics in a sequence that a beginner should follow to learn aem.

 Introduction:-

History of AEM.

AEM Overview.

AEM Building Blocks.

AEM Installation and Setup.

Different AEM Console.

 Good To Know:-

AEM Shortcut and Quick Reference Guide.

Adobe AEM Best Practices for creating Website.

Adobe AEM Best Practice for creating project Structure.

Best Practices and Basics Suggested by Adobe.

In This Tutorial, You Will Learn

  • What is Adobe Experience Manager (AEM)?
  • What is AEM technology?
  • AEM Architecture
  • AEM Developer Tools for Eclipse
  • What is the use of AEM?
  • Features of AEM
  • Role of AEM Developer
  • Conclusion

 What is Adobe Experience Manager (AEM)?

As discussed in the section above, Adobe Experience Manager (AEM) is a content management solution that helps professionals keep track of their content. Anything that is required for an individual or an organization to make the most important strategic components is all housed within this single platform. AEM, in layperson terms, can be termed as an easier way to give access to your customers what they want by providing them with user-friendly interfaces and built-in features. As it’s easy to use, AEM has gained huge popularity for the product as well as for the organization.

It just doesn’t enable web applications to be built in a jiffy but also enables the building of mobile applications at a rapid pace. Using AEM, organizations can build web applications, responsive websites, mobile applications, forms, etc. There are some cool features that come in pretty handy like being able to embed custom-built components with the content being fetched from its Digital Asset Manager (DAM). For organizations that are planning to opt for AEM or who are already using them, this article should provide almost all the details that are required to understand better. This will not just enable you to help organizations pick up the pace but also provide valuable insights into the Quality Engineering roadmap.

What is AEM technology?

Adobe Experience Manager (AEM) is based on the concepts of Apache Sling, a Java application based on OSGi using the Apache Felix engine. In layman terms, you could mention Apache Felix is to Apache Sling what Equinox is to Eclipse IDE. Apache Sling uses a Java Content Repository (JCR, which is built with Apache Jackrabbit) object database to continue to store the required information. Apache Sling has its own HTTP server which can be used as a Web Application with an Application server (usually Jetty). This provides the basic functionality of a server and a servlet framework.

Apache Sling is outdated gravely and hence, Adobe expanded the functionalities of Sling to produce their own enhanced version of Apache Sling called the Adobe CRX (Content Repository eXtreme). Since the beginning of CQ 5.4, the functionality underlying is transferred to Granite. CRX or Granite took care of most of the underlying functionalities or low-level functionalities as event management, user management, and data persistence. The digital asset management and content management features are provided using the WCM / CQ on top of Granite / CRX core. CQ is no longer the same when it became AEM, and it has been enhanced to such an extent that AEM is much more than what it was when it was in CQ form. AEM Assets provided the Scene 7 functionality to AEM whereas AEM Forms provided the LiveCycle functionality to AEM.

AEM Architecture:

Let us now go through each topic individually to understand the internals of AEM, the tool:

  1. Servlet Engine:

The Servlet engine is the server within which each of the AEM instances would be running as a web application. Here it could be any Servlet Engine that supports Servlet API 2.4 or higher. Although CQ WCM (Web Content Management) be run without the need for an additional Application Server, it would still require a Servlet Engine. To satisfy this need, CQ WCM is shipped along with Day’s CQSE (CQ Servlet Engine) which is free of cost and is supported to the fullest.

  1. Java Content Repository (JCR):

A Java Content Repository is a Content Repository that abides by the JSR-170 API, independent of the actual implementation. Usually, a repository is efficiently a combination of a Web application (that offers JSR-170 compliant API and temporary data storage in the form a session) and also a Persistence Manager (this includes a persistent data storage, such as a file system or a database).

  1. CQ 5:
  2. The base foundation of the CQ5 (which was the name given to AEM erstwhile) provides interoperability and seamless integration with all CQ applications. This is usually available for applications that are integral to CQ5 and any other customized applications that are developed for the platform altogether.
  1. Web Content department and Workflow Engine are the applications that were developed to hold the advantages of CQ5. Digital Asset Management and Social Collaboration are available with other products. Some of the technologies that we deal with the AEM are Apache Sling and OSGi (Apache Felix).
  1. Apache Sling is a Web Application framework that has been centred with content applications using an available Java Content Repository like Apache Jackrabbit or CRX in order to store and retrieve content. A few important points about Sling are mentioned below.

Sling is based on the REST principles that provide an easier development lifecycle of content-based applications.

  • It is embedded with AEM
  • It is used to process the HTTP requests for rendering and data-storage
  • It maps Content objects to the individual components that provide and process the incoming data
  • It comes along with both the server-side and AJAX-based scripting support
  • The sling can be used with a variety of scripting languages as like JSP and Ruby
  • It had started as an internal project of Day Management AG and contributed to the Apache Software Foundation later
  1. AEM (the erstwhile CQ5) is built within a framework based on OSGi technology and is considered the dynamic module system for Java. To understand a little more about the OSGi technology that has been used in AEM, please go through the following points:

OSGi technology is classified under Universal Middleware technologies

 

  • OSGi technology provides standardized primitives that allow applications to be built from small, reusable components. These can be composed of an application and further can be deployed.
  • OSGi bundles may contain compiled Java code, scripts and also content that needs to be loaded into the repository along with the necessary configuration files and log files
  • OSGi technology allows us to load bundles, and install them during any normal operations. This is generally managed via the Sling Management Console if it was the case with AEM.
  • Apache Felix has been used to come up with this framework. It is an open-source implementation including the OSGi framework and services.
  1. Further to these, there are a few more components that we can discuss under the classification of CQ5 itself. Web Content Management (CQ WCM) is the tool that permits the generation and publishing of pages to your actual website.
  1. CQ Workflow Engine is an easy to use and powerful process engine running on a CQ5 platform. There is a provision for a Java API and RESTful HTTP interface for the required access by applications outside of the platform. Within this framework itself, all the requests for generating or publishing content will be managed including approvals and sign-offs.
  1. CQ Components come up with the required logic in rendering the actual content. It includes both templates and components such as Image, Text, Column control and others. Components are actually a set of widgets
  1. CQ Widgets are the building block elements that are used to implement specific user functions, often with the editing of content, and also include dialog, buttons, radio-boxes, etc.

AEM Developer Tools for Eclipse:

AEM Development Tools for the Eclipse IDE is shipped with a perspective that offers full control over AEM projects and instances. AEM Developer Tools for Eclipse is an Eclipse plugin based on the plugin for Apache Sling under the Apache License 2 license. This plugin provides many features that make AEM development quicker and easier. They are as follows.

  • It provides seamless integration with all your AEM instances through the Eclipse Server Connector.
  • It provides synchronization for both your content and the OSGI bundles.
  • Provides the required debugging support with code hot-swapping capability.
  • give a simple restart of AEM projects through a particular Project Creation Wizard.
  • It provides an easy JCR properties edition.
  • AEM Developer tools come in handy when you have the Eclipse IDE installed for Java EE developers. The supported IDE amongst the various IDEs that Eclipse supports is, Eclipse Kepler or newer. With the AEM Developer tools, a developer will be able to:
  • Supports AEM version 5.6.1 or newer
  • Edit the eclipse.ini configuration file to have at least 1GB of heap memory.

 What is the use of AEM?

AEM finds many uses when it comes to the usage from both the developer community or from the business users. Let us now take a look at all these uses one after the other and understand the internals of it in a better manner.

  1. Project dashboard:

Project management is supplied by the AEM Project dashboard through a central environment. Each project is a logical grouping of resources that are linked together and further represented as a tile. It gives an opportunity to the users to add various information into projects. Most used are obviously the websites and assets whereas editors associate external links, team information, project information, and tasks in their projects.

  1. Digital Asset Management (DAM):

AEM DAM (Digital Asset Management) is a tool that provides editors with the possibility to manage the lifecycle or assets throughout their websites. DAM allows the editors to store various assets such as videos, documents, and images under a clear folder structure. The true power of DAM lies in its drag and drop assets. Over and above that, editors can work on extensive sets of data per asset along with copyright data and metadata. DAM makes the whole process of editing and publishing the data assets really smooth and easy.

  1. Editing content:

Extra content can be created by dragging and dropping on the page. Content editors always work on certain sections of the page (as they are a group of components or building blocks) and, by far, it is the popular “What you see is what you get” editors. With DAM integration into AEM, it is now possible to search for a certain asset and drag-drop into a certain page of your choice. AEM makes it easy to create or manage web pages within minutes and also, with Preview capabilities, users will be able to see how the content looks without even publishing it.

  1. Adobe Marketing Cloud integration:

Marketing should be much more than building the customer experience over the web and also include the required monitoring of analytics, target specific users or groups, and to be able to create campaigns. This could be achieved by choosing the right tools to cater to marketing needs. AEM is a part of Adobe Marketing Cloud because of the belief that the marketing efforts should be taken up automatically with the AEM efforts rather than putting additional efforts into it. Hence, it’s 0easy for AEM to be unified with Adobe Campaign, Adobe Analytics or even with Adobe Target. Not just this, there are many more third-party tools that it integrates with to provide much more flexibility and extensibility for AEM.

  1. Components provided OOTB (Out of the box):

Adobe Experience Manager (AEM) approach along with a vast variety of out of the box building blocks and components. enlargement of a project is the first thing that uses all of these out of the box features, hence reducing the development costs to a bare minimum. Secondly, these components are supported by Adobe pretty well when migrated to newer versions of AEM. The amount of code that has to be written is also brought to a minimum with the advent of these components, which is the third advantage of it.

  1. Personalization:

All the content that is getting created on a day to day basis might not fit into each and every customer’s curated content, and hence requires a little bit of tailoring to fit their set of requirements. Hence, there is a need to filter content based on the profile of the visitor. AEM collects all the information such as the visitor’s location, a relationship that he holds with the other available products, usage history, search history, and a lot more details like this. This can be better understood this way – discounts that a customer is provided based on in their past purchase history, etc.

Features of AEM:

In this section, let us discuss the features that AEM brings to the table. There are quite a few features that it provides to keep up with the current market trends, and then there are the traditionally required features from a product suite such as Adobe. Let us take a look at each of these and understand them in detail:

  1. Find Anything that you want, Anywhere:

Omni-search is the feature that we should be discussing and which enables users to search the entire repository to access all kinds of data in AEM. In a click, you should be able to find all the applicable details about projects, assets, components, templates, and pages, anything for that case. By an all-encompassing search, you’d be at the benefit and so is your organization with more productive work getting done in the shortest time.

  1. Templates for everyone:

Empowerment is what AEM screams about. Having newer templates couldn’t have been easier if it is not for AEM. AEM provides form-based templates, HTML5 based templates, and also provides a drag and drop feature. There are 3 friendly modes – content, layout, and structure that help business users create the templates of their choice. The creation of templates is no longer a tedious job as a template editor does this for both developers and business users – who can leverage the intuitive interface to create their own templates.

  1. Social Power:

Improving efficiency is the goal that a successful content marketing requires. Utilizing the social power we can improve both on the efficiency and also the content marketing strategies, engagement and also on agility. With the newer releases of social communities, there is always a chance to enhance digital experiences via the power of social conversations. This can also happen over the communities that you have around your brand.

  1. Bring Up Content at Scale:

The need of the hour is to create better content always instead of content creation. For this to happen, we need to employ traditional ways of content sources organically, which is a tougher task with limited staff, budgets, and resources. Here comes the integration of AEM 6.2 with Livefyre (content curation and audience engagement service) which helps in bringing in social media and community-driven content together to AEM. With this, the content is deployed at a scale that is generated by their best customers or brand ambassadors.

  1. Personalization that is fine-grained:

Personalization is the need of the hour. Vast amounts of data being scaled and personalized to cater to gigantic audiences have been a great challenge until now. With the integration of Adobe Target with AEM, all these capabilities are provided from a single user interface with all the necessary privileges. This means that your brand’s personalization and the ability to deliver the right content to the right set of an audience is the quickest.

  1. Target locally and Manage globally:

Having plans to launch a global campaign – this is to take on the world with a lot of differences culturally, regulatory, regional, and many more. What might work in one country might not work in others, hence the need arises for better tools to manage all these in one place. With the multi-site manager, global brands can push their campaigns from Headquarters to local sites, and then to regional markets with more ease and control. This also ensures that each of your target markets is addressed the right way across the globe.

  1. Localization:

There has been an enormous amount of progress in the area of translation and also in managing them efficiently within AEM. Putting such enormous amounts of content at scale and also worrying about localization comes at a grave cost and also time-consuming. AEM puts content localization through machine translation and analyzed to identify areas where the human translation is warranted. This helps to identify parts of your web experience used more frequently and then translated by a human to enhance the experience.

  1. Best-Practices:

AEM 6.2 has a reference site comprising all the best in class practices that are vetted by Adobe, which is a great tool to provide the best of the insights into foundations of AEM both for the developers and business users. The themes that AEM promotes are a faster time to market, scalability, and content velocity. Best customer experiences are possible by the features that are developed by AEM.

Role of AEM Developer:

It is understood that AEM touches so many levels of the Web development stack that it requires more breadth of awareness and knowledge than an average Web / Software developer. There are many technologies that are not that frequently used outside of the Enterprise Content Management Systems (CMS) like Sling, Java Content Repository (JCR) or OSGI. Having said that, let us take a few of the roles in any given development project and understand the importance of an AEM developer in each of those areas:

  1. UX Design (User Experience):

AEM development starts from the wire-framing stage itself. Having your AEM developers, architects during your planning phases will give you a better edge in your implementation. By this, the AEM developers gain knowledge about user interactions, user experience, and also a tiny bit of information architecture and User experience.

  1. Front-end development:

An AEM developer is expected to know about the front-end code intimately. There is always scope for you to know enough about Gulp/Grunt, NPM, and Node.js. Apart from these, the AEM developer finally gets started with the actual front-end development typically using CSS, HTML, JavaScript, jQuery.

  1. AEM Component development:

Most of the AEM component development is not using JSPs but using HTML Templating language (earlier known as Sightly). This stage also involves dialog building (in XML), and client library development (specific to AEM development). These let you add content dynamically to the components as provided by the dialog box. Most of the logic can be accomplished using the HTML Templating language, and the complex ones can be achieved using Java code.

  1. AEM OSGi and Servlets development:

An AEM developer is required to know about OSGi framework, annotations, and the general life-cycle of the OSGi component. He/she may also need to use an OSGi Service instead of just stating it as an OSGi component. Most of this knowledge comes from general Java development and also from the know-how of request/response lifecycle.

  1. AEM DevOps and Production Support:

An AEM developer will still get on holder even after the particular development is concluded. With the advent of CI/CD systems like Jenkins, the code can move to any of the environments (ranging from Dev, Staging, Pre-Prod, and UAT). Usually, the production movements would be done manually to ensure all the processes are done by following a checklist. There can be tasks like technical troubleshooting, content entry and the like that relates to AEM as such.

CONFIGURE THE https(SSL) on AEM instance quickly

There are cases where during development we may have to setup https connection in our existing AEM instance.

By following procedure we can have both http and https on the same AEM instance. This is very helpful while testing a number of the AEM features which require SSL connections.

To start with, we need keys and certificates to configure SSL on AEM. We will use OpenSSL to line up keys and certificates. The method is tested on Windows, but should work on any other OS seamless way.

How to setup OpenSSL on Windows

  • Download OpenSSL from any URL – Ensure its applicable to your OS (including 86 Vs 64 Bit)
  • Unzip it.
  • Set the classpath
  • place the conf enter below path (Else you’ll get a mistake that OpenSSL conf can’t be found)

Now the OpenSSL is designed on your windows

make use of command prompt execute below commands

### Create Private Key

$ openssl genrsa -aes256 -out localhostprivate.key 4096

### Give rise to Certificate Signing Request using private key

$ openssl request -sha256 -new -key localhostprivate.key -out localhost.csr -subj “/CN=localhost”

### give rise to the SSL certificate and sign with the private key will expire one year from now

$ OpenSSL x509 -request -days 365 -in localhost.csr -signkey localhostprivate.key -out localhost.crt

### Change Private Key to DER format – SSL wizard requires key to be in DER format

$ openssl pkcs8 -topk8 -notify PEM -outmatch DER -in localhostprivate.key -out localhostprivate.der -nocrypt

You will have the certificates now in local drive as shown below.

Use the SSL Wizard in AEM

Now login to AEM

http://localhost:4502/aem/start.html

Tools > Security > SSL Configuration

For store, credentials provide the Key store and Trust store password.

Common security vulnerabilities identified as a part of AEM projects

Whenever an AEM project goes Live, a set of scans happens to ensure that the website adheres to a set of security & performance guidelines.

The security/ penetration tests usually get scheduled a few days ahead of any AEM go live. Below given the set of issues identified as part of AEM websites normally.

Horizontal Privilege Escalation Vulnerability :

Usually by horizontal privilege escalation, hackers remain on the same general user privilege level but gain access data of other accounts or processes that should be unavailable to the current account or process.

Host Header Injection Vulnerability: 

 Normally a header is employed by an internet server to make a decision which website should process the received HTTP request. Whenever many websites are hosted on the same IP address, the web server uses the value of this header to forward the HTTP request to the correct website for processing. This poses a vulnerability.

Email Flooding Attack:

 In general, sending large volumes of email to an email address so that the mailbox gets overflowed, overwhelms the server where the email address is hosted in a denial-of-service attack. Thus a wrong impression screen to distract the eye from important email messages indicating a security breach.

HTML Injection Vulnerability: 

 HTML injection generally occurs when the vulnerability inside any website that occurs when the user input is not correctly sanitized or the output is not encoded and the attacker is able to inject valid HTML code into a vulnerable website . If these methods are provided with untrusted input, then there is a high risk of XSS, specifically an HTML injection issue. If strings aren’t correctly sanitized the matter could lead on to XSS based HTML injection.

Session Replay Attack: 

These kinds of attacks, known as playback attacks or replay attacks, are network attacks that maliciously repeat or delay a valid data transmission. A hacker can do that by intercepting a session and stealing a user’s unique session ID. Now, the hacker is able to behave himself or herself as an authorized user on-site and will be granted full access to do anything that the authorized user can do on a website.

Stored XSS via File Upload Vulnerability:

Such scripts are possibly vulnerable to XSS (Cross-site scripting). The web application allows file upload of any type & was ready to upload a file containing HTML content or various file extensions. When HTML files are allowed, XSS payloads are often injected within the file uploaded.

Web Server Banner Disclosure: 

When we are running a web server, it often shows the others what type of server it is, its version number, and the operating system. This information is out there in header fields and may be acquired employing a browser to form an easy HTTP request to any web application. It is often called the web server banner.

Concurrent Logins Allowed: 

 Parallel logins. Interactive logins at desktops and laptops, a supervisor cannot, therefore, prevent a given user from rising to at least one computer, logging on there, letting somebody work as him or just leaving the pc unattended, then walking up to a different computer and logging on there. This causes data leaks.

Email Harvesting:

 A process of obtaining a large number of email addresses through various online sources like website hacking. They obtain a list of emails, either by purchase or theft, of valid email addresses for the purpose of sending bulk emails or Spam.

Vulnerable JQuery version in use

The old version of Jquery causes a threat to the websites.

Content Spoofing Vulnerability: 

 Content Spoofing or Content Injection is one of the common web security vulnerabilities. It allows the end-user of the vulnerable web application to spoof or modify the actual content on the web page. The user might use the security loopholes in the website to inject the content that they wish to the target website. When an application doesn’t correctly handle user-furnished data, an attacker can supply content to an internet application, typically via a parameter value, that’s reflected back to the user.

Missing Secure and “Http Only” Flag from cookie

This is a further flag included during a Set-Cookie HTTP response header. If supported by the browser, using the HttpOnly flag when generating a cookie helps mitigate the danger of client-side script accessing the protected cookie. If a browser that holdup HttpOnly finds a cookie carrying the HttpOnly flag, and client-side script code attempts to read the cookie, the browser returns an empty string because of the result. This causes the attack to fail by preventing the malicious (usually XSS) code from sending the data to an attacker’s web.

[Set-Cookie: =[; =] [; run out=][; realm=] [; path=][; secure][; HttpOnly]]

Cookie Path Set to Root:

Many of the browsers don’t allow cookies to be set at the basic level. set the cookie path attribute to application-defined folder.

 SameSite Cookie Attribute Not Set:

 The ‘SameSite’ attribute tells browsers when and the way to fireside cookies in first- or third-party situations. This attribute is used by a variety of browsers to identify whether or not to allow a cookie to be accessed.

Improper Error/Exception Handling Vulnerability:

 Improper error handling arises when security mechanisms fail to deny access until it is specifically granted. This may take place as a result of a discrepancy in policy and coding practice. It may also result from code that absence appropriate error handling logic. For example, a system may grant access until it’s denied (deny all, then allow individually).

Improper Session Management The issue is because session tokens are not handled in the proper way. While a number of it’d be intentional, enough care should be taken to feature some quite validation for the user. Because of the way mobile applications are used, many originators allow long or non-expiring user sessions or use session tokens that are too predictable.

Session Timeout is not set Properly:

 As a standard process, applications should invalidate a session after a predefined idle time has passed (a timeout) and provide users with the means to invalidate their own sessions, (logout). These simple measures help to stay the lifespan of a session ID as short as possible. To rescue against Inadequate meeting fail attacks, the logout function should be comfortably visible to the user, explicitly invalidate a user’s session, and disallow reuse of the session token.

Missing Security Headers:

 Security HTTP headers are a fundamental part of website security. Once implemented, they protect against the types of attacks that a site is most likely to come across. These headers save against XSS, code injection, clickjacking, etc.

There are third-party services to enable the security scan. A thorough scan and identify and fix all the major critical items should be a must included item in any AEM project delivery.

Composum with AEM

 What is Composum?

Composum is an Open-Source project supported Apache Sling, which may be a set of useful tools and a framework to work with Apache Sling framework easily.

Modules of Composum: Nodes, Pages, Assets, Platform

Composum Platform:

This is the central services to line up an Apache Sling based application platform

Composum Pages:

Pages supply the content managing feature of the Composum platform

Composum Assets:

This is the image benefit managing feature of the Composum

Composum Nodes:

assets/JCR enlargement tool with core API for all Composum modules.

Use case with AEM: Composum helps to make a diagram representation of the OSGI service dependencies.

Conclusion:

In this article, we have explored in detail every major concept of AEM. AEM is an absolute way for the marketers to build value and also at the same time maintain the personal touch. AEM can be mentioned as the most sophisticated out of the box solution that is available for the marketing strategists who can leverage the features to complete marketing strategy implementation in the shortest time possible. We have discussed a great deal related to the AEM architecture for better understanding.

We also have seen AEM can be included in your Eclipse IDE to develop. Alongside, we have tried to understand what it takes to configure the plugin on Eclipse IDE. We also have discussed in detail about the features that AEM brings to the table. We have discussed in detail about the use cases where AEM finds its usage and also understood the various roles that an AEM developer is expected to play in the actual development process. We have taken utmost care in providing the most accurate details in this article, but we would still advise going through the official documentation before you make any purchase decisions.

 

WhatsApp chat

Schedule a demo

We will schedule the demo with an expert trainer as per your time convenience.

Have a query?

we'd love to assist and help you on anything related to IT courses.