[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-contentful-contentful-custom-app-from-scratch":3,"mdc-c6hi5t-key":34,"related-org-contentful-contentful-custom-app-from-scratch":679,"related-repo-contentful-contentful-custom-app-from-scratch":776},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":20,"repoUrl":21,"updatedAt":22,"license":23,"forks":24,"topics":25,"repo":29,"sourceUrl":32,"mdContent":33},"contentful-custom-app-from-scratch","build custom Contentful App Framework apps","Design, scaffold, build, and validate a new Contentful App Framework custom app for a customer's own repository or workspace. Use when users want to create a custom app from an idea, choose App Framework locations, build a sidebar app, field editor app, page app, dialog, configuration screen, App Action, or Function-backed app, scaffold with create-contentful-app, or make a locally testable app for an organization-specific Contentful workflow. Also triggers on \"build a Contentful app\", \"custom app from scratch\", \"App Framework app\", \"sidebar app\", \"field editor app\", \"page app\", \"app action\", and \"app function\". Not for generic Contentful API examples (contentful-api), content model migrations (contentful-migration), or website integration (contentful-nextjs).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},"contentful","Contentful","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fcontentful.png",[12,14,17],{"name":9,"slug":8,"type":13},"tag",{"name":15,"slug":16,"type":13},"Architecture","architecture",{"name":18,"slug":19,"type":13},"CMS","cms",36,"https:\u002F\u002Fgithub.com\u002Fcontentful\u002Fskills","2026-07-12T08:48:05.103951","MIT",2,[26,8,27,28],"agents","optimization","skills",{"repoUrl":21,"stars":20,"forks":24,"topics":30,"description":31},[26,8,27,28],"Skills for teaching agents how to build on Contentful.","https:\u002F\u002Fgithub.com\u002Fcontentful\u002Fskills\u002Ftree\u002FHEAD\u002Fskills\u002Fcontentful-apps\u002Fcontentful-custom-app-from-scratch","---\nname: contentful-custom-app-from-scratch\ndescription: >-\n  Design, scaffold, build, and validate a new Contentful App Framework custom\n  app for a customer's own repository or workspace. Use when users want to\n  create a custom app from an idea, choose App Framework locations, build a\n  sidebar app, field editor app, page app, dialog, configuration screen, App\n  Action, or Function-backed app, scaffold with create-contentful-app, or make a\n  locally testable app for an organization-specific Contentful workflow. Also\n  triggers on \"build a Contentful app\", \"custom app from scratch\", \"App\n  Framework app\", \"sidebar app\", \"field editor app\", \"page app\", \"app action\",\n  and \"app function\". Not for generic Contentful API examples (contentful-api),\n  content model migrations (contentful-migration), or website integration\n  (contentful-nextjs).\nlicense: MIT\nmetadata:\n  author: contentful\n  version: \"2.0.0\"\nallowed-tools: mcp__contentful-mcp__* mcp__plugin_contentful_contentful-mcp__*\n---\n\n# Contentful Custom App From Scratch\n\nUse this skill to turn a customer app idea into a small, locally testable\nContentful App Framework implementation.\n\nDefault to the user's own repository, Contentful organization, and app delivery\nworkflow unless they explicitly choose another destination.\n\nPublic Contentful Marketplace apps and Contentful's public apps repository\n(`https:\u002F\u002Fgithub.com\u002Fcontentful\u002Fapps`) can be useful references for mature App\nFramework patterns, UX conventions, and configuration flows. Use them as\nexamples to adapt, not as required repo structure or publication process.\n\n## Working Style\n\n- Start with the app's job, primary users, affected content model, and target\n  Contentful surface before writing code.\n- Ask only for information that changes the architecture or prevents a wrong\n  build.\n- Prefer the smallest version that proves the value in a non-production space.\n- Ground capability decisions in official App Framework docs and the current\n  project structure.\n- Keep user-owned secrets, tokens, and production content out of generated code,\n  logs, and examples.\n\n## Workflow\n\n### 1. Create the Implementation Brief\n\nCapture a short brief before scaffolding:\n\n- app concept in one sentence,\n- target users and the workflow they need to improve,\n- Contentful locations needed for v1,\n- content types, fields, locales, and environments involved,\n- external systems, authentication, or APIs involved,\n- expected installation and configuration model,\n- must-have v1 behavior,\n- assumptions and non-goals,\n- validation plan for local and sandbox testing.\n\nIf the idea is still broad, propose 2-3 feasible v1 options and recommend the\nsmallest useful one.\n\nFor planning details, use [App planning](references\u002Fapp-planning.md).\n\n### 2. Choose the App Shape\n\nChoose locations by user workflow:\n\n- Use `app-config` when the app needs installation-time setup.\n- Use `entry-sidebar` for entry-level context, status, helper actions, and\n  lightweight insights.\n- Use `entry-field` to replace or enhance a field's editing experience.\n- Use `dialog` for focused picker, confirmation, or multi-step flows launched\n  from another location.\n- Use `page` or `home` for dashboards, bulk tools, onboarding, or full-screen\n  operational workflows.\n- Use `entry-editor` only when replacing or heavily extending the full entry\n  editing experience is worth the maintenance cost.\n- Use App Actions or Functions only when the app needs asynchronous behavior,\n  server-side execution, verified inbound requests, event handling, or access to\n  secret values outside the browser.\n\nIf sensitive credentials are required, model them as secret installation\nparameters and consume raw values only in a backend or Function-backed path.\n\n### 3. Inspect or Scaffold the Project\n\nIf the user already has a repo:\n\n1. Inspect `package.json`, app-related docs, existing app locations, build\n   scripts, tests, and style conventions.\n2. Reuse the repo's framework, package manager, lint\u002Ftest setup, and component\n   patterns.\n3. Identify whether the app already uses `@contentful\u002Fapp-sdk`,\n   `@contentful\u002Freact-apps-toolkit`, `@contentful\u002Ff36-components`, or\n   `contentful-management`.\n\nIf the user does not have a repo:\n\n1. Scaffold with `npx create-contentful-app@latest \u003Capp-name>`.\n2. Prefer TypeScript unless the user requests JavaScript.\n3. Keep the first scaffold close to the generated project until the local app is\n   wired into Contentful and verified.\n\n### 4. Build in Contentful-Native Style\n\n- Use the App SDK or React Apps Toolkit to access the current location SDK.\n- Use Forma 36 components for Contentful web app UI. Always check if Forma 36 has a similar component before attempting to build something custom.\n- Keep UI dense, clear, and editor-friendly; avoid marketing layouts inside the\n  Contentful web app.\n- Include loading, empty, permission, and error states when they affect the main\n  workflow.\n- Keep field and entry writes explicit, reversible where possible, and easy for\n  editors to understand.\n- When runtime locations need app configuration, read installation parameters\n  from `sdk.parameters.installation`. Do not fetch app installation records\n  through CMA from mount effects, render paths, hooks, or user interactions just\n  to retrieve configured parameters.\n- Avoid broad abstractions until the app has more than one real usage path.\n- Do not expose management tokens, API keys, or third-party credentials in\n  browser code.\n\n### 5. Wire the Local App into Contentful\n\nCreate or update the app definition in a development organization or sandbox:\n\n- set the frontend URL to the local dev server, commonly\n  `http:\u002F\u002Flocalhost:3000`,\n- select only the locations implemented in v1,\n- define required installation or instance parameters,\n- install the app into a non-production space or environment,\n- assign the app to the relevant content types, fields, sidebar, home page, or\n  page location,\n- seed minimal test content when needed.\n\nFor local test and handoff steps, use\n[Repository and validation](references\u002Frepo-and-validation.md).\n\n### 6. Verify Before Handoff\n\nRun the closest meaningful checks available in the user's project:\n\n- package install check when dependencies changed,\n- typecheck and lint,\n- unit or component tests,\n- production build,\n- local dev server smoke test,\n- manual Contentful web app flow in a non-production space.\n- `rg -n \"appInstallation\\\\.(getForOrganization|get)\\\\(|getForOrganization\"`\n  over the app source when runtime code reads installation parameters, with any\n  remaining CMA app-installation call explained.\n\nDo not claim the app works unless you ran the relevant validation or clearly\nstate what could not be run.\n\n### 7. Hand Off the Result\n\nEnd with:\n\n- what was built,\n- how to run it locally,\n- how to install or assign it in Contentful,\n- validation performed,\n- remaining assumptions, limitations, or credentials needed,\n- suggested next iteration.\n\n## Related Skills\n\n- `contentful-custom-app-enhancement` - improve or debug an existing custom app.\n- `contentful-api` - concrete CMA, CDA, CPA, Images API, and GraphQL examples.\n- `contentful-migration` - content model migration scripts.\n- `contentful-guide` - Contentful concepts and API routing.\n",{"data":35,"body":39},{"name":4,"description":6,"license":23,"metadata":36,"allowed-tools":38},{"author":8,"version":37},"2.0.0","mcp__contentful-mcp__* mcp__plugin_contentful_contentful-mcp__*",{"type":40,"children":41},"root",[42,50,56,61,75,82,112,118,125,130,178,183,197,203,208,297,302,308,313,371,376,401,407,458,464,469,510,522,528,533,577,582,588,593,626,632],{"type":43,"tag":44,"props":45,"children":46},"element","h1",{"id":4},[47],{"type":48,"value":49},"text","Contentful Custom App From Scratch",{"type":43,"tag":51,"props":52,"children":53},"p",{},[54],{"type":48,"value":55},"Use this skill to turn a customer app idea into a small, locally testable\nContentful App Framework implementation.",{"type":43,"tag":51,"props":57,"children":58},{},[59],{"type":48,"value":60},"Default to the user's own repository, Contentful organization, and app delivery\nworkflow unless they explicitly choose another destination.",{"type":43,"tag":51,"props":62,"children":63},{},[64,66,73],{"type":48,"value":65},"Public Contentful Marketplace apps and Contentful's public apps repository\n(",{"type":43,"tag":67,"props":68,"children":70},"code",{"className":69},[],[71],{"type":48,"value":72},"https:\u002F\u002Fgithub.com\u002Fcontentful\u002Fapps",{"type":48,"value":74},") can be useful references for mature App\nFramework patterns, UX conventions, and configuration flows. Use them as\nexamples to adapt, not as required repo structure or publication process.",{"type":43,"tag":76,"props":77,"children":79},"h2",{"id":78},"working-style",[80],{"type":48,"value":81},"Working Style",{"type":43,"tag":83,"props":84,"children":85},"ul",{},[86,92,97,102,107],{"type":43,"tag":87,"props":88,"children":89},"li",{},[90],{"type":48,"value":91},"Start with the app's job, primary users, affected content model, and target\nContentful surface before writing code.",{"type":43,"tag":87,"props":93,"children":94},{},[95],{"type":48,"value":96},"Ask only for information that changes the architecture or prevents a wrong\nbuild.",{"type":43,"tag":87,"props":98,"children":99},{},[100],{"type":48,"value":101},"Prefer the smallest version that proves the value in a non-production space.",{"type":43,"tag":87,"props":103,"children":104},{},[105],{"type":48,"value":106},"Ground capability decisions in official App Framework docs and the current\nproject structure.",{"type":43,"tag":87,"props":108,"children":109},{},[110],{"type":48,"value":111},"Keep user-owned secrets, tokens, and production content out of generated code,\nlogs, and examples.",{"type":43,"tag":76,"props":113,"children":115},{"id":114},"workflow",[116],{"type":48,"value":117},"Workflow",{"type":43,"tag":119,"props":120,"children":122},"h3",{"id":121},"_1-create-the-implementation-brief",[123],{"type":48,"value":124},"1. Create the Implementation Brief",{"type":43,"tag":51,"props":126,"children":127},{},[128],{"type":48,"value":129},"Capture a short brief before scaffolding:",{"type":43,"tag":83,"props":131,"children":132},{},[133,138,143,148,153,158,163,168,173],{"type":43,"tag":87,"props":134,"children":135},{},[136],{"type":48,"value":137},"app concept in one sentence,",{"type":43,"tag":87,"props":139,"children":140},{},[141],{"type":48,"value":142},"target users and the workflow they need to improve,",{"type":43,"tag":87,"props":144,"children":145},{},[146],{"type":48,"value":147},"Contentful locations needed for v1,",{"type":43,"tag":87,"props":149,"children":150},{},[151],{"type":48,"value":152},"content types, fields, locales, and environments involved,",{"type":43,"tag":87,"props":154,"children":155},{},[156],{"type":48,"value":157},"external systems, authentication, or APIs involved,",{"type":43,"tag":87,"props":159,"children":160},{},[161],{"type":48,"value":162},"expected installation and configuration model,",{"type":43,"tag":87,"props":164,"children":165},{},[166],{"type":48,"value":167},"must-have v1 behavior,",{"type":43,"tag":87,"props":169,"children":170},{},[171],{"type":48,"value":172},"assumptions and non-goals,",{"type":43,"tag":87,"props":174,"children":175},{},[176],{"type":48,"value":177},"validation plan for local and sandbox testing.",{"type":43,"tag":51,"props":179,"children":180},{},[181],{"type":48,"value":182},"If the idea is still broad, propose 2-3 feasible v1 options and recommend the\nsmallest useful one.",{"type":43,"tag":51,"props":184,"children":185},{},[186,188,195],{"type":48,"value":187},"For planning details, use ",{"type":43,"tag":189,"props":190,"children":192},"a",{"href":191},"references\u002Fapp-planning.md",[193],{"type":48,"value":194},"App planning",{"type":48,"value":196},".",{"type":43,"tag":119,"props":198,"children":200},{"id":199},"_2-choose-the-app-shape",[201],{"type":48,"value":202},"2. Choose the App Shape",{"type":43,"tag":51,"props":204,"children":205},{},[206],{"type":48,"value":207},"Choose locations by user workflow:",{"type":43,"tag":83,"props":209,"children":210},{},[211,224,236,248,260,280,292],{"type":43,"tag":87,"props":212,"children":213},{},[214,216,222],{"type":48,"value":215},"Use ",{"type":43,"tag":67,"props":217,"children":219},{"className":218},[],[220],{"type":48,"value":221},"app-config",{"type":48,"value":223}," when the app needs installation-time setup.",{"type":43,"tag":87,"props":225,"children":226},{},[227,228,234],{"type":48,"value":215},{"type":43,"tag":67,"props":229,"children":231},{"className":230},[],[232],{"type":48,"value":233},"entry-sidebar",{"type":48,"value":235}," for entry-level context, status, helper actions, and\nlightweight insights.",{"type":43,"tag":87,"props":237,"children":238},{},[239,240,246],{"type":48,"value":215},{"type":43,"tag":67,"props":241,"children":243},{"className":242},[],[244],{"type":48,"value":245},"entry-field",{"type":48,"value":247}," to replace or enhance a field's editing experience.",{"type":43,"tag":87,"props":249,"children":250},{},[251,252,258],{"type":48,"value":215},{"type":43,"tag":67,"props":253,"children":255},{"className":254},[],[256],{"type":48,"value":257},"dialog",{"type":48,"value":259}," for focused picker, confirmation, or multi-step flows launched\nfrom another location.",{"type":43,"tag":87,"props":261,"children":262},{},[263,264,270,272,278],{"type":48,"value":215},{"type":43,"tag":67,"props":265,"children":267},{"className":266},[],[268],{"type":48,"value":269},"page",{"type":48,"value":271}," or ",{"type":43,"tag":67,"props":273,"children":275},{"className":274},[],[276],{"type":48,"value":277},"home",{"type":48,"value":279}," for dashboards, bulk tools, onboarding, or full-screen\noperational workflows.",{"type":43,"tag":87,"props":281,"children":282},{},[283,284,290],{"type":48,"value":215},{"type":43,"tag":67,"props":285,"children":287},{"className":286},[],[288],{"type":48,"value":289},"entry-editor",{"type":48,"value":291}," only when replacing or heavily extending the full entry\nediting experience is worth the maintenance cost.",{"type":43,"tag":87,"props":293,"children":294},{},[295],{"type":48,"value":296},"Use App Actions or Functions only when the app needs asynchronous behavior,\nserver-side execution, verified inbound requests, event handling, or access to\nsecret values outside the browser.",{"type":43,"tag":51,"props":298,"children":299},{},[300],{"type":48,"value":301},"If sensitive credentials are required, model them as secret installation\nparameters and consume raw values only in a backend or Function-backed path.",{"type":43,"tag":119,"props":303,"children":305},{"id":304},"_3-inspect-or-scaffold-the-project",[306],{"type":48,"value":307},"3. Inspect or Scaffold the Project",{"type":43,"tag":51,"props":309,"children":310},{},[311],{"type":48,"value":312},"If the user already has a repo:",{"type":43,"tag":314,"props":315,"children":316},"ol",{},[317,330,335],{"type":43,"tag":87,"props":318,"children":319},{},[320,322,328],{"type":48,"value":321},"Inspect ",{"type":43,"tag":67,"props":323,"children":325},{"className":324},[],[326],{"type":48,"value":327},"package.json",{"type":48,"value":329},", app-related docs, existing app locations, build\nscripts, tests, and style conventions.",{"type":43,"tag":87,"props":331,"children":332},{},[333],{"type":48,"value":334},"Reuse the repo's framework, package manager, lint\u002Ftest setup, and component\npatterns.",{"type":43,"tag":87,"props":336,"children":337},{},[338,340,346,348,354,356,362,364,370],{"type":48,"value":339},"Identify whether the app already uses ",{"type":43,"tag":67,"props":341,"children":343},{"className":342},[],[344],{"type":48,"value":345},"@contentful\u002Fapp-sdk",{"type":48,"value":347},",\n",{"type":43,"tag":67,"props":349,"children":351},{"className":350},[],[352],{"type":48,"value":353},"@contentful\u002Freact-apps-toolkit",{"type":48,"value":355},", ",{"type":43,"tag":67,"props":357,"children":359},{"className":358},[],[360],{"type":48,"value":361},"@contentful\u002Ff36-components",{"type":48,"value":363},", or\n",{"type":43,"tag":67,"props":365,"children":367},{"className":366},[],[368],{"type":48,"value":369},"contentful-management",{"type":48,"value":196},{"type":43,"tag":51,"props":372,"children":373},{},[374],{"type":48,"value":375},"If the user does not have a repo:",{"type":43,"tag":314,"props":377,"children":378},{},[379,391,396],{"type":43,"tag":87,"props":380,"children":381},{},[382,384,390],{"type":48,"value":383},"Scaffold with ",{"type":43,"tag":67,"props":385,"children":387},{"className":386},[],[388],{"type":48,"value":389},"npx create-contentful-app@latest \u003Capp-name>",{"type":48,"value":196},{"type":43,"tag":87,"props":392,"children":393},{},[394],{"type":48,"value":395},"Prefer TypeScript unless the user requests JavaScript.",{"type":43,"tag":87,"props":397,"children":398},{},[399],{"type":48,"value":400},"Keep the first scaffold close to the generated project until the local app is\nwired into Contentful and verified.",{"type":43,"tag":119,"props":402,"children":404},{"id":403},"_4-build-in-contentful-native-style",[405],{"type":48,"value":406},"4. Build in Contentful-Native Style",{"type":43,"tag":83,"props":408,"children":409},{},[410,415,420,425,430,435,448,453],{"type":43,"tag":87,"props":411,"children":412},{},[413],{"type":48,"value":414},"Use the App SDK or React Apps Toolkit to access the current location SDK.",{"type":43,"tag":87,"props":416,"children":417},{},[418],{"type":48,"value":419},"Use Forma 36 components for Contentful web app UI. Always check if Forma 36 has a similar component before attempting to build something custom.",{"type":43,"tag":87,"props":421,"children":422},{},[423],{"type":48,"value":424},"Keep UI dense, clear, and editor-friendly; avoid marketing layouts inside the\nContentful web app.",{"type":43,"tag":87,"props":426,"children":427},{},[428],{"type":48,"value":429},"Include loading, empty, permission, and error states when they affect the main\nworkflow.",{"type":43,"tag":87,"props":431,"children":432},{},[433],{"type":48,"value":434},"Keep field and entry writes explicit, reversible where possible, and easy for\neditors to understand.",{"type":43,"tag":87,"props":436,"children":437},{},[438,440,446],{"type":48,"value":439},"When runtime locations need app configuration, read installation parameters\nfrom ",{"type":43,"tag":67,"props":441,"children":443},{"className":442},[],[444],{"type":48,"value":445},"sdk.parameters.installation",{"type":48,"value":447},". Do not fetch app installation records\nthrough CMA from mount effects, render paths, hooks, or user interactions just\nto retrieve configured parameters.",{"type":43,"tag":87,"props":449,"children":450},{},[451],{"type":48,"value":452},"Avoid broad abstractions until the app has more than one real usage path.",{"type":43,"tag":87,"props":454,"children":455},{},[456],{"type":48,"value":457},"Do not expose management tokens, API keys, or third-party credentials in\nbrowser code.",{"type":43,"tag":119,"props":459,"children":461},{"id":460},"_5-wire-the-local-app-into-contentful",[462],{"type":48,"value":463},"5. Wire the Local App into Contentful",{"type":43,"tag":51,"props":465,"children":466},{},[467],{"type":48,"value":468},"Create or update the app definition in a development organization or sandbox:",{"type":43,"tag":83,"props":470,"children":471},{},[472,485,490,495,500,505],{"type":43,"tag":87,"props":473,"children":474},{},[475,477,483],{"type":48,"value":476},"set the frontend URL to the local dev server, commonly\n",{"type":43,"tag":67,"props":478,"children":480},{"className":479},[],[481],{"type":48,"value":482},"http:\u002F\u002Flocalhost:3000",{"type":48,"value":484},",",{"type":43,"tag":87,"props":486,"children":487},{},[488],{"type":48,"value":489},"select only the locations implemented in v1,",{"type":43,"tag":87,"props":491,"children":492},{},[493],{"type":48,"value":494},"define required installation or instance parameters,",{"type":43,"tag":87,"props":496,"children":497},{},[498],{"type":48,"value":499},"install the app into a non-production space or environment,",{"type":43,"tag":87,"props":501,"children":502},{},[503],{"type":48,"value":504},"assign the app to the relevant content types, fields, sidebar, home page, or\npage location,",{"type":43,"tag":87,"props":506,"children":507},{},[508],{"type":48,"value":509},"seed minimal test content when needed.",{"type":43,"tag":51,"props":511,"children":512},{},[513,515,521],{"type":48,"value":514},"For local test and handoff steps, use\n",{"type":43,"tag":189,"props":516,"children":518},{"href":517},"references\u002Frepo-and-validation.md",[519],{"type":48,"value":520},"Repository and validation",{"type":48,"value":196},{"type":43,"tag":119,"props":523,"children":525},{"id":524},"_6-verify-before-handoff",[526],{"type":48,"value":527},"6. Verify Before Handoff",{"type":43,"tag":51,"props":529,"children":530},{},[531],{"type":48,"value":532},"Run the closest meaningful checks available in the user's project:",{"type":43,"tag":83,"props":534,"children":535},{},[536,541,546,551,556,561,566],{"type":43,"tag":87,"props":537,"children":538},{},[539],{"type":48,"value":540},"package install check when dependencies changed,",{"type":43,"tag":87,"props":542,"children":543},{},[544],{"type":48,"value":545},"typecheck and lint,",{"type":43,"tag":87,"props":547,"children":548},{},[549],{"type":48,"value":550},"unit or component tests,",{"type":43,"tag":87,"props":552,"children":553},{},[554],{"type":48,"value":555},"production build,",{"type":43,"tag":87,"props":557,"children":558},{},[559],{"type":48,"value":560},"local dev server smoke test,",{"type":43,"tag":87,"props":562,"children":563},{},[564],{"type":48,"value":565},"manual Contentful web app flow in a non-production space.",{"type":43,"tag":87,"props":567,"children":568},{},[569,575],{"type":43,"tag":67,"props":570,"children":572},{"className":571},[],[573],{"type":48,"value":574},"rg -n \"appInstallation\\\\.(getForOrganization|get)\\\\(|getForOrganization\"",{"type":48,"value":576},"\nover the app source when runtime code reads installation parameters, with any\nremaining CMA app-installation call explained.",{"type":43,"tag":51,"props":578,"children":579},{},[580],{"type":48,"value":581},"Do not claim the app works unless you ran the relevant validation or clearly\nstate what could not be run.",{"type":43,"tag":119,"props":583,"children":585},{"id":584},"_7-hand-off-the-result",[586],{"type":48,"value":587},"7. Hand Off the Result",{"type":43,"tag":51,"props":589,"children":590},{},[591],{"type":48,"value":592},"End with:",{"type":43,"tag":83,"props":594,"children":595},{},[596,601,606,611,616,621],{"type":43,"tag":87,"props":597,"children":598},{},[599],{"type":48,"value":600},"what was built,",{"type":43,"tag":87,"props":602,"children":603},{},[604],{"type":48,"value":605},"how to run it locally,",{"type":43,"tag":87,"props":607,"children":608},{},[609],{"type":48,"value":610},"how to install or assign it in Contentful,",{"type":43,"tag":87,"props":612,"children":613},{},[614],{"type":48,"value":615},"validation performed,",{"type":43,"tag":87,"props":617,"children":618},{},[619],{"type":48,"value":620},"remaining assumptions, limitations, or credentials needed,",{"type":43,"tag":87,"props":622,"children":623},{},[624],{"type":48,"value":625},"suggested next iteration.",{"type":43,"tag":76,"props":627,"children":629},{"id":628},"related-skills",[630],{"type":48,"value":631},"Related Skills",{"type":43,"tag":83,"props":633,"children":634},{},[635,646,657,668],{"type":43,"tag":87,"props":636,"children":637},{},[638,644],{"type":43,"tag":67,"props":639,"children":641},{"className":640},[],[642],{"type":48,"value":643},"contentful-custom-app-enhancement",{"type":48,"value":645}," - improve or debug an existing custom app.",{"type":43,"tag":87,"props":647,"children":648},{},[649,655],{"type":43,"tag":67,"props":650,"children":652},{"className":651},[],[653],{"type":48,"value":654},"contentful-api",{"type":48,"value":656}," - concrete CMA, CDA, CPA, Images API, and GraphQL examples.",{"type":43,"tag":87,"props":658,"children":659},{},[660,666],{"type":43,"tag":67,"props":661,"children":663},{"className":662},[],[664],{"type":48,"value":665},"contentful-migration",{"type":48,"value":667}," - content model migration scripts.",{"type":43,"tag":87,"props":669,"children":670},{},[671,677],{"type":43,"tag":67,"props":672,"children":674},{"className":673},[],[675],{"type":48,"value":676},"contentful-guide",{"type":48,"value":678}," - Contentful concepts and API routing.",{"items":680,"total":775},[681,695,708,718,724,735,749,764],{"slug":682,"name":682,"fn":683,"description":684,"org":685,"tags":686,"stars":692,"repoUrl":693,"updatedAt":694},"contentful-help","configure and diagnose Contentful projects","Diagnose, configure, and look up Contentful topics. Trigger keywords: contentful help, contentful doctor, contentful setup",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[687,688,689],{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":690,"slug":691,"type":13},"Documentation","documentation",61,"https:\u002F\u002Fgithub.com\u002Fcontentful\u002Fskill-kit","2026-07-12T08:48:00.085365",{"slug":654,"name":654,"fn":696,"description":697,"org":698,"tags":699,"stars":20,"repoUrl":21,"updatedAt":707},"integrate Contentful REST and GraphQL APIs","Comprehensive Contentful REST API guide. Covers Content Management API (CMA) for creating\u002Fupdating content, Content Delivery API (CDA) for fetching published content, Preview API, Images API, and GraphQL API. All examples use curl\u002FHTTP — language-agnostic.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[700,703,704],{"name":701,"slug":702,"type":13},"API Development","api-development",{"name":18,"slug":19,"type":13},{"name":705,"slug":706,"type":13},"GraphQL","graphql","2026-07-12T08:47:43.592187",{"slug":643,"name":643,"fn":709,"description":710,"org":711,"tags":712,"stars":20,"repoUrl":21,"updatedAt":717},"enhance and debug Contentful custom apps","Improve, debug, and extend an existing Contentful App Framework custom app in a customer's own repository. Use when users provide a bug report, feature request, support note, customer feedback, or direct change request for an existing custom app, including app configuration, sidebar, field editor, dialog, page, home, App Action, Function, installation parameters, local validation, or PR preparation. Also triggers on \"fix my Contentful app\", \"improve a custom app\", \"enhance App Framework app\", \"debug custom app\", \"update sidebar app\", and \"custom app feature request\". Not for creating a brand new app from scratch (contentful-custom-app-from-scratch), generic API examples (contentful-api), migrations (contentful-migration), or website integration (contentful-nextjs).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[713,714],{"name":18,"slug":19,"type":13},{"name":715,"slug":716,"type":13},"Debugging","debugging","2026-07-12T08:48:03.887678",{"slug":4,"name":4,"fn":5,"description":6,"org":719,"tags":720,"stars":20,"repoUrl":21,"updatedAt":22},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[721,722,723],{"name":15,"slug":16,"type":13},{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"slug":676,"name":676,"fn":725,"description":726,"org":727,"tags":728,"stars":20,"repoUrl":21,"updatedAt":734},"guide Contentful implementation and concepts","Explain core Contentful concepts and route users to the right implementation skill or documentation. Use when users ask conceptual questions, need terminology clarified, want help choosing between APIs (CDA\u002FCMA\u002FCPA\u002FGraphQL), or need guidance on the Contentful MCP server. Also triggers on \"Contentful 101\", \"which Contentful API\", \"how do I get started\", \"which skill should I use\", \"what does X mean in Contentful\", \"Contentful glossary\", \"CDA vs CPA\", \"CDA vs GraphQL\", \"how does Contentful work\", \"Contentful architecture\", \"explain environments\", \"what are aliases\", \"content model design\", \"headless CMS\", \"Contentful MCP\", \"MCP server\", \"set up MCP\", \"Remix Contentful\", \"Astro Contentful\", \"Gatsby Contentful\", \"SvelteKit Contentful\", \"Nuxt Contentful\". Not for framework-specific implementation (contentful-nextjs), migrations (contentful-migration), personalization (contentful-personalization), or hands-on REST\u002FGraphQL request examples (contentful-api).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[729,730,731],{"name":18,"slug":19,"type":13},{"name":690,"slug":691,"type":13},{"name":732,"slug":733,"type":13},"Reference","reference","2026-07-12T08:47:45.041396",{"slug":665,"name":665,"fn":736,"description":737,"org":738,"tags":739,"stars":20,"repoUrl":21,"updatedAt":748},"run Contentful content model migrations","Write and run Contentful content model migration scripts using the contentful-migration library and the Contentful CLI. Covers creating, editing, and deleting content types and fields, validations, editor interface configuration, editor layouts, sidebar widgets, entry transformations, tags, annotations, and the migration context object. Use when asked to write a migration, create or add a content type, add, rename, or delete fields, change or update a content model, transform entries, derive linked entries, configure editor controls, or run a migration script. Also triggers on \"migration script\", \"contentful-migration\", \"schema migration\", \"content model migration\", \"field validation\", \"editor interface\", \"editor layout\", \"sidebar widget\", \"moveField\", \"changeFieldId\", \"rich text field\", \"reference field\", \"link field\". Not for SDK client setup or Next.js integration (contentful-nextjs). Not for Contentful terminology or API routing (contentful-guide).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[740,743,744,745],{"name":741,"slug":742,"type":13},"CLI","cli",{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":746,"slug":747,"type":13},"Migration","migration","2026-07-12T08:47:50.532378",{"slug":750,"name":750,"fn":751,"description":752,"org":753,"tags":754,"stars":20,"repoUrl":21,"updatedAt":763},"contentful-nextjs","integrate Contentful into Next.js applications","Add and configure Contentful in an existing Next.js project. Covers installing the JavaScript SDK, configuring environment variables, creating production and preview-aware clients, fetching content in App Router or Pages Router, and wiring Draft Mode preview flows. Use when users ask to integrate Contentful with Next.js, fetch entries, set up preview or draft content, or configure the Contentful client. Also triggers on \"Contentful SDK Next.js\", \"contentful.js\", \"fetch Contentful entries\", \"get content from Contentful\", \"Contentful preview\", \"preview mode\", \"Contentful environment variables\", \"Contentful client setup\", \"create Contentful client\", \"Pages Router Contentful\", \"getStaticProps Contentful\", \"Server Components Contentful\", \"revalidate Contentful\", \"ISR Contentful\". Not for personalization or Experiences SDK setup (contentful-personalization). Not for non-Next.js frameworks (contentful-guide can route to platform docs).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[755,756,757,760],{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":758,"slug":759,"type":13},"Frontend","frontend",{"name":761,"slug":762,"type":13},"Next.js","next-js","2026-07-12T08:47:49.223411",{"slug":765,"name":765,"fn":766,"description":767,"org":768,"tags":769,"stars":20,"repoUrl":21,"updatedAt":774},"contentful-personalization","build and debug Contentful personalization","Implement, extend, and debug Contentful personalization. Use onboarding for new, project-wide, or unknown setups; use extend-existing only for scoped work on an explicitly working integration. Trigger keywords: personalization, optimization, ninetailed, A\u002FB test, experiment, multivariate test, targeting, audience targeting, segments, variants, content variants, set up personalization, implement personalization, enable personalization, personalization not working, personalization broken, personalize this component, am I ready for personalization, experience API, Contentful Experiences, Experiences SDK, Studio Experiences, personalization in Next.js, @contentful\u002Foptimization, @ninetailed\u002Fexperience.js, run an experiment, check this URL, debug this live page, inspect network requests, check console errors, experience.ninetailed.co",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[770,771,772,773],{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":715,"slug":716,"type":13},{"name":758,"slug":759,"type":13},"2026-08-01T05:44:01.030731",8,{"items":777,"total":822},[778,784,789,795,801,808,815],{"slug":654,"name":654,"fn":696,"description":697,"org":779,"tags":780,"stars":20,"repoUrl":21,"updatedAt":707},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[781,782,783],{"name":701,"slug":702,"type":13},{"name":18,"slug":19,"type":13},{"name":705,"slug":706,"type":13},{"slug":643,"name":643,"fn":709,"description":710,"org":785,"tags":786,"stars":20,"repoUrl":21,"updatedAt":717},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[787,788],{"name":18,"slug":19,"type":13},{"name":715,"slug":716,"type":13},{"slug":4,"name":4,"fn":5,"description":6,"org":790,"tags":791,"stars":20,"repoUrl":21,"updatedAt":22},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[792,793,794],{"name":15,"slug":16,"type":13},{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"slug":676,"name":676,"fn":725,"description":726,"org":796,"tags":797,"stars":20,"repoUrl":21,"updatedAt":734},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[798,799,800],{"name":18,"slug":19,"type":13},{"name":690,"slug":691,"type":13},{"name":732,"slug":733,"type":13},{"slug":665,"name":665,"fn":736,"description":737,"org":802,"tags":803,"stars":20,"repoUrl":21,"updatedAt":748},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[804,805,806,807],{"name":741,"slug":742,"type":13},{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":746,"slug":747,"type":13},{"slug":750,"name":750,"fn":751,"description":752,"org":809,"tags":810,"stars":20,"repoUrl":21,"updatedAt":763},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[811,812,813,814],{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":758,"slug":759,"type":13},{"name":761,"slug":762,"type":13},{"slug":765,"name":765,"fn":766,"description":767,"org":816,"tags":817,"stars":20,"repoUrl":21,"updatedAt":774},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[818,819,820,821],{"name":18,"slug":19,"type":13},{"name":9,"slug":8,"type":13},{"name":715,"slug":716,"type":13},{"name":758,"slug":759,"type":13},7]