Contentful and Next.js 14 - Easy Creation & Integration of New Content Types for Landing Pages
Every Blog needs a nice-looking landing page. This step-by-step guide will add two new content types in Contentful and show the newly added data on our Next.js 14 blog project.
Contentful Headless CMS — Managing Content via REST
There are several ways to manage content (Creating, updating, deleting, and delivering content). Let’s do a deep dive into this CMS's REST capabilities.
Is Contentful the Right CMS for Next.js 14 Projects
Contentful and Next.js are two popular tools in the world of web development. Contentful is a CMS that allows users to create, manage, and publish content
Next.js 14 / Contentful- Professional Syntax Highlighting
I will reuse the component I created in the previous story combined with the headless CMS Contentful. So I can create my Content within Contentful and use Next.js 14 for the visualization
Next.js 14 - Working with Contentful Tags and TailwindCss
Contentful offers a great tagging system. I will show you how we can use it to cluster content by tags and expose new " tag pages," with the related content
Extended content sync from Contentful to Algolia with Next.js 14
Enrich Contentful payload from webhook with Next.js 14 routes to push the needed data to Algolia. Extract Json from Rich-Text field to index the right content.
Next.js 14 - How to Use Contentful Environments and Aliases
In this story, I will show you how to use Contentful Environments and Aliases in your Nextjs 14 project. Environments are a great way to change your project's data structure.
Next.js 14 - Complete Example - Typescript / Tailwindcss / Contentful - Part 2
Let's dig deeper and build a nice UI on our Nextjs foundation with the help of Tailwindcss/Contentful
Next.js 14 - Complete Example - Typescript / App Router / Contentful with GraphQL - Part 1
Let’s create a completely new website powered with next.js 14, Contentful, and Typescript
Next.js 14 -Data model extension and Contentful data sync with API route
We will walk through the process of a complete data re-sync between Contentful and Algolia with two Custom API Routes in Nextjs 14, and we will extend the Algolia Data Model.
Next.js 14 - Complete Example - Header / Footer / Tailwindcss / Contentful - Part 3
Now we have reached part 3 and we will add a header and a footer component, as well as the so-called draft/preview functionality offered by Contentful. Not to forget the nowadays mandatory dark mode toggle.
Next.js 14 - Flyout menus with TailwindCSS & Contentful - Part 2
In the previous story, we created the components for the flyout menu and did the basic integration. Now, we will connect the menu with our headless CMS Contentful.
Next.js 14 - Endless Scroll with Contentful and Server Actions
As your blog grows, you may need a function like "Load more" or "Infinite scroll." I will focus on that and show how easy it is with Next.js 14, Server Actions, and Contentful as CMS.
Next.js 14 - Creating an HTML Sitemap in 5 minutes with Contentful
An HTML sitemap lists and links to all pages on a website, providing an organized overview of its structure. Search engines benefit from HTML sitemaps as they ensure all pages are discovered
Next.js 14 — Complete Example — Adding Internationalization / Multilanguage to our Blog based on Contentful/GraphQL — Part 5
In Part 5, we will add multilanguage support and a language switcher to our example Blog powered by Contentful and the GraphQL API. (Client/Server Components)
Next.js 14-Caching/Revalidation-Real-world example with CMS
I will guide you through the possibilities of caching and revalidation in Nextjs 14. I will use Contentful as a headless CMS for content management.
Next.js 14 -Advanced Analytics with Tinybird and integrated Dashboard
We introduce the platform Tinybird and integrate the provided Javascript Snippet for the data collection. Then, we integrate the Analytic Dashboard into our existing Nextjs 14 project.
Improving Website Visibility: The Importance of Next.js SEO
Server-side rendering (SSR) and static site generation (SSG) are at the core of Next.js’s SEO capabilities to support search engine crawlers
Next.js 14 - Expand your SEO tools with Slugify/Word & Letter Counter
A slugify function is valuable for creating clean, readable, and SEO-friendly URLs that enhance user experience. To round up the service offering, we add a Word/Character count as well
Next.js 14 - Complete Example - Custom 404 Page / Loading UI / TailwindCss (ExtraColors) — Part 4
In Part 4 we are going to add a custom 404 page, a loading UI (SVG Spinner) and we add some extra colors to our tailwind.config.ts