Page Component

PageComponent is a functional component that defines a page in a Rasengan.js app.

tsximport { PageComponent } from "rasengan";
 
const Home: PageComponent = () => {
  return (
    <div>Home page</div>
  )
}
 
Home.path = "/";
Home.metadata = {
  title: "Home",
  description: "Home Page"
}
 
export default Home;

Similar to LayoutComponent, the PageComponent component requires a path property to define the route of the page.

The PageComponent functional component has the following properties and methods:

• path: The path of the page. It is used to define the route of the page.
• metadata: The metadata of the page. It is used to define the title, description of the page and other things.

• loader(): Similar to getServerSideProps() in Next.js, this method is used to make some operations on the server before the page is rendered.

The loader() method is optional. The returned promise has to follow the following structure:

tstype LoaderResponse = {
  props?: { [key: string]: any };
  redirect?: string
};

All what was mentioned in the LayoutComponent section about loader is applied here.

Just read the loader paragraph in the LayoutComponent section.