Integrate Publive CDS API with your frontend framework
Use the Content Delivery Service (CDS) API to power your website or application. These guides show you how to fetch and display content from Publive using popular frontend frameworks.
Availability
API access is available on the Custom Enterprise plan only. API access is a paid feature. Your agreement sets the cost.To get API access or to add API users, contact support@thepublive.com.
Security: Never expose your API credentials in client-side code. Always make API calls from your server or serverless functions.
Last modified on October 21, 2026
Was this page helpful?
{"docsConfig":{"theme":"aspen","$schema":"https://mintlify.com/docs.json","name":"Publive Docs","description":"Docs for Publive DXP and AXP: the headless CMS for digital publishers, and the platform that makes brands visible and citable in ChatGPT, AI Overviews, Perplexity, and Gemini.","colors":{"primary":"#146EF5","light":"#146EF5","dark":"#15171a"},"logo":{"light":"https://cdn.prod.website-files.com/66826ebfedcc2d4a07df740c/6682747dedcc2d4a07e30c0e_publive-logo.svg","dark":"https://img-cdn.publive.online/publive/logo/publive-white-full-logo.svg"},"favicon":"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/27/favicon-2026-07-27-13-26-45.svg","api":{"openapi":["openapi/content-delivery.json","openapi/content-management.json","openapi/media-register-url.json","openapi/media-upload-file.json"],"mdx":{"auth":{"method":"basic"}}},"appearance":{"default":"light","strict":false},"navbar":{"links":[{"href":"mailto:support@thepublive.com","label":"Support"}],"primary":{"type":"button","label":"Dashboard","href":"https://dashboard.thepublive.com/v2"}},"footer":{"socials":{"website":"https://thepublive.com","x":"https://x.com/the_Publive","github":"https://github.com/ThePublive","linkedin":"https://in.linkedin.com/company/the-publive"}},"search":{"prompt":"Search Publive docs..."},"seo":{"metatags":{"og:site_name":"Publive Docs","twitter:card":"summary_large_image","twitter:site":"@the_publive"},"indexing":"all"},"fonts":{"family":"Poppins"},"styling":{"eyebrows":"breadcrumbs","latex":false},"contextual":{"options":["copy","view","chatgpt","claude","perplexity","mcp","cursor","vscode"],"display":"header"},"metadata":{"timestamp":true},"navigation":{"global":{"anchors":[{"anchor":"Blog","icon":"newspaper","href":"https://www.thepublive.com/blog"}]},"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"publive","hasAudioNarration":false,"actualSubdomain":"publive","customDomains":["docs.thepublive.com"],"gitSource":{"type":"github","owner":"thepublive","repo":"docs","deployBranch":"main","contentDirectory":"","isPrivate":false,"mountPath":"","label":""},"feedback":{"thumbs":true},"entitlements":{},"buildId":"6af6f82a3522466a5b8114b9","clientVersion":"0.0.4143","searchFilterCounts":[{"language":"default","tag":"Publive DXP","count":153},{"language":"default","tag":"API Reference","count":116},{"language":"default","tag":"Content Management API","count":61},{"language":"default","tag":"Documentation","count":34},{"language":"default","tag":"Content Delivery API","count":31},{"language":"default","tag":"Publive AXP","count":26},{"language":"default","tag":"Build your site","count":17},{"language":"default","tag":"Posts","count":11},{"language":"default","tag":"Guides","count":10},{"language":"default","tag":"Deprecated","count":10}],"searchSettings":{"maxResults":8,"showContentSnippets":true}},"assistantConfig":{"enableAskAiButton":false,"enableStarterQuestions":false,"enableAskAiSearchBar":true},"basePath":"","hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[],"googleFontsInlined":true},"customCss":[{"filePath":"custom.css","content":"#body-content,#content-container{max-width:100%!important}nav-dropdown-products-selector-trigger span.truncate,.nav-dropdown-products-selector-trigger span.truncate,button.nav-dropdown-products-selector-trigger span.truncate{display:none!important}nav-dropdown-products-selector-item-title,.nav-dropdown-products-selector-item-title,nav-dropdown-products-selector-item-description,.nav-dropdown-products-selector-item-description{display:none!important}.nav-dropdown-products-selector-trigger img,.nav-dropdown-products-selector-item-icon img{height:1.375rem!important;width:auto!important;object-fit:contain!important}.nav-dropdown-products-selector-item>svg{display:none!important}.nav-dropdown-products-selector-trigger{margin-left:-1.5rem!important}html[data-current-path=\"/\"] .nav-dropdown-products-selector-trigger,html[data-current-path=\"/\"] :has(>.nav-tabs){display:none!important}"}],"page":{"pagePath":"dxp/documentation/guides/frontend-integration/README","slug":"/dxp/documentation/guides/frontend-integration/README","pageMetadata":{"title":"Frontend Integration","description":"Integrate Publive CDS API with your frontend framework","href":"/dxp/documentation/guides/frontend-integration/README"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Integrate Publive CDS API with your frontend framework\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,li:`li`,ol:`ol`,p:`p`,strong:`strong`,tbody:`tbody`,td:`td`,th:`th`,thead:`thead`,tr:`tr`,..._provideComponents(),...props.components},{Heading,Table,Warning}=_components;if(!Heading)_missingMdxReference(`Heading`,true);if(!Table)_missingMdxReference(`Table`,true);if(!Warning)_missingMdxReference(`Warning`,true);return _jsxs(_Fragment,{children:[_jsxs(_components.p,{children:[`Use the `,_jsx(_components.a,{href:`/dxp/api-reference/content-delivery`,children:`Content Delivery Service (CDS) API`}),` to power your website or application. These guides show you how to fetch and display content from Publive using popular frontend frameworks.`]}),`\n`,_jsx(Heading,{level:`2`,id:`availability`,children:`Availability`}),`\n`,_jsxs(_components.p,{children:[`API access is available on the `,_jsx(_components.strong,{children:`Custom Enterprise`}),` plan only. API access is a paid feature. Your agreement sets the cost.`]}),`\n`,_jsxs(_components.p,{children:[`To get API access or to add API users, contact `,_jsx(_components.a,{href:`mailto:support@thepublive.com`,children:`support@thepublive.com`}),`.`]}),`\n`,_jsx(Heading,{level:`2`,id:`choose-your-framework`,children:`Choose Your Framework`}),`\n`,_jsxs(Table,{children:[_jsx(_components.thead,{children:_jsxs(_components.tr,{children:[_jsx(_components.th,{children:`Framework`}),_jsx(_components.th,{children:`Guide`}),_jsx(_components.th,{children:`Best For`})]})}),_jsxs(_components.tbody,{children:[_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.a,{href:`/dxp/documentation/guides/frontend-integration/nextjs`,children:`Next.js`})}),_jsx(_components.td,{children:`Server-side rendering with React`}),_jsx(_components.td,{children:`SEO-critical sites, blogs, news portals`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.a,{href:`/dxp/documentation/guides/frontend-integration/react`,children:`React`})}),_jsx(_components.td,{children:`Single-page applications`}),_jsx(_components.td,{children:`Dashboards, interactive apps`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.a,{href:`/dxp/documentation/guides/frontend-integration/vue`,children:`Vue.js`})}),_jsx(_components.td,{children:`Progressive framework`}),_jsx(_components.td,{children:`Flexible, incrementally-adoptable sites`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.a,{href:`/dxp/documentation/guides/frontend-integration/angular`,children:`Angular`})}),_jsx(_components.td,{children:`Enterprise framework`}),_jsx(_components.td,{children:`Large-scale enterprise applications`})]})]})]}),`\n`,_jsx(Heading,{level:`2`,id:`common-pattern`,children:`Common Pattern`}),`\n`,_jsx(_components.p,{children:`All integrations follow the same basic pattern:`}),`\n`,_jsxs(_components.ol,{children:[`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Configure`}),` your API credentials (server-side only)`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Fetch`}),` content from the CDS API`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Render`}),` content in your components`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:`Handle`}),` pagination and navigation`]}),`\n`]}),`\n`,_jsx(Warning,{children:_jsxs(_components.p,{children:[_jsx(_components.strong,{children:`Security:`}),` Never expose your API credentials in client-side code. Always make API calls from your server or serverless functions.`]})})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Frontend Integration","description":"Integrate Publive CDS API with your frontend framework","href":"/dxp/documentation/guides/frontend-integration/README"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"Availability","slug":"availability","depth":2,"children":[]},{"title":"Choose Your Framework","slug":"choose-your-framework","depth":2,"children":[]},{"title":"Common Pattern","slug":"common-pattern","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"publive","siteName":"Publive Docs","title":"Frontend Integration - Publive Docs","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-11-13T11:44:50.145Z","gitLastModified":"2026-10-21T13:00:07.000Z","originalFileLocation":"dxp/documentation/guides/frontend-integration/README.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"light\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Integrate Publive CDS API with your frontend framework\">\u003cmeta data-mint-head name=\"application-name\" content=\"Publive Docs\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/svg+xml\" sizes=\"180x180\" href=\"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/27/favicon-2026-07-27-13-26-45.svg\">\u003clink data-mint-head rel=\"icon\" type=\"image/svg+xml\" sizes=\"32x32\" href=\"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/27/favicon-2026-07-27-13-26-45.svg\">\u003clink data-mint-head rel=\"icon\" type=\"image/svg+xml\" sizes=\"16x16\" href=\"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/27/favicon-2026-07-27-13-26-45.svg\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/svg+xml\" href=\"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/27/favicon-2026-07-27-13-26-45.svg\">\u003cmeta data-mint-head property=\"og:title\" content=\"Frontend Integration - Publive Docs\">\u003cmeta data-mint-head property=\"og:description\" content=\"Integrate Publive CDS API with your frontend framework\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Publive Docs\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://publive.mintlify.site/_mintlify/api/og/v2?division=Framework+Integration\u0026amp;title=Frontend+Integration\u0026amp;description=Integrate+Publive+CDS+API+with+your+frontend+framework\u0026amp;theme=0360cb73e77ad3ed301ee7a8\u0026amp;signature=9b4dedfb76d2cbc17fe99d2169c5289815c789c394901be9f237e3a4295ed68a\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Frontend Integration - Publive Docs\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Integrate Publive CDS API with your frontend framework\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://publive.mintlify.site/_mintlify/api/og/v2?division=Framework+Integration\u0026amp;title=Frontend+Integration\u0026amp;description=Integrate+Publive+CDS+API+with+your+frontend+framework\u0026amp;theme=0360cb73e77ad3ed301ee7a8\u0026amp;signature=9b4dedfb76d2cbc17fe99d2169c5289815c789c394901be9f237e3a4295ed68a\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"https://mintlify.s3.us-west-1.amazonaws.com/publive/_generated/favicon/browserconfig.xml?v=3\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Publive Docs\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#146EF5\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/dxp/documentation/guides/frontend-integration/README.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.thepublive.com/#organization\",\"name\":\"Publive Docs\",\"url\":\"https://docs.thepublive.com\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://cdn.prod.website-files.com/66826ebfedcc2d4a07df740c/6682747dedcc2d4a07e30c0e_publive-logo.svg\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.thepublive.com#website\",\"name\":\"Publive Docs\",\"url\":\"https://docs.thepublive.com\",\"publisher\":{\"@id\":\"https://docs.thepublive.com/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README#webpage\",\"url\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README\",\"name\":\"Frontend Integration\",\"description\":\"Integrate Publive CDS API with your frontend framework\",\"dateModified\":\"2026-10-21T13:00:07.000Z\",\"isPartOf\":{\"@id\":\"https://docs.thepublive.com#website\"},\"breadcrumb\":{\"@id\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Publive Docs\",\"item\":\"https://docs.thepublive.com\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Frontend Integration\",\"item\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README#article\",\"headline\":\"Frontend Integration\",\"name\":\"Frontend Integration\",\"description\":\"Integrate Publive CDS API with your frontend framework\",\"url\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README\",\"mainEntityOfPage\":{\"@id\":\"https://docs.thepublive.com/dxp/documentation/guides/frontend-integration/README#webpage\"},\"dateModified\":\"2026-10-21T13:00:07.000Z\",\"publisher\":{\"@id\":\"https://docs.thepublive.com/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.thepublive.com#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Publive Docs\",\"publisher\":{\"@type\":\"Organization\",\"name\":\"Publive Docs\"},\"provider\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","agentPointerHref":"/dxp/documentation/guides/frontend-integration/README.md","siteName":"Publive Docs","nav":{"global":{"anchors":[{"anchor":"Blog","icon":"newspaper","href":"https://www.thepublive.com/blog"}]},"products":[{"product":"Publive DXP","icon":"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/20/dxp-only-logo-2026-07-20-18-23-08.png","tabs":[{"tab":"Documentation","pages":[{"title":"Documentation","href":"/dxp"}]},{"tab":"Build your site","groups":[{"group":"Framework Integration","pages":[{"title":"Frontend Integration","href":"/dxp/documentation/guides/frontend-integration/README"},{"title":"Next.js Integration","description":"Step-by-step guide to integrating the Publive CDS API with Next.js using SSR and SSG. Fetch posts, categories, and author data with full TypeScript support.","href":"/dxp/documentation/guides/frontend-integration/nextjs"},{"title":"React Integration","href":"/dxp/documentation/guides/frontend-integration/react"},{"title":"Vue.js Integration","href":"/dxp/documentation/guides/frontend-integration/vue"},{"title":"Angular Integration","href":"/dxp/documentation/guides/frontend-integration/angular"}]},{"group":"Build with the Starter Kit","pages":[{"title":"Decoupled Frontend Infrastructure","href":"/dxp/documentation/guides/decoupled-frontend/decoupled-frontend-infra"},{"title":"Build a Brand Website","href":"/dxp/documentation/guides/decoupled-frontend/build-brand-website"},{"title":"Build a News/Media Website","href":"/dxp/documentation/guides/decoupled-frontend/build-news-media"},{"title":"Deployment","href":"/dxp/documentation/guides/deployment"},{"group":"Starter Kit recipes","pages":[{"title":"How to integrate form","href":"/dxp/documentation/guides/decoupled-frontend/integrations/how-to-integrate-form"},{"title":"How to integrate component form","href":"/dxp/documentation/guides/decoupled-frontend/integrations/how-to-integrate-component-form"},{"title":"How to create files route","href":"/dxp/documentation/guides/decoupled-frontend/integrations/how-to-create-files-route"},{"title":"How to Have a Preview Page","href":"/dxp/documentation/guides/decoupled-frontend/integrations/how-to-have-preview-page"},{"title":"How to Have Password Protected Preview","href":"/dxp/documentation/guides/decoupled-frontend/integrations/how-to-have-password-protected-preview"}]}]},{"group":"Integrations and webhooks","pages":[{"title":"Webhooks","href":"/dxp/documentation/webhooks-integrations/webhooks"},{"title":"Third-party Integrations","href":"/dxp/documentation/webhooks-integrations/third-party"},{"title":"How to Integrate Cookie Consent","href":"/dxp/documentation/guides/integrations/how-to-integrate-cookie-consent"}]}]},{"tab":"API Reference","pages":[{"title":"API Reference","href":"/dxp/api-reference/README"}]},{"tab":"Changelog","pages":[{"title":"Changelog","href":"/dxp/changelog"}]}]},{"product":"Publive AXP","icon":"https://img-cdn.publive.online/thepublive/media/media_files/2026/07/20/axp-only-logo-2026-07-20-18-23-01.png","pages":[{"title":"Publive AXP","href":"/axp/overview"}]}]},"basePath":"","title":"Frontend Integration - Publive Docs","buildId":"dpl_Fyv1NbzwP68g2bEH2Roy98uY1zmE","deploymentId":"dpl_Fyv1NbzwP68g2bEH2Roy98uY1zmE","dynamics":[],"chunks":[]}
