Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

WKND Tutorial - Getting Started with AEM Headless - Content Services

Avatar

Level 10

Hi all,

 

I am following this topic at https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/c....

 

1. Using Content Fragment and Editable Template, we could expose either JSON or end HTML to the Front End invoking application and if the Front End invoking application invokes JSON, it gets JSON and if it invokes HTML it gets HTML correct?

2. In the first case of exposing JSON, AEM components need not be integrated with HTML in AEM and in the case of exposing HTML, they need to be? If front end gets JSON it integrates this JSON with HTML?

3. In this tutorial I understood Content Fragment with Event Title, Even Image, etc. It represents what will be displayed on the mobile. But going from here, I am not able to understand how the Template is designed. It has Logo, Tagline and Events. Please guide me.

 

I highly appreciate all your support.

 

Thanks,

Rama.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @AEM_Forum,

Please find my responses in bold inline to your queries

1. Using Content Fragment and Editable Template, we could expose either JSON or end HTML to the Front End invoking application and if the Front End invoking application invokes JSON, it gets JSON and if it invokes HTML it gets HTML correct?

Using Content Fragment and Editable template, we could expose the content as JSON and not as HTML.

2. In the first case of exposing JSON, AEM components need not be integrated with HTML in AEM and in the case of exposing HTML, they need to be? If front end gets JSON it integrates this JSON with HTML?

AEM components are with HTML (HTL/sightly) and is backed by Sling Model with Jackson Exporter to export the content as JSON. Front end or the consuming app will make use of the authored content via exposed JSON. Markup/HTML rendered in App is per the design from the app. Only the content that is to be part of it will be used from the JSON (Example : front end app has markup say, <p>{{sometext}}<p> - sometext in this case is used from the JSON API)

With respect to the tutorial, Events details alone is from AEM and the UI to display the events based on the desired look and feel is from the app.

3. In this tutorial I understood Content Fragment with Event Title, Even Image, etc. It represents what will be displayed on the mobile. But going from here, I am not able to understand how the Template is designed. It has Logo, Tagline and Events. Please guide me.

Chapter 4 of the shared tutorial explains the Template definition. Editable template is created from Template-type which is backed by Page rendering component

Once when the template is created, Image(Logo), Text(Tagline) and Content Fragment(Events) components are added to the template, for us to author the desired content at page level (when page is created using that template)

Let me know if you are looking for any specific information.

View solution in original post

1 Reply

Avatar

Correct answer by
Community Advisor

Hi @AEM_Forum,

Please find my responses in bold inline to your queries

1. Using Content Fragment and Editable Template, we could expose either JSON or end HTML to the Front End invoking application and if the Front End invoking application invokes JSON, it gets JSON and if it invokes HTML it gets HTML correct?

Using Content Fragment and Editable template, we could expose the content as JSON and not as HTML.

2. In the first case of exposing JSON, AEM components need not be integrated with HTML in AEM and in the case of exposing HTML, they need to be? If front end gets JSON it integrates this JSON with HTML?

AEM components are with HTML (HTL/sightly) and is backed by Sling Model with Jackson Exporter to export the content as JSON. Front end or the consuming app will make use of the authored content via exposed JSON. Markup/HTML rendered in App is per the design from the app. Only the content that is to be part of it will be used from the JSON (Example : front end app has markup say, <p>{{sometext}}<p> - sometext in this case is used from the JSON API)

With respect to the tutorial, Events details alone is from AEM and the UI to display the events based on the desired look and feel is from the app.

3. In this tutorial I understood Content Fragment with Event Title, Even Image, etc. It represents what will be displayed on the mobile. But going from here, I am not able to understand how the Template is designed. It has Logo, Tagline and Events. Please guide me.

Chapter 4 of the shared tutorial explains the Template definition. Editable template is created from Template-type which is backed by Page rendering component

Once when the template is created, Image(Logo), Text(Tagline) and Content Fragment(Events) components are added to the template, for us to author the desired content at page level (when page is created using that template)

Let me know if you are looking for any specific information.