A statically generated marketing & blog site made with Contentful and the Next.js 13 beta features like the App Router and React Server Components.
The content manager has complete flexibility to create new pages in Contentful, which are rendered as dynamic route segments, and statically generated at build time (Static Site Generation).
The site also includes a blog page and a contact form page.
- New
app
directory routing, - Data Fetching
- Route handlers
- Server Components
- Headless CMS with Contentful
- Styled using Tailwind CSS
- Written in TypeScript
- You will need a Contentful account.
- You will need a Gmail account to work with nodemailer for the contact form. See the nodemailer docs.
-
Clone the repo
git clone https://github.com/james-langridge/nextjs-contentful-marketing-blog.git
-
Install NPM packages
npm install
-
Copy
.env.example
to.env.local
and update the variables.cp .env.example .env.local
-
Import the content types into your Contentful space with the Contentful CLI. This only imports the content types that correspond with the React components. You will have to create pages and add content and assets in Contentful.
npm install -g contentful-cli contenful login contentful space import --content-file ./lib/export.json
-
Start the development server:
npm run dev
You can clone and deploy this project on Vercel using the button below, provided you have completed the prerequisites above (email, Contentful CMS).
See the Next.js deployment documentation for more details.
Distributed under the MIT License.