framework

Configuración de Next.js Pages Router, props estáticos, Tailwind 4, PostCSS e imágenes para esta aplicación.

npx skills add https://github.com/contentstack/kickstart-next-ssg --skill framework

Framework – kickstart-next-ssg

When to use

  • Changing routing, data loading at build time, global styles, or optimized images
  • Clarifying App Router vs this repo’s Pages Router setup

Instructions

Next.js router

  • This project uses the Pages Router under pages/: pages/index.tsx, pages/_app.tsx, pages/_document.tsx.
  • Home page uses getStaticProps to fetch the / page entry at build time via getPage("/") from @/lib/contentstack.
  • Client-only Live Preview wiring (useEffect, ContentstackLivePreview.onEntryChange) lives in the same page component.

Styles

Images

  • next.config.mjs: images.minimumCacheTTL and remotePatterns for Contentstack assets (images.contentstack.io, *-images.contentstack.com, or NEXT_PUBLIC_CONTENTSTACK_IMAGE_HOSTNAME).

Runtime

  • npm run dev / npm run build / npm run start are the supported Next.js workflows (see AGENTS.md).

Not in this repo

  • No app/ directory—do not assume React Server Components or App Router conventions unless you migrate the project.

Más skills de contentstack

brand-kit-assistant
contentstack
Advise users on Contentstack Brand Kit concepts, setup, governance, and on-brand AI generation. Route API-specific tasks to the right Brand Kit capability or…
official
cms-assets
contentstack
Asesorar a los desarrolladores sobre cómo organizar, entregar y transformar activos en Contentstack. Cubrir la estructura de carpetas, las transformaciones de la API de entrega de imágenes, la publicación…
official
cms-branches-aliases
contentstack
Asesorar a desarrolladores sobre el uso de ramas de Contentstack para desarrollo de contenido aislado y alias para implementaciones de contenido sin tiempo de inactividad. Cubrir estrategia de ramas, …
official
cms-data-modeling-best-practices
contentstack
Guía a los desarrolladores para modelar contenido en Contentstack usando la estructura reutilizable más simple. La habilidad explica cuándo usar tipos de contenido, referencias, global...
official
cms-entries
contentstack
Advise developers on querying, localizing, versioning, publishing, and structuring Contentstack entries for efficient delivery. Focus on CDA usage, reference…
official
cms-environments-publishing
contentstack
Asesorar a los desarrolladores sobre la configuración de entornos, la publicación de contenido, el uso de tokens de entrega y vista previa, el aprovechamiento de la Sync API y la comprensión de CDN y…
official
cms-live-preview-visual-builder-support-assistant
contentstack
Diagnostica y guía implementaciones de Contentstack Live Preview y Visual Builder. Rastrea el contexto de vista previa, identifica el contrato roto y recomienda la…
official
cms-localization
contentstack
Advise developers on Contentstack localization: language setup, fallback chains, localized vs unlocalized entries, non-localizable fields, and multi-locale…
official