Musings on SharePoint, Adobe CQ, ECM, and more…

CQ5 Development – How to setup a new CQ application/project

This series of articles aims to help you start with Adobe AEM (aka CQ5) development. I will demonstrate how to implement the following using AEM 5.6:

  • Setup a new CQ application/site
  • Create a CQ Template
  • Create a Page rendering Component
  • Create Pages in CQ

Setup a new CQ application/projects

CQ application comprises of elements like Templates, Components, OSGi bundles and static files. All these elements are grouped together to form a application or a project and are stored at a specific location with in JCR repository. Most often, new projects are created under the /apps directory. Adobe suggests to set up a following folder structure:

/apps/ – Contains for your application
/apps/ /components – Container for all the components in a CQ application. Create child folders to organise the components further.
/apps/ /templates – Container for all the templates in a CQ application
/apps/ /src – OSGi bundle build structure
/apps/ /install – Compiled OSGi bundle container

Here are the steps to create the recommended folder structure:

1. Login to your CQ environment and go to CRXDE Lite (Ex: www.your-domain.com/crxde)
2. Right click on /apps folder and select “Create Folder”
2. Enter the name of your application/project “awesomeapp” in create folder dialog.
3. Create child folders under “awesomeapp” and name them as “components”, “templates”, “src” and “install”.

Final folder structure should look like the one shown in the image below:

Adobe CQ Application Folder Structure

Always organize your components and templates in a way that that best suited for your project and most importantly allows you to easily maintain them.

Praveen Modi

Praveen works at Razorfish which is one of the largest digital advertising agency in the world. His mantra for life is "You are never too old to set another goal or to dream a new dream". He lives in sunny Austin, TX with his beautiful wife Nidhi and son Aariv.

2 Comments

  1. I can’t see my component once I select it form the edit mode and then after I drag into my parsys. Can you give me an insight to whats going on…

Leave a Reply

WP-SpamFree by Pole Position Marketing