Overview:

The “Agility CMS & Next.js Starter” is a Next.js starter site that integrates with Agility CMS. It aims to provide a foundation for building fully static sites using Next.js and Agility CMS. The starter site is connected to a sample Agility CMS instance for sample content and pages. It supports features such as full page management, preview mode, image optimization using Next.js’ image component, incremental static regeneration (ISR) builds, component level data fetching, and more. The starter site is written in TypeScript and utilizes Tailwind CSS for styling.

Features:

• Easy Integration: Uses the Agility CMS Next.js package to simplify the integration with Agility CMS.
• Support for Next.js 13 and React 18: Compatible with the latest versions of Next.js and React.
• Full Page Management: Allows for managing and rendering pages from Agility CMS.
• Preview Mode: Supports previewing content changes before publishing.
• Image Optimization: Supports image optimization using either the Next.js Image component or the Agility CMS Next.js Image component.
• Incremental Static Regeneration: Enables incremental static regeneration (ISR) builds using the “revalidate” and “fallback” properties.
• Component Level Data Fetching: Provides support for fetching data at the component level.
• Tailwind CSS: Utilizes Tailwind CSS for a simple and lightweight utility-first CSS framework.
• TypeScript Support: Written in TypeScript, with ESLint for code quality.

Installation:

To get started with the Agility CMS & Next.js Starter, follow these steps:

1. Sign up for a free account on Agility CMS and create a new instance using the Blog Template.
2. Clone this repository to your local machine.
3. Run npm install or yarn install to install the required dependencies.
4. Rename the .env.local.example file to .env.local.
5. Retrieve your GUID, API Keys (Preview/Fetch), and Security Key from Agility CMS by going to Settings > API Keys.
6. Run the following commands to run the site locally:

Development Mode:

yarn
yarn dev

Production Mode:

yarn
yarn build
yarn start

Summary:

The Agility CMS & Next.js Starter is a convenient solution for building fully static sites using Next.js and Agility CMS. It provides a range of features including easy integration, support for Next.js 13 and React 18, full page management, preview mode, image optimization, incremental static regeneration, component level data fetching, and more. The starter site leverages Tailwind CSS for styling and is written in TypeScript for improved code quality. With its comprehensive features and ease of use, the Agility CMS & Next.js Starter is an efficient starting point for developers looking to create static sites with Next.js and Agility CMS.