Plain JavaScript

// delivery.js — no SDK or API key required. Node 22+ or a modern browser.
export async function getArticle({ origin, organization, site, slug }) {
  const base = new URL(origin);
  if (base.protocol !== 'https:' && !['localhost', '127.0.0.1'].includes(base.hostname)) {
    throw new Error('Use an HTTPS Content origin');
  }
  if (![organization, site].every(id => /^[a-f0-9-]{36}$/.test(id))) {
    throw new Error('Set your organization and site UUIDs');
  }
  const prefix = '/delivery/v1/' + organization + '/' + site + '/';
  async function read(path) {
    const url = new URL(path, base);
    if (url.origin !== base.origin || !url.pathname.startsWith(prefix) || url.search || url.hash) {
      throw new Error('Unexpected delivery URL');
    }
    const response = await fetch(url, {
      credentials: 'omit', cache: 'no-store', redirect: 'error',
      signal: AbortSignal.timeout(8000),
    });
    if (!response.ok) throw new Error('Content delivery returned ' + response.status);
    return response.json();
  }
  const current = await read(prefix + 'current.json');
  const manifest = await read(current.url);
  const entry = manifest.entries.find(item => item.type === 'article' && item.slug === slug);
  if (!entry) return null;
  const document = await read(entry.url);
  return { releaseId: current.releaseId, document };
}

<!-- index.html -->
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>Journal</title></head>
<body><main><h1 id="title">Journal</h1><p id="body" style="white-space: pre-wrap"></p>
<p id="status" role="status">Loading article…</p></main>
<script type="module" src="/article.js"></script></body></html>

// article.js
import { getArticle } from './delivery.js';
const status = document.querySelector('#status');
try {
  const result = await getArticle({ origin: 'https://content.peopletide.com',
    organization: 'YOUR_ORGANIZATION_UUID', site: 'YOUR_SITE_UUID', slug: 'welcome' });
  if (!result) status.textContent = 'Article not published.';
  else {
    document.querySelector('#title').textContent = result.document.title;
    document.querySelector('#body').textContent = result.document.fields.body || '';
    status.textContent = '';
  }
} catch { status.textContent = 'Content temporarily unavailable.'; }