Creating Public Static Page

A public static page in a SaaS site can be something like a pricing page, a contact page, a about page, etc. These pages are not dynamic and are not part of the application. They are just static pages that are part of the marketing site. In Nextbase, we have a (static-pages) route segment (folder) within our src/app folder which contains all the static pages.

So if you want to create a new static page, you can just create a new folder within the (static-pages) folder and create a new page within that folder. You can nest your static pages as deep as you want to get the route you are looking for.

The layout file for the static pages is at src/app/(static-pages)/layout.tsx.

import { Banner } from '@/components/presentational/tailwind/Banner/Banner';
import { Footer } from '@/components/presentational/tailwind/Footer/Footer';
import { MainNavigation } from '@/components/presentational/tailwind/Navigation';
import '@splidejs/react-splide/css';
import { ReactNode } from 'react';
 
export default function Layout({ children }: { children: ReactNode }) {
  return (
    <div>
      <div>
        <Banner />
        <MainNavigation />
 
        {children}
      </div>
      <Footer />
    </div>
  );
}

As you can see the layout has no additional configuration such as export const dynamic etc. Which means that this layout defauls to the next.js defaults and is static.