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 / 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-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.
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
Next.js 14 - File upload with Dropzone, styled with TailwindCss
Let's build a nice-looking upload form with Next.js 14. We will integrate a dropzone and the capability to upload multiple files simultaneously with a fancy upload progress bar.
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 - Create fancy animations in seconds with TailwindCss
Some months ago, when I was working on a project, the Idea came up to animate the button so that it shows “bouncing dots” as long as the process in the background was not finished.
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 - Rate Limiting with Upstash Redis made easy.
Ensuring system availability is crucial for any product. Implementing rate limiting effectively addresses these issues and can be integrated seamlessly.
Next.js 14 -Advanced Search Integration with Algolia UI Libraries (Widgets)
In this follow-up story, I will show you how to easily integrate the Algolia Instant search into your existing Next.js 14 project. We will also use custom styling with TailwindCss.
Next.js 14 / Upstash Redis - Adding a Clap Function within minutes
I will show you how fast you can add a clap function to your blog posts. We use Upstash Redis as our serverless DB, Next.js 14 for the App, and Azure AD B2C with Next-Auth
Next.js 14 - useMemo / useCallback - Detailed explanation of two React hooks
React introduced the useMemo and useCallback hooks in React 16.8, which was released on February 6, 2019. So, as of August 2024, these hooks are five years and 6 months old.
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
Next.js 14 — Building a SaaS Solution on Azure (Storage Accounts etc.) — Part 4
In this final part of our series on building a SaaS solution using Next.js 14 and Azure, we will focus on the critical aspect of managing Azure Storage Accounts.
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 / SEO - Create a Sitemap Counter in 5 minutes
An up-to-date sitemap.xml builds the foundation for the Google Crawler. We will create a count function to check the sitemap.xml. This will help us to check if all pages are present.
Next.js 14 - App Router Middleware HTTP Basic Auth with Typescript
In this how-to, I will show you how to add HTTP basic auth to your next.js 14 App. Basic Auth is a feature Vercel offers, but only for the Pro Plan.
Next.js 14 -Advanced Analytics with new Styles, and new Widgets - Part 2
In this post, we will proceed with our analytics dashboard. We will add new styling with TailwindCss and new Widgets to our Dashboard, which we created in our existing Nextjs 14 project.
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.