Adding a Search Widget to a Next.js project (Part 2)
In the previous article, we prepared only the language switching box so that you can add the Sitecore Search widget. This time, we would like to add the widget and display the search results.
Next.js
Next.js is a React-based framework that provides functionality to enable server-side rendering and static site generation using React.
Adding a Search Widget to a Next.js project (Part 1)
Until now, the blog has used the Sitecore Search SDK to display search results. In this article, we will show you how it actually works by adding a widget to the plain Next.js environment.
Add headers and footers
This time we will add a header and footer to the Next.js application. No external integration is included this time.
Enable Dark mode for NextUI
You can switch between light and dark modes on the website. I personally use the dark mode. In this article, I will confirm the procedure to implement this in NextUI.
Use NextUI
The sample we have been running so far had no minimal design and only displayed text. In order to make it look a little nicer, we are going to make NextUI available in the project.
Setting up Google Tag Manager in Next.js (App Router)
I would like to set up Google Tag Manager for the Next.js App Router sample I created last time. By using this, we can easily integrate with other Sitecore products as well as analytics.
About Next.js' App Router
In Next.js, the routing mechanism switched to the new App Router in version 13.4. The previous method is now referred to as Page Routing, which remains available, but the App Router will become the standard. This time, we'll review the new App Router.
Connect your local Next.js project to XM Cloud
In this article, we will introduce how to connect your Next.js project directly to an instance of XM Cloud.
Haramizu.com website has been renewed!
The site had not been updated for a while, but there were some problems with the volume of content and old articles that had been left untouched, so we took a look at renewing the site.
Easily launch Headless SXA in Sitecore 10.3
We've previously detailed how to run Sitecore 10.3 container environments and add SXA locally. To simplify this repetitive process, we've created a repository for easy startup. This guide will introduce how to use the repository to launch the environment.
Add a Next.js project
The headless site we created last time is still just the site core items. In this article, we will add the Next.js project to the site and show how the pages can be edited.
Add a headless site
Continuing from the last project, we'll add a headless site and integrate it with a Next.js project. Since the process is lengthy, this time we'll focus on adding the headless site and serializing its data for reuse.