Static Pages

The Kenya Estates platform includes several static pages that provide essential information to users, such as legal terms, privacy policies, and general information about the platform. These pages are typically content-driven and do not require dynamic data fetching on every request, making them ideal for static generation in Next.js.

Key Static Pages

The platform features the following primary static pages:

  • Terms of Service (/terms): Outlines the rules and regulations for using the platform.
  • Privacy Policy (/privacy): Details how user data is collected, used, and protected.
  • Cookie Policy (/cookies): Explains the use of cookies on the platform and how users can manage their preferences.
  • About Us (Potentially part of the homepage or a separate page): Provides background information about Kenya Estates, its mission, and its team.
  • Contact Us (Often a simple form or informational page): Offers ways for users to get in touch with the support team.

Implementation in Next.js

These pages are implemented as standard Next.js pages within the app directory. For example:

  • app/terms/page.tsx
  • app/privacy/page.tsx
  • app/cookies/page.tsx

Since the content of these pages changes infrequently, they are excellent candidates for Static Site Generation (SSG) or server-side rendering with heavy caching. In the Next.js App Router, components are Server Components by default, which can be statically rendered at build time if they don't rely on dynamic data or functions.

Content Management

Currently, the content for these static pages is hardcoded within their respective .tsx files. This is a straightforward approach for content that rarely changes.

For future enhancements, the content for these pages could be managed through a Headless CMS (Content Management System) or a simple admin interface. This would allow non-technical users to update the content without needing to modify the codebase. If a CMS were integrated, these pages would fetch their content at build time (using generateStaticParamsif routes were dynamic, or simply fetching data within the Server Component).

Styling and Layout

Static pages share the common layout defined in app/layout.tsx, ensuring a consistent header, footer, and overall site navigation. Styling is typically handled using Tailwind CSS, consistent with the rest of the platform. The content itself is often wrapped in a container that provides appropriate padding and max-width for readability, similar to this documentation site (e.g., using a prose class for typographic defaults).

SEO Considerations

Each static page should have appropriate metadata (title, description) for SEO purposes. In Next.js, this can be achieved using the metadata object exported from the page file.


// Example: app/terms/page.tsx
import { Metadata } from 'next';

export const metadata: Metadata = {
  title: 'Terms of Service | Kenya Estates',
  description: 'Read the Terms of Service for using the Kenya Estates platform.',
};

export default function TermsPage() {
  return (
    <div className="container mx-auto py-8 px-4">
      <h1 className="text-3xl font-bold mb-6">Terms of Service</h1>
      <div className="prose dark:prose-invert max-w-none">
        <p>Your terms content here...</p>
      </div>
    </div>
  );
}

These pages are also included in the sitemap.ts to ensure they are discoverable by search engines.