Routes for blog and pages used in end-to-end AM examples
End-to-end routes

Appifio Creator · Lesson AM12 · Worked examples

9 end-to-end examples
copy · adjust · run

Blog admin/public, a separate auth panel, contact & checkout forms - each example is a shortened block that still keeps every important call.

CMS file names: Examples use blog.json (CMS off). Aura CMS on → swap to blog-posts.json, shop-orders.json… per the manifest (AM11).

Method detail: AM02 (indexed) · AM05 (routes) · AM06 (auth) · AM08 (helpers) · AM10 (URL/empty/rate limit).

Auth: The client keeps the session after login - never read/write login.json.

Example 1

Create a blog post + tag + category + route

appifio_client code pattern for blog list and helpers
Client examples

When: Custom admin panel - publish a new post with a public URL.

Steps: (1) validateAdminSession (2) generateSlug (3) appendData (4) addRoute for the post (5) addRoute for tag/category if missing.

async function createBlog(title, author, content, tags = [], category = 'Uncategorized') {
  await appifio_client.validateAdminSession()
  const slug = appifio_client.appifio_generateSlug(title)
  const save = await appifio_client.appifio_appendData('blog.json', {
    title, slug, author, content, tags, category,
    excerpt: (content || '').replace(/<[^>]+>/g,'').slice(0,150)
  })
  if (!save.success) throw new Error(save.message)
  await appifio_client.appifio_addRoute(slug, 'blog/detail.html', 'blog')
  for (const tag of tags) {
    const ts = appifio_client.appifio_generateSlug(tag)
    if (ts) await appifio_client.appifio_addRoute('tag/' + ts, 'blog/tag.html', 'tag')
  }
  const cs = appifio_client.appifio_generateSlug(category)
  if (cs) await appifio_client.appifio_addRoute('category/' + cs, 'blog/category.html', 'category')
  return { id: save.data.id, slug }
}

Example 2

Delete a post + removeRoute

When: Admin deletes a post - avoid ghost 404s or slugs pointing at deleted data.

Steps: (1) validate (2) readFile(id) for slug (3) updateData(null) (4) removeRoute.

async function deleteBlog(blogId) {
  await appifio_client.validateAdminSession()
  const item = await appifio_client.appifio_readFile('blog.json', blogId)
  const slug = item.data?.content?.slug
  if (!slug) throw new Error('Post not found')
  await appifio_client.appifio_updateData('blog.json', blogId, null)
  await appifio_client.appifio_removeRoute(slug)
}

Example 3

Blog detail page (blog/detail.html)

When: Visitor opens a post slug - public, no token.

Steps: (1) waitForAppStorage (2) getRouteSlug (3) readList to find id (4) readFile(id) (5) formatDateTime.

document.addEventListener('DOMContentLoaded', async () => {
  await window.waitForAppStorage()
  const slug = appifio_client.appifio_getRouteSlug()
  const list = await appifio_client.appifio_readList('blog.json', ['id','slug'])
  const match = (list.data?.content || []).find(b => b.slug === slug)
  if (!match) return showError('Post not found')
  const detail = await appifio_client.appifio_readFile('blog.json', match.id)
  const blog = detail.data?.content
  if (!blog) return showError('Post not found')
  document.getElementById('blog-title').textContent = blog.title
  document.getElementById('blog-date').textContent =
    appifio_client.appifio_formatDateTime(blog.created_at, 'date')
  document.getElementById('blog-content').innerHTML = blog.content
})

Example 4

Tag page (blog/tag.html)

When: URL like /urlname/tag/javascript.

Steps: Parse slug after tag/readList → filter by tag (compare generateSlug) → link with getAbsoluteUrl(post.slug).

await window.waitForAppStorage()
const parts = window.location.pathname.split('/').filter(Boolean)
const tagIdx = parts.indexOf('tag')
const tagSlug = tagIdx >= 0 ? parts[tagIdx + 1] : ''
const res = await appifio_client.appifio_readList('blog.json',
  ['id','title','slug','tags','created_at'])
const tagged = (res.data?.content || []).filter(b =>
  (b.tags || []).some(t => appifio_client.appifio_generateSlug(t) === tagSlug)
)
tagged.forEach(post => {
  const when = appifio_client.appifio_formatDateTime(post.created_at, 'date')
  // …
})
Backend storage for contact and checkout appendData examples
Storage for forms

Appifio Creator · Method series · AM12