Creating new components with no inheritance VS Extending base components (Future Proofing) | Community
Skip to main content
J
JoelLucuik
Level 3
November 22, 2016
Solved

Creating new components with no inheritance VS Extending base components (Future Proofing)

  • November 22, 2016
  • 5 replies
  • 2374 views

Hi,

 

Some context:

 

I just started a contract at CIC (Govt of Canada). Helping give some guidance to Serge, the UI Designer here. He has 3 weeks experience with AEM 6.2. Newbie.

I worked for Adobe doing AEM Tech Support in 2013. Getting back up to speed.

 

Serge is creating components following the government WET standards.

 

Serge asked for a strategy on creating new components (with little inheritance I gather) VS extending base components. His concern is primary future upgrades (to 6.3), and 

Adobe not supporting the components he extends. "Future Proofing" it.

 

Do you have any recommendations here? 

 

Thanks,

Joel

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by smacdonald2008

Hi Joel - He may want to look at the concept of Overlaying Components to modify out the box components to meet his requirements. 

https://docs.adobe.com/docs/en/aem/6-2/develop/platform/overlays.html

Overlaying is a best practice when you want to extend ootb components.  

5 replies

smacdonald2008
smacdonald2008Accepted solution
Level 10
November 22, 2016

Hi Joel - He may want to look at the concept of Overlaying Components to modify out the box components to meet his requirements. 

https://docs.adobe.com/docs/en/aem/6-2/develop/platform/overlays.html

Overlaying is a best practice when you want to extend ootb components.  

J
JoelLucuikAuthor
Level 3
November 22, 2016

Thanks Scott.

kautuk_sahni
Community Manager
kautuk_sahniCommunity Manager
Community Manager
November 23, 2016

What is a AEM overlay/override VS Extend a component?

Overlay/Override Component:
Creating a custom component by copying a foundation component to your project and modifying it based on the need. For example you copy image component from “/libs/foundation/components/image” to your site folder “/apps/testsite/components” by doing so you are creating a new component with is exactly same as Image component. After copying you can make changes to component based on your requirements. But the problem with this approach would be that if you are upgrading CQ then new version of CQ might have new implementation of “/libs/foundation/components/image” component than those changes will not be reflected in your “/apps/testsite/components/image” component, so you have to manually make those changes in custom component.

Extend Component:
Creating a custom component manually by creating all necessary nodes and setting value of “sling:superResourceType” property as “/libs/foundation/components/image”. By doing this you inherit all the feature of image component, even after upgrade you still inherit the features of image component.

Also please read documentation :- https://docs.adobe.com/docs/en/aem/6-2/develop/components.html

I hope this would help you.

~kautuk

Kautuk Sahni
J
JoelLucuikAuthor
Level 3
November 23, 2016

Thanks Kautuk for the thorough reply.

Sorry I am still waiting on getting a login here, so I can't try this stuff just yet.

Q: What is the advantage of overlay over extend? Docs say in Overlay you "Only redefine what is actually required". Are there limits to this? 

From what I've read, extend means you want most of the inherited functionality. 

So, for example, if I have component (main.jsp, child.jsp), and main.jsp includes child.jsp and I extend it to create myComponentA (“child.jsp”). Will myComponentA render properly?

We are debating on a conditional  includes in component(main.jsp), versus and overlay approach. And the team is still learning AEM.

Thanks

Joel

smacdonald2008
smacdonald2008
Level 10
November 23, 2016

Overlay you have more control - you move the given component from libs to apps and then you have control over the content under /apps. You can change app logic, the dialog, etc, 

Joel - if you want to have a call - i can help your team come up to speed with AEM. email me - scottm@adobe.com

Terms & ConditionsAccessibility statement

Loading footer...