js (JavaScript) AEM Headless SDK for. Author in-context a portion of a remotely hosted React. ” Source This is a very good sign and we are excited what the future will bring for AEM Headless with GraphQL. 5 Developing Guide Updating your Content Fragments for Optimized GraphQL Filtering Updating your Content Fragments for optimized GraphQL Filtering Last update: 2023-10-02Below is a summary of how the Next. Install the AEM SDK, add sample content and deploy an application that consumes content from AEM using its GraphQL APIs. This endpoint can use all Content Fragment Models from all Sites configurations (defined in the Configuration Browser ). . Navigate to Tools > GraphQL Query Editor and choose our endpoint for the drop down in the top-right of the window. AEM 6. Developer. 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. CORSPolicyImpl~appname-graphql. Headless implementation forgoes page and component management, as is traditional in. Cloud Service; AEM SDK; Video Series. Nov 7, 2022. 5. Tap the ellipsis next to the environment in the Environments section, and select Developer Console. In this video you will: Understand the power behind the GraphQL language. Frame Alert. contributorList is an example of a query type within GraphQL. Tap the Technical Accounts tab. Manage GraphQL endpoints in AEM. This guide uses the AEM as a Cloud Service SDK. Introduction to AEM Headless; Developer Portal (Additional Resources) Best Practices - Setup and Use;. Headless and AEM; Headless Journeys. com An end-to-end tutorial illustrating how to build-out and expose content using AEM’s GraphQL APIs and consumed by an external app, in a headless CMS scenario. jar) to a dedicated folder, i. Using a REST API. 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. Some content is managed in AEM and some in an external system. Contribute to deepakkhetawat/aem-rockstar-2022 development by creating an account on GitHub. Welcome to the tutorial on building a web experience using React, fully powered by AEM Headless APIs and GraphQL. The AEM Headless Client for Java is used to execute the GraphQL queries and map data to Java objects to power the app. js v18; Git; 1. Overview; 1 - Content modeling; 2 - AEM Headless APIs and. adobe. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample. This tutorial explores how AEM’s GraphQL APIs and headless capabilities can be used to power the experiences surfaced in an external app. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools. The full code can be found on GitHub. Documentation AEM 6. In this tutorial, we’ll guide you through the process of creating a dynamic and interactive web application by combining the power of React, Adobe Experience Manager (AEM) Headless APIs, and GraphQL. Created for: Beginner. The configured AEM service’s host/domain is then used to construct the AEM GraphQL API URLs and Image URLs. @JakeCham No GraphQL APIs are not limited to Cloud version of AEM. Headless Developer Journey: Explore this guided journey through the powerful and flexible headless features of AEM to prepare for your first headless project. The GraphiQL tool also enables users to persist or save queries to be used by client applications in a production setting. The use of AEM Preview is optional, based on the desired workflow. GraphiQL is included in all environments of AEM (but will only be accessible/visible when you configure your endpoints). For the purposes of this getting started guide, you only must create one. Navigate to the Software Distribution Portal > AEM as a Cloud Service. Brightspot, our API based CMS and DAM has developer tools for writing. AEM as a Cloud Service and AEM 6. 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. Instead, it provides an API for developers to access and retrieve content, which can be displayed on any device or platform. Navigate to Tools > GraphQL. Content fragment via asset API (demo) Content fragment via graphql (demo) Some real-time use cases around using content fragments and their approaches. Welcome to the tutorial on building a web experience using React, fully powered by AEM Headless APIs and GraphQL. These remote queries may require authenticated API access to secure headless content delive AEM Headless quick setup using the local AEM SDK. js app is built, how it connects to AEM Headless to retrieve content using GraphQL persisted queries, and how that data is presented. Content models. : Guide: Developers new to AEM and headless: 1. 5 Developing Guide Using the GraphiQL IDE Last update: 2023-11-07 Topics:. An implementation of the standard GraphiQL IDE is available for use with the GraphQL API of Adobe Experience Manager (AEM) as a Cloud Service. Let’s test the new endpoint. x version is compatible with GraphQL APIs. The multi-line text field is a data type of Content Fragments that enables authors to create rich text content. Created for: Beginner. A name will be automatically generated based on the title and adjusted according to AEM naming conventions. An end-to-end tutorial illustrating how to build-out and expose content using AEM's GraphQL APIs and consumed by an external app, in a headless CMS scenario. If a filter addresses the fields of a nested fragment, AEM has to fall back to loading (into memory) all fragments that share the underlying model. Learn how to query a list of Content. AEM Headless clients operating in a production capacity typically interact with AEM Publish, which contains the approved, published content. In previous releases, a package was needed to install the GraphiQL IDE. Documentation AEM 6. Headless AEM, or “decoupled” AEM, is Adobe Experience Manager’s approach to content delivery that separates the content from the presentation layer. AEM GraphQL API for use with Content Fragments. Learn how to create, manage, deliver, and optimize digital assets. Developer. . GraphQL API. Headless implementation forgoes page and component. The Content author and other. Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). 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. AEM Headless Developer Portal; Overview; Quick setup. The AEM Headless SDK is set of libraries that can be used by clients to quickly and easily interact with AEM Headless APIs over HTTP. The AEM Headless SDK is set of libraries that can be used by clients to quickly and easily interact with AEM Headless APIs over HTTP. 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. An implementation of the standard GraphiQL IDE is available for use with the GraphQL API of Adobe Experience Manager (AEM). GraphQL Request is another lightweight graphql client with good features and ease of use. Using this path you (or your app) can: receive the responses (to your GraphQL queries). The following configurations are examples. The AEM Headless SDK is set of libraries that can be used by clients to quickly and easily interact with AEM Headless APIs over HTTP. View. See how AEM powers omni-channel experiences. Now that you have created some content fragments, you can use AEM’s APIs to deliver them headlessly. Ensure you adjust them to align to the requirements of your project. This setup establishes a reusable communication channel between your React app and AEM. GraphQL Persisted Queries. 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. Headless CMS development. Next. The following tools should be installed locally: JDK 11; Node. Persisted GraphQL queries. 5. 1 - Modeling Basics; 2 - Advanced Modeling; 3 - Creating GraphQL Queries; 4 - Content Fragment Variations; 5 - GraphQL Endpoints; 6 - Author and Publish Architecture; 7 - GraphQL Persisted. The AEM Headless SDK is available for various platforms: AEM Headless SDK for client-side browsers (JavaScript) AEM Headless SDK for server-side/Node. : Guide: Developers new to AEM and headless: 1. Preview URLs, using URL expressions, are set on the Content Fragment Model’s Properties. Content Fragments are used in AEM to create and manage content for the SPA. Anatomy of the React app. Using the GraphiQL IDE in AEM | Adobe Experience Manager Documentation AEM 6. Learn about the new headless capabilities with the most recent Content Fragment enhancements. supports headless CMS scenarios where external client applications render experiences using content managed in AEM. IMS Groups are synced with AEM when users login. Beginner. zip. View the source code on GitHub. React is a popular JavaScript library for building user interfaces, known for its simplicity, reusability, and component-based architecture. Headless CMS with AEM: A Complete Guide You might have already heard about Headless CMS and you may be wondering if you should go “all-in” with this new model. AEM creates these based. Know the prerequisites for using AEM’s headless features. Persisted GraphQL queries. Ensure you adjust them to align to the requirements of your. Following AEM Headless best practices, the Next. Headful and Headless in AEM. Learning to use GraphQL with AEM - Sample Content and QueriesThe GraphiQL Explorer tool enables developers to create, and test queries against content on the current AEM environment. Install the AEM SDK, add sample content and deploy an application that consumes content from AEM using its GraphQL APIs. Learn how to define and use Content Fragments in Adobe Experience Manager (AEM) for use with GraphQL. The SPA retrieves this content via AEM’s GraphQL API. You will learn how to set up dependencies, design the component structure, retrieve and parse Content Fragments, and make the app editable using the. They let you prepare content ready for use in multiple locations/over multiple channels, ideal for headless delivery. Limited content can be edited within AEM. Persisted queries. The SPA. Once headless content has been translated, and. Some content is managed in AEM and some in an external system. Content Fragments are used in AEM to create and manage content for the SPA. js v18; Git; 1. select the Endpoint appropriate to the Sites configuration that you want to use for your queries; directly input new queries; create, and access, Persisted Queries run your queries to immediately see the the results; manage Query Variables; save, and. Usually, it relies on invalidation techniques that ensure that any content changed in AEM is properly updated in the Dispatcher. You can still optimize such GraphQL queries by combining filter expressions on fields of top-level fragments and those on fields of nested fragments with the AND operator. For GraphQL queries with AEM, there are a few extensions: If you require a single result: use the model name; for example, city; If you expect a list of results: add List to the model name; for example, cityList 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. Tap in the Integrations tab. This guide describes how to create, manage, publish, and update digital forms. This guide uses the AEM as a Cloud Service SDK. AEM Headless supports a offset/limit and cursor-based pagination queries to smaller subsets of a larger result set. The following are required to follow this quick setup: AEM as a Cloud Service Sandbox environment. 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. Cloud Service; AEM SDK; Video Series. This document provides an overview of the different models and describes the levels of SPA integration. 5 Developing Guide Updating your Content Fragments for Optimized GraphQL Filtering Updating your Content Fragments for optimized GraphQL Filtering Last update: 2023-10-02Created for: User. This guide uses the AEM as a Cloud Service SDK. 3 - Explore the AEM GraphQL API; 4 - Persisted GraphQL Queries; 5 - Client Application Integration; Headless First Tutorial. Adobe Experience Manager projects can be implemented in both headful and headless models, but the choice is not binary. In the query editor,. To accelerate the tutorial a starter React JS app is provided. If auth param is a string, it's treated as a Bearer token. Persisted queries are GraphQL queries that are created and stored on the Adobe Experience Manager (AEM) server. Virtual Event - AEM GEMs feature two of our customers presenting a technical deep dive session on the usage of AEM as Headless. Supply the web shop with limited content from AEM via GraphQL. impl. Log into AEM as a Cloud Service and access the GraphiQL interface: You can access the query editor from either: Tools-> General-> GraphQL Query Editor Hello, I am trying to install and use Graph QL in AEM 6. Manage GraphQL endpoints in AEM. Headless implementation forgoes page and component management, as is traditional in. 0+ version supports GraphQL API to expose the Content Fragment to enable the headless content experience. In the future, AEM is planning to invest in the AEM GraphQL API. In the basic tutorial multi-step GraphQL tutorial, you used the GraphiQL Explorer to test and refine the GraphQL queries. 5 and Headless. The following diagram illustrates the overall architecture for AEM Content Fragments. 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. What you need is a way to target specific content, select what you need and return it to your app for further processing. 1 - Modeling Basics; 2 - Advanced Modeling; 3 - Creating GraphQL Queries; 4 - Content Fragment Variations; 5 - GraphQL Endpoints; 6 - Author and Publish Architecture; 7 - GraphQL Persisted. Overview; 1 - Create Content Fragment Models; 2 - Author Content Fragments; 3 - Explore the AEM GraphQL API; 4 - Persisted GraphQL Queries; 5 - Client Application Integration; Headless First Tutorial. An end-to-end tutorial illustrating how to build-out and expose content using AEM's GraphQL APIs and consumed by an external app, in a headless CMS scenario. This tutorial explores how AEM’s GraphQL APIs and headless capabilities can be used to power the experiences surfaced in an external app. Persisted GraphQL queries help reduce query execution performance by utilizing the Content Delivery Network (CDN). 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. AEM Headless clients operating in a production capacity typically interact with AEM Publish, which contains the approved, published content. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. Prerequisites. A single-page application is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the webserver, instead of the default method of a web browser loading entire new pages. 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. The DAM Users is an out of the box group in AEM that can be used for “everyday” users that manage digital. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL Explorer. In this tutorial, we’ll guide you through the process of creating a dynamic and interactive web application by combining the power of React, Adobe Experience Manager (AEM) Headless APIs, and GraphQL. Allowing for bulk delivery of exactly what is needed for rendering as the response to a single API query. AEM provides a Translation Integration Framework for headless content, allowing Content Fragments and supporting assets to be easily translated for use across locales. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. AEM’s GraphQL APIs for Content Fragments. Welcome to the tutorial on building a web experience using React, fully powered by AEM Headless APIs and GraphQL. <any> . The AEM Headless SDK is available for various platforms: AEM Headless SDK for client-side browsers (JavaScript) AEM Headless SDK for server-side/Node. how it connects to AEM Headless to retrieve content using GraphQL persisted queries, and how that data is presented. Below is a summary of how the React application is built, how it connects to AEM Headless to retrieve content using GraphQL persisted queries, and how that data is presented. Following AEM Headless best practices, the React application uses AEM GraphQL persisted queries to. Last update: 2023-05-17. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL IDE. Created for: Beginner. Click Create and give the new endpoint a name and choose the newly created configuration. We’ll guide you through configuring your React app to connect to AEM Headless APIs using the AEM Headless SDK. This multi-part tutorial walks through the implementation of a React application for a fictitious lifestyle brand, the WKND. Retrieving an Access Token. Overview; 1 - Content modeling; 2 - AEM Headless APIs and. 5 is a flexible tool for the headless implementation model by offering three powerful services: Content Models. js (JavaScript) AEM Headless SDK for. What is Headless CMS CMS consist of Head and Body. We’ll guide you through configuring your React app to connect to AEM Headless APIs using the AEM Headless SDK. Moving forward, AEM is planning to invest in the AEM GraphQL API. We’ll guide you through configuring your React app to connect to AEM Headless APIs using the AEM Headless SDK. The response of a GET request can be cached at the Dispatcher and Content Delivery Network (CDN) layers, ultimately. Limited content can be edited within AEM. Some content is managed in AEM and some in an external system. Looking for a hands-on. 5. Navigate to Tools > GraphQL. To install WPGraphQL, navigate to your WordPress dashboard, then go to Plugins > Add New. Embed the web. In this tutorial, we’ll guide you through the process of creating a dynamic and interactive web application by combining the power of React, Adobe Experience Manager (AEM) Headless APIs, and GraphQL. To facilitate this, AEM supports token-based authentication of HTTP requests. 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. Run AEM as a cloud service in local to work with GraphQL query. 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. The following configurations are examples. Available for use by all sites. Provide a Model Title, Tags, and Description. Resource Description Type Audience Est. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. Community. The Story So Far. Content Fragments can be used as a basis for GraphQL for AEM queries as: They enable you to design, create, curate and publish. AEM 6. Learn. Learn how to create GraphQL queries to return content from Adobe Experience Manager (AEM) and how to use the GraphiQL tool to quickly test, refine, and debug queries. Following AEM Headless best practices, the iOS application uses AEM GraphQL persisted queries to. An end-to-end tutorial illustrating how to build-out and expose content using AEM Headless. An end-to-end tutorial illustrating how to build-out and expose content using AEM's GraphQL APIs and consumed by an external app, in a headless CMS scenario. 1. They allow you to prepare content ready for use in multiple locations/over multiple channels, ideal for headless delivery. References to other content, such as images or other Content Fragments can be dynamically inserted in-line within the flow of the text. AEM Headless Developer Portal; Overview; Quick setup. Introduction to AEM Headless; Developer Portal (Additional Resources) Best Practices - Setup and Use;. Content Fragment models define the data schema that is. Create Content Fragments based on. Please find help doc on setting up AEM6. If auth param is an array, expected data is ['user', 'pass'] pair, and Basic Authorization will be used. AEM Headless as a Cloud Service. AEM’s GraphQL APIs for Content Fragments. ; The Content Fragment is an instance of a Content Fragment Model that represents a logical. AEM Headless as a Cloud Service. In the query editor,. Learn how to use Content Fragments in Adobe Experience Manager (AEM) as a Cloud Service with the AEM GraphQL API. Select the AEM as a Cloud Service development environment from the Eligible Deployment Environments select box. cors. 5's powerful headless capabilities like Content Models, Content Fragments, and the GraphQL API work together to enable you to manage your experiences centrally and serve them across channels. Courses Recommended courses Tutorials Certification Events Instructor-led training Browse content library View all learning options. Developer. js v18; Git; 1. If you see this message, you are using a non-frame-capable web client. 1. Developer. Content Fragments can be used as a basis for GraphQL for AEM queries as: They enable you to design, create, curate and. 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. You’ve also created a Content Fragment Model and Content Fragment, and defined a GraphQL endpoint and persisted query. js initializes and exports the AEM Headless Client used to communicate with AEM; src/api/usePersistedQueries. The following are required to follow this quick setup: AEM as a Cloud Service Sandbox environment. Using this path you (or your app) can: receive the responses (to your GraphQL queries). ) that is curated by the. Tap Create new technical account button. It is a content management system that does not have a pre-built front-end or template system. Persisted queries are GraphQL queries that are created and stored on the Adobe Experience Manager (AEM) server. All leading CMS products such as Drupal, WordPress, AEM and Sitecore, Kentico and others can also work in a “headless” mode. AEM creates these based on your content. Enable the update by setting the following variables for your instance using the Cloud Manager UI: Enables (!=0) or disables (0) triggering of Content Fragment migration job. Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). A modern content delivery API is key for efficiency and performance of Javascript-based frontend applications. The GraphQL API {#graphql-api} . Before going to. Log into AEM and from the main menu select Tools -> General -> Configuration Browser. Headless and AEM; Headless Journeys. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. Prerequisites. js (JavaScript) AEM Headless SDK for Java™. Typical AEM as a Cloud Service headless deployment. In this chapter, a new AEM project is deployed, based on the AEM Project Archetype. First, explore adding an editable “fixed component” to the SPA. x. NOTE. 3 Content Fragments & GraphQL. Headful and Headless in AEM. A headless CMS is a particular implementation of headless development. Overview; 1 - Create Content Fragment Models; 2 - Author Content Fragments; 3 - Explore the AEM GraphQL API; 4 - Persisted GraphQL Queries; 5 - Client Application Integration;. Below is a summary of how the React application is built, how it connects to AEM Headless to retrieve content using GraphQL persisted queries, and how that data is presented. 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. So, could you please pass your real AEM application use cases for usage of GraphQL API feature? Wanted to know about : 1: Business use cases 2: Content Fragment model, CF creation 3: Any Jav. Prerequisites Welcome to the tutorial on building a web experience using React, fully powered by AEM Headless APIs and GraphQL. You can still optimize such GraphQL queries by combining filter expressions on fields of top-level fragments and those on fields of nested fragments with the AND operator. GraphQL endpoints. Level 3: Embed and fully enable SPA in AEM. For example, to grant access to the. Updating your Content Fragments. 5 has enhanced its digital customer experience services by providing better content personalization, content fragment enhancements, and easier authoring. The following are examples of possible approaches for constructing URLs for AEM GraphQL API and image requests, for several popular headless frameworks and platforms. Provide a Title for your configuration. The CORS configuration must specify a trusted website origin alloworigin or alloworiginregexp for which access must be granted. Learn how to deep link to other Content Fragments within a. AEM offers the flexibility to exploit the advantages of both models in one project. Navigate to Tools > GraphQL Query Editor and choose our endpoint for the drop down in the top-right of the window. Download the latest GraphiQL Content Package v. Let’s test the new endpoint. Using the Access Token in a GraphQL Request. This document is designed to be viewed using the frames feature. Further information More information on. AEM GraphQL API requests. Developer. Dedicated Service accounts when used with CUG. This session will focus on the GraphQL API for Adobe Experience. In this chapter of Advanced concepts of Adobe Experience Manager (AEM) Headless, learn to work with tabs, date and time, JSON objects, and fragment references in Content Fragments. To address this problem I have implemented a custom solution. You are now ready to move on to the next tutorial chapter, where you will learn how to create an AEM Headless React application that consumes the Content Fragments and GraphQL endpoint you created in this chapter. Navigate to Tools > GraphQL Query Editor and choose our endpoint for the drop down in the top-right of the window. AEM Preview is the service that mimics AEM Publish in behavior, but has content published to it for preview or review purposes. References to other content, such as images or other Content Fragments can be dynamically inserted in-line within the flow of the text. Persisted queries. GraphiQL is included in all environments of AEM (but will only be accessible/visible when you configure your endpoints). ; Use GraphQL schema provided by: use the dropdown to select the required site/project. granite. AEM’s GraphQL queries can be written to provide URLs to images based on where the image is referenced from. Hello All, I am new to GraphQL features of AEM. Till now, not used GraphQL API in actual AEM application. Rich text with AEM Headless. Next, we’ll use the AEM Headless SDK to retrieve Content Fragment data from AEM’s GraphQL APIs. GraphiQL is an IDE, included in your AEM environment; it is accessible/visible after you. x. Caching AEM pages or fragments in the AEM Dispatcher is a best practice for any AEM project. We'll guide you through optimizing your AEM projects, measure external service impact, Create customized views and Gain insights, boost performance, and enhance issue resolution. Prerequisites. The React App in this repository is used as part of the tutorial. Last update: 2023-05-17. GraphQL for AEM - Summary of Extensions. The AEM GraphQL API implementation is based on the GraphQL Java libraries. If a new field is added to a Brightspot content type, the GraphQL schema will automatically reflect it. See AEM GraphQL API for use with Content Fragments for details. 5 is a flexible tool for the headless implementation model by offering three powerful services: Content Models. This Web Component/JS application demonstrates how to query content using AEM's GraphQL APIs using persisted queries. Prerequisites. Tap the ellipsis next to the environment in the Environments section, and select Developer Console. Tech Talk with Ritesh. With Adobe Experience Manager (AEM) as a Cloud Service, you can selectively access your Content Fragments, using the AEM GraphQL API, to return only the content that you need. how it connects to AEM Headless to retrieve content using GraphQL persisted queries, and how that data is presented. Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM).