How is the HTML that is generated by components represented in the repository? | Community
Skip to main content
kendalls5216292
kendalls5216292
Level 2
June 11, 2020
Solved

How is the HTML that is generated by components represented in the repository?

  • June 11, 2020
  • 3 replies
  • 4390 views

My knowledge of Sling and AEM is improving, but I'm still confused about a lot.

 

I have components and templates that produce HTML using JSP. The last part of the path looks like this in CRX/DE:

 

something/jcr:content/contentnode

 

contentnode has sling:resourceType=foundation/components/parsys

jcr:content has sling:resourceType=/apps/myapp/components/siteoutput/default/topicpage

something has jcr:primaryType=cq:Page

 

If I click on something, html is loaded into the browser with the last part of the path being something.html

 

So is the html only created when someone loads the node something into a web browser, or is it stored somewhere? I mean aside from any web server/web app caching.

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 Vaibhavi_J

Hi @kendalls5216292 , 

Any template or components renders based on sling resolution. 

Templates:

Any template has its page rendering component. Basically when you create the page by selecting the template, page rendering component will load the resources defined ie html css js etc 

Component:

When the component is added on the page, again similar sling resolution happens and content will be loaded

 

In short to make you understand in your scenario sling resolution steps added below. 

  • Once you load the page on browser path will be taken from /content/xyz/xyz(leaving the extension) 
  • Once you navigate to the above path in crx you can find the sling:resource type where path will be pointed to page rendering component that is,/apps/components /<component-name>
  • Resources are loaded from the component (you can see sling resolution document to understand which JSP will be selected) 

Also, to answer your another question, it is not only the html format will be rendered always. AEM supports other rendering formate as well ex JSON

Adobe documentation will explain this in detail. 

3 replies

Akash_Kapoor
Adobe Employee
Akash_KapoorAdobe Employee
Adobe Employee
June 11, 2020

Hi kendalls5216292 ,

 

Every page i.e a node of type cq:page in AEM is associated with a template that defines the page component used to render the page. This page component would contain the default HTML code which would be rendered when the page is called. You can refer to https://helpx.adobe.com/in/experience-manager/6-3/sites/developing/using/the-basics.html for understanding the basic sling script resolution.

    kendalls5216292
    kendalls5216292Author
    Level 2
    June 11, 2020
    I think I understand that much. In the slingbucks example, the content part has JSON and the app part has ESP scripts that create HTML from the JSON, data the user entered and structure in the ESP. In my case, there is only HTML structure created by JSP and associated CSS and Javascript. I see no content anywhere, so far. I think my guess in the last paragraph might be how it is represented, the content is somewhere I don't know and the JSP is given access to it and transforms it to generate HTML. That seems to match what you've said.
    Vaibhavi_J
    Vaibhavi_JAccepted solution
    Level 7
    June 12, 2020

    Hi @kendalls5216292 , 

    Any template or components renders based on sling resolution. 

    Templates:

    Any template has its page rendering component. Basically when you create the page by selecting the template, page rendering component will load the resources defined ie html css js etc 

    Component:

    When the component is added on the page, again similar sling resolution happens and content will be loaded

     

    In short to make you understand in your scenario sling resolution steps added below. 

    • Once you load the page on browser path will be taken from /content/xyz/xyz(leaving the extension) 
    • Once you navigate to the above path in crx you can find the sling:resource type where path will be pointed to page rendering component that is,/apps/components /<component-name>
    • Resources are loaded from the component (you can see sling resolution document to understand which JSP will be selected) 

    Also, to answer your another question, it is not only the html format will be rendered always. AEM supports other rendering formate as well ex JSON

    Adobe documentation will explain this in detail. 

      kendalls5216292
      kendalls5216292Author
      Level 2
      June 12, 2020

      Thanks. I do know the information you are mentioning. My case is unusual maybe because the components are being used to Render DITA content as part of the XML Documentation addon. The content is not in the JSP and it is nowhere that I have seen so far and that is the piece I don't know. I am guessing I can figure it out if I look at variables and parameters available to the JSP and look closely at the foundation components.

      VeenaVikraman
      Community Advisor
      VeenaVikramanCommunity Advisor
      Community Advisor
      June 12, 2020

      @kendalls5216292 I get your issue here. Totally understand where you are struggling. Since I understand from your post that you are a beginner in AEM , I would first recommend you to go through the Basic AEM architecture. The answer to your entire question resides with the basic architecture of AEM. I searched for the official docs on this but couldn't find it in google search so sharing this instead. https://www.zarantech.com/blog/aem-architecture-explained/ it's the same.

       

      Now coming back to your question, the issue you are struggling here to understand is called Sling Resolution or Sling Resource Resolution. I had recently tried to explain the same with some example in my Linkedin

      I would recommend you to read this and let me know any more question on this and we will be happy to help. 

       

      Happy development 😉

      Veena ✌

        Terms & ConditionsAccessibility statement

        Loading footer...