# Page

## Overview

Consider page-specific components (page), If there are components that are specific to a particular page, it is better to keep them within the page directory. This can help to keep the code organized and make it easier to understand the relationships between the components and the pages they belong to.

## How to use

If you are going to create a web page that applies only to the project then you can use this method.&#x20;

### Step 1: Create routing page index

The first step you have to create a index file page. Folder in `src/pages`

```
pages
└── index.tsx
```

### Step 2: Create page-specific component

The next step is to create some files that are used for the partial design of the page. Folder in `src/components/page`

```
components/page
└── Homepage
    └── index.tsx
```

Regarding naming conventions folder components, you can use `<page name>page` with capitalize.

### Step 3: Import page component

In the routing page we will import the related page component that was separated earlier. code can be put in `pages/index.tsx`

```tsx
// Vendors
import React from 'react';
import Head from "next/head";
import type { ReactElement } from "react";
import type { NextPageWithLayout } from "./_app";

// Layouts
import CustomizedLayout from "@/layouts/CustomizedLayout";

// Components
import Homepage from "@/components/page/Homepage";

const Home: NextPageWithLayout = () => {
  return (
    <>
      <Head>
        <title>Create Tokenomy App</title>
        <meta name="description" content="Generated by create tokenomy app" />
      </Head>
      <Homepage />
    </>
  );
}

Home.getLayout = function getLayout(page: ReactElement) {
  return <CustomizedLayout>{page}</CustomizedLayout>;
};

export default Home;
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://tokenomy.gitbook.io/boilerplate-code/features/components/page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
