Algolia and Next.js 14 — Easy Integration as On-Site-Search at no cost
Every Blog needs a lightning-fast search and content filtering. Let’s use one of the best services in the market and combine it with a nice-looking Tag Cloud delivered in Milliseconds.
Next.js 14 -Algolia search with native HighLight and snippet components
Now, we will examine the last two widgets (“HighLight” and “Snippet”), which we did not use in our previous post, where the focus was on SearchBox, Hits, and RefinementList.
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 -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.
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.
Nextjs Content Management, Quo Vadis?
You plan to start a new business where you need to present your new products to a broader audience on a marketing website. Here you will find a complete guide.
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 - 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 - 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
Azure AD B2C: Integrate one of the best Authentication and Authorization Platforms to your Next.js 14 Project for free
One part is still missing for our fully-fledged blog project based on Next.js 14, Contentful and Algolia. And that is user registration and login (authentication and authorization), which is essential nowadays. We will use AD B2C.
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
Why I started a tech blog in 2024
I reviewed my notes on Confluence, where I created hundreds of pages with sometimes meaningful and sometimes (after years) content without any sense because of the missing or forgotten context. I had the feeling that all these notes should be shared with others because I can remember all the sweat and patience, which I invested in collecting the content.
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 - 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
Automated creation of Azure resources via CLI in Next.js - Part 3
In the third story, we will use our Next.js app to get the Azure AD B2C Access Token to create Resources on Azure via the App Service created initially.
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)
Integrating Azure AD B2C into Next.js 14 with ease
We will focus on integrating this tenant into a full-fledged Next.js 14 project. As a template, we will take the example that we created in the previous stories