Home Page

NestSaaS provide two type of Home Page:

• home1: Landing Page for SaaS product marketing sections, app/(home)/home1
• home2: Home Page with content sections, app/(home)/home2

You can choose use one of them according to your website's targets.

In this documentation, introduce home2 configuration, for home1 configuration refer to landing page configuration.

The home page configuration defines the content sections displayed on your application's home page, including featured items, newest content, and space listings.

Location

/config/home-config.ts

Key Components

Home Section Configuration

export interface HomeSectionConfig {
  spaceSlug: string    // Which space to pull content from
  title: string        // Section title
  layout: "grid" | "list"  // Display layout
  limit: number        // Number of items to show
  filter?: {           // Optional filters
    status?: Status    // Content status (e.g., PUBLISHED)
    featured?: boolean // Featured items only
    categoryId?: number // Filter by category
    tagId?: number     // Filter by tag
    orderBy?: string   // Sort order
  }
}

Home Page Structure

const homeConfig: HomeConfig = {
  // Optional hero section
  // heroSection: {
  //   spaceSlug: "tech",
  //   limit: 1,
  //   filter: {
  //     featured: true,
  //   },
  // },
 
  // Content sections
  sections: [
    {
      spaceSlug: "product",
      title: "Featured Products",
      layout: "grid",
      limit: 4,
      filter: { featured: true },
    },
    // Additional sections...
  ],
 
  // Space listings
  showAllSpaces: true,
  spacesLimit: 8,
}

Usage

The home configuration is implemented in the content listing page component at app/(home)/home2/page-contentlist.tsx. This component renders multiple content sections based on the configuration, displaying each section with the appropriate layout and content filters.

Customization

• Add or remove sections by modifying the sections array
• Enable the hero section by uncommenting and configuring the heroSection object
• Adjust the layout of each section between "grid" and "list"
• Configure filters to display specific content:
  • featured: true to show only featured content
  • orderBy: "createdAt_DESC" to show newest content first
  • status: Status.PUBLISHED to show only published content
• Set showAllSpaces: false to hide the spaces listing section
• Adjust spacesLimit to control how many spaces are displayed