More Premium Hugo Themes Premium Nextjs Themes

Strapi Starter Next Corporate

Next.js starter for creating a corporate site with Strapi.

Strapi Starter Next Corporate

Next.js starter for creating a corporate site with Strapi.

Author Avatar Theme by strapi
Github Stars Github Stars: 346
Last Commit Last Commit: Mar 28, 2022 -
First Commit Created: Apr 29, 2023 -
default image

Overview:

The Strapi Starter Next Corporate Site is a starter template designed for creating a corporate website using Strapi, a headless CMS. This starter allows marketing teams to manage website content easily within Strapi without the need for developers. It also generates a Next.js app automatically.

Features:

  • Pages creation within Strapi with no code necessary.
  • Fully flexible page structure, allowing the design of customizable pages using UI Sections.
  • 8 UI Sections included out of the box, such as Hero, RichText, LargeVideo, Testimonials, Pricing, BottomActions, FeatureRows, and FeatureColumns.
  • Easy theming with Tailwind CSS.
  • Static site generation with Next.js.
  • Integrated Preview Mode, enabling the viewing of pages on a private URL before publishing them.
  • Support for multiple languages using i18n.

Installation:

To create a project using the Strapi Starter Next Corporate Site, follow these steps:

  1. Use the create-strapi-starter CLI to create your project.
  2. The CLI will create a monorepo, install the necessary dependencies, and run your project automatically.
  3. The Next.js frontend server will run on http://localhost:3000.
  4. The Strapi backend server will run on http://localhost:1337.

To enable Preview Mode, use the following URL after starting the project:

http://localhost:3000/api/preview?secret=<preview-secret>&slug=<slug>

Replace <preview-secret> with the secret token defined in your .env configuration, and <slug> with the slug you entered in Strapi for your page. Preview Mode allows access to draft pages and displays a banner indicating its status.

To customize the corporate site, you need to run both the frontend and backend in your development environment.

To add new sections to the website, follow these steps:

  1. Create a new component in Strapi under the “sections” category.
  2. In the Content-Types Builder, open the Pages collection and select your new section in the contentSections field.
  3. Create a React component that takes a data prop in /frontend/components/sections.
  4. To link your Strapi section to the React component, open /frontend/components/sections.js and add an entry to the sectionComponents object.

To customize the theme of the website, modify the /front/tailwind.config.js file. The website uses Tailwind CSS for styling. Refer to the Tailwind docs for all the possible changes you can make, such as changing the primary color.

To deploy the frontend and backend projects separately in production, follow the respective deployment documentation for Strapi and Next.js.

Summary:

The Strapi Starter Next Corporate Site is a versatile starter template that allows marketing teams to easily manage and design a corporate website using Strapi. With features such as flexible page structure, customizable UI sections, and support for multiple languages, it provides a user-friendly experience for creating and maintaining a corporate website. The integration with Next.js enables static site generation for optimal performance. The ability to customize the theme and add new sections provides flexibility, while the Preview Mode allows for previewing pages before publishing.