Bootstrap Your AEM Project with Best Practices using AEM Project Archetype

AEM 5 Minutes

Problem statement:

How to create a new AEM project?
A company is struggling to establish an efficient and standardized starting point for its Adobe Experience Manager (AEM) projects. They find that each project takes too long to set up and lacks consistency in terms of best practices and architecture. Additionally, the lack of a streamlined starting point makes it difficult for developers and content authors to collaborate effectively, leading to delays and errors in the project timeline. The company is looking for a solution to create a consistent, best-practices-based AEM project template that can be used as a starting point for all their website projects.

Requirement:

Create a new project which is production ready and can be deployed without any hiccups

Introduction:

The AEM Project Archetype is a Maven template that creates a minimal, best-practices-based Adobe Experience Manager (AEM) project as a starting point for your website.

Features

  • Best Practice: Bootstrap your site with all of Adobe’s latest recommended practices.
  • Low-Code: Edit your templates, create content, deploy your CSS, and your site is ready for go-live.
  • Cloud-Ready: If desired, use AEM as a Cloud Service to go live in a few days and ease scalability and maintenance.
  • Dispatcher: A project is complete only with a Dispatcher configuration that ensures speed and security.
  • Multi-Site: If needed, the archetype generates the content structure for a multi-language and multi-region setup.
  • Core Components: Authors can create nearly any layout with our versatile set of standardized components.
  • Editable Templates: Assemble virtually any template without code, and define what the authors are allowed to edit.
  • Responsive Layout: On templates or individual pages, define how the elements reflow for the defined breakpoints.
  • Header and Footer: Assemble and localize them without code, using the localization features of the components.
  • Style System: Avoid building custom components by allowing authors to apply different styles to them.
  • Front-End Build: Front-end developers can mock AEM pages and build client libraries with Webpack, TypeScript, and SASS.
  • WebApp-Ready: For sites using React or Angular, use the SPA SDK to retain the in-context authoring of the app.
  • Commerce Enabled: For projects that want to integrate AEM Commerce with commerce solutions like Magento using the Commerce Core Components.
  • Example Code: Check out the HelloWorld component, and the sample models, servlets, filters, and schedulers.
  • Open Sourced: If something is not as it should be, contribute your improvements!

New Project setup

Create a new project structure using AEM Archetype 30 for AEM 6.5

The latest archetype can be found here: https://github.com/adobe/aem-project-archetype

mvn -B archetype:generate 
 -D archetypeGroupId=com.adobe.aem \
 -D archetypeArtifactId=aem-project-archetype \
 -D archetypeVersion=30 \
 -D appTitle="My Site" \
 -D appId="mysite" \
 -D groupId="com.mysite"

Group ID should be something like this:

com.<Company-name>.www or org.<Company-name>.www

artifact ID should be something like the project name like:

<company-name> or <project-name>

If you are using an amp or data layer for tracking please add

-D amp=y
-D datalayer=y

To enable more modules, refer: https://github.com/adobe/aem-project-archetype

Please make sure we add the following gitignore to ignore some of the IDE related files

### Java ###
*.class

# Mobile Tools for Java (J2ME)
.mtj.tmp/

# Package Files #
*.jar
*.war
*.ear

# virtual machine crash logs, see http://www.java.com/en/download/help/error_hotspot.xml
hs_err_pid*


### Intellij ###
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm

*.iml
.repo

## Directory-based project format:
.idea/
.svn/

# if you remove the above rule, at least ignore the following:

# User-specific stuff:
# .idea/workspace.xml
# .idea/tasks.xml
# .idea/dictionaries

# Sensitive or high-churn files:
# .idea/dataSources.ids
# .idea/dataSources.xml
# .idea/sqlDataSources.xml
# .idea/dynamic.xml
# .idea/uiDesigner.xml

# Gradle:
# .idea/gradle.xml
# .idea/libraries

# Mongo Explorer plugin:
# .idea/mongoSettings.xml

## File-based project format:
*.ipr
*.iws

## Plugin-specific files:

# IntelliJ
/out/

# mpeltonen/sbt-idea plugin
.idea_modules/

# JIRA plugin
atlassian-ide-plugin.xml

# Crashlytics plugin (for Android Studio and IntelliJ)
com_crashlytics_export_strings.xml
crashlytics.properties
crashlytics-build.properties


### SublimeText ###
# cache files for sublime text
*.tmlanguage.cache
*.tmPreferences.cache
*.stTheme.cache

# workspace files are user-specific
*.sublime-workspace

# project files should be checked into the repository, unless a significant
# proportion of contributors will probably not be using SublimeText
# *.sublime-project

# sftp configuration file
sftp-config.json


### Eclipse ###
*.pydevproject
.metadata
.gradle
bin/
tmp/
*.tmp
*.bak
*.swp
*~.nib
local.properties
.settings/
.loadpath

# Eclipse Core
.project

# External tool builders
.externalToolBuilders/

# Locally stored "Eclipse launch configurations"
*.launch

# CDT-specific
.cproject

# JDT-specific (Eclipse Java Development Tools)
.classpath

# PDT-specific
.buildpath

# sbteclipse plugin
.target

# TeXlipse plugin
.texlipse

# Brackets projects
.brackets.json

### Maven ###
pom.xml.tag
pom.xml.releaseBackup
pom.xml.versionsBackup
pom.xml.next
release.properties
dependency-reduced-pom.xml
buildNumber.properties

### Vagrant ###
.vagrant/

### SASS ###
.sass-cache/

### NPM ###
/view/prototype-dist/
**/node_modules/
node/

### .env ###
.env

### Progressive components ###
/**/*.gen.*

### Git ###
*.orig

### OSX ###
.DS_Store
vendor/css/*.css
*.gen.js
*.gen.html

### DO NOT IGNORE THIRD PARTY BUNDLE JARS ###


### Temp markdown files ###
.README.md.html

### AMS version helper

### acache httpd logs
apache/httpd/logs
apache/logs

Based on your requirements remove unwanted modules:

Dispatcher, tests modules (usually most of the projects having multiple people working on multiple sites usually keep dispatcher modules separate, and fast pace projects won’t get time to write unit test cases, which is highly recommended)

Update the POM.xml
Update the versions:
<modelVersion>4.0.0</modelVersion>
<groupId>com.mysite</groupId>
<artifactId>mysite</artifactId>
<packaging>pom</packaging>
<version>1.0.0-SNAPSHOT</version>
<name>My Site</name>
<description>My Site</description>
Update the core component version to the latest :

Core component’s latest version

<properties>
        <aem.host>localhost</aem.host>
        <aem.port>4502</aem.port>
        <aem.publish.host>localhost</aem.publish.host>
        <aem.publish.port>4503</aem.publish.port>
        <sling.user>admin</sling.user>
        <sling.password>admin</sling.password>
        <vault.user>admin</vault.user>
        <vault.password>admin</vault.password>
        <frontend-maven-plugin.version>1.12.0</frontend-maven-plugin.version>
        <core.wcm.components.version>2.17.0</core.wcm.components.version>
        <bnd.version>5.1.2</bnd.version>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
        <componentGroupName>My Site</componentGroupName>
    </properties>
Maven compiler to 11 if you are using JDK 11:
<plugin>
   <groupId>org.apache.maven.plugins</groupId>
   <artifactId>maven-compiler-plugin</artifactId>
   <configuration>
      <source>1.8</source>
      <target>1.8</target>
   </configuration>
</plugin>

If we don’t update you won’t be able to use JDK 11 features To make sure you are using JDK 11

<release>11</release>

Add Jetbrains dependency for adding @null or @Nullable annotations:

<meta charset="utf-8"><dependency>
   <groupId>org.jetbrains</groupId>
   <artifactId>annotations</artifactId>
   <version>17.0.0</version>
</dependency>

Published by Kiran Sg

My name is Kiran SG. I am currently working as an AEM architect and handling site revamp and migration. I try to learn new tricks and techniques every day to improve my coding and deliver value-added projects. All the tricks and techniques sometimes seem to be straightforward working code with best practices. But sometimes it won't satisfy the developer's needs. But most of the time code is either lagging to meet the requirement or doesn't follow best practices. Hence I am taking the initiative to put all my learnings and tricks in my blog series to share the working code with best practices. Hoping to help other developers like me. I have been working on AEM for 8 years now. I started my career as a Java developer. I have delivered many projects with a core customer-centric and strong focus on infrastructure and architecture. If you have any queries related to my blog topics please do connect with me directly on my email and also you can connect with me over LinkedIn and Facebook.

Published

Leave a Reply

Fill in your details below or click an icon to log in:

Gravatar
WordPress.com Logo

You are commenting using your WordPress.com account. ( Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. ( Log Out /  Change )

Cancel

Connecting to %s