As mentioned by Arun Patidar above, you can add additional scripts in your basepage component or the one that inherits it and handle the includes in those files. Prerequisites. The HTTP GET requests from the headless app to AEM’s GraphQL APIs must be configured to interact with the correct AEM service, as. 0. Objective. Rich text with AEM Headless. Learn about headless technologies, what they bring to the user experience, how AEM supports headless models, and how to implement your own headless development project from A to Z. AEM provides a Translation Integration Framework for headless content, allowing Content Fragments and supporting assets to be easily translated for use across locales. Dynamic navigation is implemented using Angular routes and added to an existing Header component. Headless and AEM; Headless Journeys. X. This method can then be consumed by your own applications. Run the following command to build and deploy the entire project to AEM: $ mvn clean install -PautoInstallSinglePackage. Using the AEM JSON exporter, you can deliver the contents of any AEM page in JSON data model format. Read real-world use cases of Experience Cloud products written by your peers. Becker (@ MarkBecker), Markus Haack (@ mhaack), and Jody Arthur This is the first part of a series of the new headless architecture for Adobe Experience Manager. Create your first React Single Page Application (SPA) that is editable in Adobe Experience Manager AEM with the WKND SPA. 0 or later Forms author instance. 2. 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?AEM Headless Content Author Journey - Overview; Authoring for Headless with AEM - An Introduction; Authoring Basics for Headless with AEM; Learn about using references in Content Fragments; Learn about defining Metadata and Tagging for Content Fragments; Implementing. Documentation. ” Tutorial - Getting Started with AEM Headless and GraphQL. For building code, you can select the pipeline you. Content Fragment Models Basics and Advanced features such as different Data types and respective usages. API Reference. . The following are examples of possible approaches for constructing URLs for AEM GraphQL API and image requests, for several popular headless frameworks and platforms. For AEM SPA Editor to integrate a SPA into it’s authoring context, a few additions must be made to the SPA. These tests are maintained by Adobe and are intended to prevent changes to custom application code from being deployed if it breaks core functionality. The following are required to follow this quick setup: AEM as a Cloud Service Sandbox environment. Recorded on November 6, 2023, they discuss the. Created for:. In Edit mode, add the Card component to the Layout Container: Drag and drop an image from the Asset finder onto the Card component: Open the Card component dialog and notice the addition of a Text Tab. AEM as a Cloud Service and AEM 6. These are pieces of content that are designed to be reused within AEM own channels or exposed over AEM’s headless APIs to be consumed by a mobile or IoT device. The following tools should be installed locally: JDK 11;. Using a REST API introduce challenges: Created for: Beginner. Setting Up AEM Headless Client: Create an AEM project using the AEM Project Archetype. AEM Headless Content Author Journey - Overview; Authoring for Headless with AEM - An Introduction; Authoring Basics for Headless with AEM; Learn about using references in Content Fragments; Learn about defining Metadata and Tagging for Content Fragments; Implementing. App Builder provides a way for customers to easily extend Adobe Experience Manager in various use cases: Middleware Extensibility - Connect external systems with Adobe applications building custom connectors or use a suite of pre-built integrations. Then Getting Started with AEM Headless as a Cloud Service described AEM Headless in the context of your own project. AEM_Forum. For AEM SPA Editor to integrate a SPA into it’s authoring context, a few additions must be made to the SPA. js initializes and exports the AEM Headless Client used to communicate with AEM; src/api/usePersistedQueries. For other programming languages, see the section Building UI Tests in this document to set up the test project. Rich text with AEM Headless. In this part of the AEM Headless Content Architect Journey, you can learn the (basic) concepts and terminology necessary to understand content modeling for headless content delivery with Adobe Experience Manager (AEM). Tap the ellipsis next to the environment in the Environments section, and select Developer Console. AEM Headless GraphQL Video Series Learn about AEM’s GraphQL capabilities through the in-depth walk-through of Content Fragments and and AEM’s GraphQL APIs and development tools. React App Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). In the second step, you map your UI components or use a public UI components library, such as Google Material UI or Chakra UI to style your forms. HTL Use the HTML Template Language (HTL) to create an enterprise-level web framework. A primary use case for The Adobe Experience Manager as a Cloud Service (AEM) GraphQL API for Content Fragment Delivery is to accept remote queries from third-party applications or services. AEM Headless single-page app (SPA) deployments involve JavaScript-based applications built using frameworks such as React or Vue, that consume and interact with content in AEM in a headless manner. 4. Once headless content has been translated,. Provides link to other generic actions; such as Search, Help, Experience Cloud Solutions, Notifications, and User Settings. AEM: GraphQL API. AEM GraphQL API requests. 924. js App. Adaptive Forms Core Components. The use of Android is largely unimportant, and the consuming mobile app. AEM Headless applications support integrated authoring preview. In this case, there are no AEM Templates, but AEM Components may be there connecting the new front end with AEM Data store. Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). Feel free to suggest topics that will be added in these sections to improve AEM CQ5 Tutorial list further for AEM Beginners and. With the ability to extract metadata from files uploaded to Experience Manager Assets, metadata management. 1. Creating a Configuration. The Headless implementation of AEM uses Content Fragments Models and Content Fragments to focus on the creation of structured, channel-neutral, and reusable fragments of content and their cross-channel delivery. AEM Local Development Access Tokens are used to accelerate the development of integrations with AEM as a Cloud Service that programmatically interacts with AEM Author or Publish services over HTTP. core-1. react. 5 Forms: Access to an AEM 6. Developer. 5 AEM Headless Journeys Learn Authoring Basics. The two only interact through API calls. Understand how to build and customize experiences using AEM’s powerful features by exploring these development and deployment topics. Using no Adobe Experience Manager coding, define structured content using Content Fragment Models, relationships between them,. Usually, it relies on invalidation techniques that ensure that any content changed in AEM is properly updated in the Dispatcher. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. How to know how many of Content Fragments and AEM Sites’ Templates are required for a specif. For publishing from AEM Sites using Edge Delivery Services, click here. The completed SPA, deployed to AEM, can be dynamically authored with traditional in. How to create. Adobe Developers Live Headless Breakout 2 - November 2023. Start building dynamic, responsive forms that work seamlessly across devices with Adobe Experience Manager Headless Adaptive Forms. Check both AEM and Sling plugins. The <Page> component has logic to dynamically create React components based on the . For publishing from AEM Sites using Edge Delivery Services, click here. html with . CTA Text - “Read More”. Last update: 2022-11-11. Product functional tests are a set of stable HTTP integration tests (ITs) of core functionality in AEM such as authoring and replication tasks. React environment file React uses custom environment files , or . Adaptive Forms Core Components. The completed SPA, deployed to AEM, can be dynamically authored with traditional in. AEM Headless Content Author Journey - Overview; Authoring for Headless with AEM - An Introduction; Authoring Basics for Headless with AEM; Learn about using references in Content Fragments; Learn about defining Metadata and Tagging for Content Fragments; Implementing. 4. This user guide contains videos and tutorials helping you maximize your value from AEM. Experience League Showcase. Community. . Ensure you adjust them to align to the requirements of your project. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample project, and a sample React App (a SPA) that consumes the content over AEM Headless GraphQL APIs. Chapter 7 of the tutorial uses a native Android Mobile App to consume content from AEM Content Services. After reading it, you should:This end-to-end tutorial continues the basic tutorial that covered the fundamentals of Adobe Experience Manager (AEM) Headless and GraphQL. Formerly referred to as the Uberjar; Javadoc Jar - The. This tutorial walks through the implementation of a Angular application for a fictitious lifestyle brand, the WKND. AEM components are used to hold, format, and render the content made available on your webpages. Click. Browse the following tutorials based on the technology used. Automatically create folders linked between Workfront and Experience Manager. Meet our. js: Execute SSR/ISR from AEM GraphQL API on a separate server that is not AEM. Learn how to bootstrap the SPA for AEM SPA Editor. Deeply Organized Tags - With the ability to create tags and sub-tags it becomes possible to. Documentation home. The classic UI was deprecated with AEM 6. For further details, see our. Attend local and virtual events. 14+. Log into AEM as a Cloud Service and from the main menu select Tools > General > Configuration Browser. model. Customers move constantly between multiple devices and platforms when interacting with brands today, and they expect those experiences to be seamless. Open the Program containing the AEM as a Cloud Service environment to integrate set up the Service Credentials for. The advanced tutorial illustrates in-depth aspects of working with Content Fragment Models, Content Fragments, and the AEM GraphQL persisted queries, including using the. ) that is curated by the. The completed SPA, deployed to AEM, can be dynamically authored with traditional in. The multi-line text field is a data type of Content Fragments that enables authors to create rich text content. The following Documentation Journeys are available for headless topics. For an AEM Headless Implementation, we create 1. This session is an invaluable. 10. Community. Next Steps. In the Location field, copy the installation URL. bartek_887. A modern content delivery API is key for efficiency and performance of Javascript-based frontend applications. AEM’s SPA Editor provides authors the ability to edit content for a Single Page Application or SPA. SPA Editor Overview. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and. View the source code on GitHub. The ImageRef type has four URL options for content references: _path is the referenced path in AEM. For example, C:aemauthor. AEM applies the principle of filtering all user-supplied content upon output. Read Full BlogExample applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). AEM Headless GraphQL Video Series Learn about AEM’s GraphQL capabilities through the in-depth walk-through of Content Fragments and and AEM’s GraphQL APIs and development tools. json (or . Each environment contains different personas and with. 5 or later; AEM WCM Core Components 2. . The AEM Forms Core Components project serves as accelerator to get started with projects using AEM Forms. For more details and code samples for AEM React Editable Components v2 review the technical documentation: Integration with AEM documentation; Editable component documentation; Helpers documentation; AEM pages. When constructing a Commerce site the components can, for example, collect and render information from the. The React App in this repository is used as part of the tutorial. AEM offers the flexibility to exploit the advantages of both models in one project. This tutorial will cover the following topics: Create content that represent an Event using Content Fragments Define an AEM Content Services end-points using AEM Sites’. AEM Headless is a CMS solution from Experience Manager that allows structured content (Content Fragments) in AEM to be consumed by any app over HTTP using GraphQL. Authorization. Discover the benefits of going headless and streamline your form creation process today. src/api/aemHeadlessClient. But, this doesn't list the complete capabilities of the CMS via the documentation. AEM Headless Developer Portal A collection of documentation, tutorials, and technical resources for developing applications using AEM Headless. The project contains re-useable Forms core components which are server-side rendered AEM components for dynamic experiences / data. X) the GraphiQL Explorer (aka GraphiQL IDE) tool needs to be manually installed, follow instruction from here. js in AEM, I need a server other than AEM at this time. AEM Headless tutorials - If you prefer to learn by doing and have existing knowledge of AEM, take our hands-on tutorials organized by API and framework, that explore creating and using applications built on AEM Headless. Use GraphQL schema provided by: use the drop-down list to select the required configuration. AEM 6. Persisted queries are GraphQL queries that are created and stored on the Adobe Experience Manager (AEM) server. With Adobe Experience Manager (AEM) as a Cloud Service, Content Fragments lets you design, create, curate, and publish page-independent content. Configuring the container in AEM. The CORS configuration must specify a trusted website origin alloworigin or alloworiginregexp for which access must be granted. Created for: User. This tutorial uses a simple native Android Mobile App to consume and display Event content exposed by AEM Content Services. Overview of the Tagging API. AEM as a Cloud Service lets you capitalize on the AEM applications in a cloud-native way, so that you can: Scale your DevOps efforts with Cloud Manager: CI/CD framework, autoscaling, API connectivity, flexible deployment modes, code quality gates, service delivery transparency, and guided updates. The Cloud Manager landing page lists the programs associated with your organization. AEM Headless Translation Journey - This documentation journey gives you a broad understanding of headless technology, how AEM serves headless content, and how you can translate it. Headless Architect Journey - Start here for an introduction to the powerful, and flexible, headless features of Adobe Experience Manager as a Cloud Service, and how to model content for your project. Implement and use your CMS effectively with the following AEM docs. Next. But it always fails at the "NON-PRODUCTION DEPLOYMENT" section, it stays on the status "Artifact is awaiting Deployment" for some time and then fail. Learn how to create and publish a headless form using Adobe Experience Manager's adaptive forms in this step-by-step guide. Headless Developer Journey: Explore this guided journey through the powerful and flexible headless features of AEM to prepare for your first headless project. mailer. e. js application demonstrates how to query content using AEM’s GraphQL APIs using persisted queries. With Adobe Experience Manager (AEM), Content Fragments let you design, create, curate, and publish page-independent content. Learn how to deep link to other Content Fragments within a rich text field. Looking for a hands-on. A CI/CD pipeline in Cloud Manager is a mechanism to build code from a source repository and deploy it to an environment. Experience League Showcase. Experience Cloud Advocates. AEM Headless Translation Journey - This documentation journey gives you a broad understanding of headless technology, how AEM serves headless content, and how you can translate it. Documentation AEM AEM Tutorials AEM Headless Tutorial Tutorial Set up The latest version of AEM and AEM WCM Core Components is always recommended. This end-to-end tutorial continues the basic tutorial that covered the fundamentals of Adobe Experience Manager (AEM) Headless and GraphQL. The Assets REST API is available on each out-of-the-box install of a recent Adobe Experience Manager as a Cloud Service version. This tutorial explores how AEM Content Services can be used to power the experience of an Mobile App that displays Event information (music, performance, art, etc. This involves structuring, and creating, your content for headless content delivery. Sign In. Caching AEM pages or fragments in the AEM Dispatcher is a best practice for any AEM project. In today’s series, we’re going to take a look at modeling basics in Adobe Experience Manager by first looking at the WKND Site. Documentation. Next Steps. The Angular app is developed and designed to be deployed with AEM’s SPA Editor, which maps Angular components to AEM components. Then Getting Started with AEM Headless described AEM Headless in the context of your own project. Chapter 6 of the AEM Headless tutorial covers ensuring all the necessary packages, configuration and content are on AEM Publish to allow consumption from the Mobile App. We’ll cover retrieving Content Fragment data from AEM’s GraphQL APIs and displaying it in the React app. AEM Headless Translation Journey - This documentation journey gives you a broad understanding of headless technology, how AEM serves headless content, and how. Learn how to create and publish a headless form using Adobe Experience Manager's adaptive forms in this step-by-step guide. SOLVED Persisted query - AEM grapql. This Next. The term “headless” comes from the concept of chopping the “head” (the front end, i. With the power of Adobe's headless CMS capabilities,. Connect AEM and Tags using existing (or new) IMS configuration. In this part of the onboarding journey, you learn how to access Cloud Manager so that you can set up your project resources. Headless Authoring Journey - Start here for a guided journey through the powerful and flexible headless features of AEM, their capabilities, and how to model your. It contains the following artifacts: The Quickstart jar - an executable jar file that can be used to set up both an author and a publish instance. Tap the Technical Accounts tab. Mark as New; Follow;. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. Tutorial Set up. Wanted to understand what are the integration steps for AEM Headless Integration with Adobe Target when using the AEP Web SDK. The AEM Headless Client for Java is used to execute the GraphQL queries and map data to Java objects to power the app. Connect with one of our experts. Clicking the name of your test in the Result panel shows all details. The diagram above depicts this common deployment pattern. To interact with those features, Headless provides a collection of controllers. With a headless implementation, there are several areas of security and permissions that should be addressed. 2. Select Create at the top-right of the screen and from the drop-down menu select Site from template. Adobe Experience Manager, the leading headless CMS* by Adobe Abstract Adobe Experience Manager is a headless CMS, who knew? Let's explore why organisations are evaluating headless content delivery and how AEM can help. Tap or click the rail selector and show the References panel. If you currently use AEM, check the sidenote below. Adobe Experience Manager Sites & More. Learn to author content and embed referenced content using a multi-line rich text editor with Adobe Experience Manager Content Fragments, and how rich text is delivered by AEM's GraphQL APIs as JSON to be consumed by headless applications. Click Install New Software. day. Developer. Implement AutoComplete Adaptive Form ; The list is not completed Yet, i will add more topics soon. For more detail on ContextHub, see the developer documentation. Populates the React Edible components with AEM’s content. A Title is mandatory. . Make sure the form is using “Custom AEM Forms PreFill Service” as the prefill service. In this post, Adobe Experience Cloud introduces its Adobe Experience Manager Headless Extension for PWA Studio that enables developers to leverage headless. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample project, and a sample React App (a SPA) that consumes the content over AEM Headless GraphQL APIs. 4. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. bat start. AEM makes it easy to manage your marketing content and assets. Developers using the React framework create a SPA and then map areas of the SPA to AEM components, allowing authors to use familiar AEM Sites editing tools. View the source code. alistairp781078. React - Remote editor. First, explore adding an editable “fixed component” to the SPA. ContextHub is a framework for storing, manipulating, and presenting context data. To determine the correct approach for managing build dependent configurations, reference the AEM Headless app’s framework (for example, React, iOS, Android™, and so on) documentation, as the approach varies by framework. Option 1: Centralize the logic and broadcast to the necessary components for example, by using a util class as a pure object-oriented solution. While client-side GraphQL queries can also be executed using HTTP POST requests, which cannot be cached, persisted queries can be cached. Due to this approach, a headless CMS does not. Select the required Template, then Next: Enter the Properties for your Experience Fragment. Production Pipelines: Product functional. It’s ideal for getting started with the basics. The touch-enabled UI is the standard UI for AEM. In the previous document of the AEM headless journey, Path to Your First Experience Using AEM Headless, you then learned the steps needed to implement your first project. 0) is planned for November 30, 2023. AEM 6. Configure the ContextHub toolbar to control whether it appears in Preview mode, to create ContextHub stores, and add UI modules. . CIF enables AEM to access an Adobe Commerce instance and communicate with Adobe Commerce via GraphQL. AEM has multiple options for defining headless endpoints and delivering its content as JSON. AEM Headless Translation Journey - This documentation journey gives you a broad understanding of headless technology, how AEM. Click Add…. . The response of a GET request can be cached at the Dispatcher and Content Delivery Network (CDN) layers, ultimately improving the performance. In addition to pure AEM-managed content CIF, a page can. View the. While client-side GraphQL queries can also be executed using HTTP POST requests, which cannot be cached,. Introduction AEM has multiple options for defining headless endpoints and delivering its content as JSON. An AEM project is required to setup-supporting configuration and content requirements to allow AEM SPA Editor to author a Remote SPA. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample project, and a React App that consumes the content over AEM Headless GraphQL APIs. Bootstrap the SPA. If you are new to either AEM or headless, see Adobe’s Headless Documentation Journeys for an end-to-end introduction to both headless and how AEM supports it. So in this regard, AEM already was a Headless CMS. With Headless Adaptive Forms, you can streamline the process of. See the AEM 6. Getting Started with AEM Headless as a Cloud Service;. As a result, I found that if I want to use Next. AEM 6. Chapter 6 -. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. Find out more about the summit here: LAB Title Scheduling Date & Time Speaker(s) L711 - Channel Tsunami: Surf the Wave of Automatic Content Creation. Implementing Applications for AEM as a Cloud Service; Using. AEM. AEM Headless Translation Journey - This documentation journey gives you a broad understanding of headless technology, how AEM serves headless content, and how you can translate it. Integrate AEM Author service with Adobe Target. Connectors User GuideHeadless Architect Journey - Start here for an introduction to the powerful, and flexible, headless features of Adobe Experience Manager as a Cloud Service, and how to model content for your project. Created for:. Documentation home. Get ready for Adobe Summit. AEM Interview Questions. AEM offers unprecedented flexibility, allowing you to exploit the advantages of both models for your project. Q: “How is the GraphQL API for AEM different from Query Builder API?” A: “The AEM GraphQL API offers total control on the JSON output, and is an industry standard for querying content. In today’s series, we’re going to take a look at modeling basics in Adobe Experience Manager by first looking at the WKND Site. Select the language root of your project. html for a generic one. Deploy the updates to a local AEM environment from the root of the project directory, using your Maven skills: $ cd aem-guides-wknd-spa $ mvn clean install -PautoInstallSinglePackage Update the Template Policy. Learn how to create relationships between Content Fragment Models in Adobe Experience Manager (AEM) and how to leverage these relationships in GraphQL queries. An AEM project is required to setup-supporting configuration and content requirements to allow AEM SPA Editor to author a Remote SPA. The React app should contain one. Content models. Your template is uploaded and can. Adobe Experience Manager as a Cloud Service’s Cross-Origin Resource Sharing (CORS) facilitates non-AEM web properties to make browser-based client-side calls to AEM’s GraphQL APIs, and other AEM Headless resources. Time; Headless Developer Journey: For developers new to AEM and headless technologies, start here for a comprehensive introduction to AEM and its headless features from the theory of headless through going live with your first headless project. View the source code. Adobe Experience Manager Sites & More. Overview. The engine’s state depends on a set of features (i. Meet our community of customer advocates. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. adobe. Implementing Applications for AEM as a Cloud Service; Using. This guide describes how to create, manage, publish, and update digital forms. Native integration with Adobe productsHeadful and Headless in AEM; Headless Experience Management. Experience Manager Assets is a world-class digital asset management system with built-in support for all digital media file types and native integration with the Adobe Creative Cloud. Open the Program containing the AEM as a Cloud Service environment to integrate set up the Service Credentials for. Learn how to use Content Fragments in Adobe Experience Manager (AEM) as a Cloud Service with the AEM GraphQL API for headless content delivery. Client type. Abstract. AEM as a Cloud Service and AEM 6. Single page applications (SPAs) can offer compelling experiences for website users. js-based SDK that allows the creation of React components, that support in-context component editing using AEM SPA Editor. The site is implemented using: Maven AEM Project. If auth param is a string, it's treated as a Bearer token. Developers want to be able to build sites using SPA frameworks and authors want to seamlessly edit content within AEM for a site built using such frameworks. Selected assets have a checkmark icon over them. Start here for a guided journey through the powerful and flexible headless features of AEM, their capabilities, and how to leverage them on your project. SOLVED Headless AEM. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. CORSPolicyImpl~appname-graphql. The latest version of AEM and AEM WCM Core Components is always recommended. They can also be used together with Multi-Site Management to. Learn how to create a SPA using the React JS framework with AEM's SPA Editor. The AEM Headless client, provided by the AEM Headless Client for JavaScript, must be initialized with the AEM Service host it connects to. Meet our community of customer advocates. This journey provides you with all the AEM Headless Documentation you. Headless Authoring Journey - Start here for a guided journey through the powerful and flexible headless features of AEM, their capabilities, and how. Questions. 5. Developer. AEM Headless Integration with Adobe Target. The advanced tutorial illustrates in-depth aspects of working with Content Fragment Models, Content Fragments, and the AEM GraphQL persisted queries, including using the. Discover the benefits of going headless and streamline your form creation process today. technical support periods. Headless Developer Journey: Explore this guided journey through the powerful and flexible headless features of AEM to prepare for your first headless project. DefaultMailService OSGI service:Adobe Experience Manager Community Lens 8th Edition, August 2023. This page provides an introduction to the logical architecture, the service architecture, the system architecture, and the development architecture for AEM as a Cloud Service. An end-to-end tutorial illustrating how to build-out and expose content using AEM Headless. Documentation. Get to know how to organize your headless content and how AEM’s translation tools work. AEM 6. Enter the following values on the Text tab: Card Path - choose a page beneath the SPA homepage. It uses the /api/assets endpoint and requires the path of the asset to access it (without the leading /content/dam). To view the results of each Test Case, click the title of the Test Case. infinity. The com. i18n Java™ package enables you to display localized strings in your UI. Documentation AEM 6. Learn about headless technologies, why they might be used in your project, and how to create. The configuration file must be named like: com. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. Remember that headless content in AEM is stored as assets known as Content Fragments. infinity.