diff --git a/examples/hello-world-ssr/pages/index.tsx b/examples/hello-world-ssr/pages/index.tsx
index 0e6e73e0d..fa3cecb68 100644
--- a/examples/hello-world-ssr/pages/index.tsx
+++ b/examples/hello-world-ssr/pages/index.tsx
@@ -1,7 +1,11 @@
-import React from 'https://esm.sh/react'
+import React, { FC } from 'https://esm.sh/react'
 import type { SSROptions } from 'https://deno.land/x/aleph/types.d.ts'
 
-export const ssr: SSROptions = {
+type Props = {
+  serverTime: number
+}
+
+export const ssr: SSROptions<Props> = {
   props: async router => {
     return {
       $revalidate: 1, // revalidate props after 1 second
@@ -13,8 +17,10 @@ export const ssr: SSROptions = {
   }
 }
 
-export default function Page(props) {
+const Page: FC<Props> = (props) => {
   return (
     <p>Now: {props.serverTime}</p>
   )
 }
+
+export default Page
diff --git a/types.d.ts b/types.d.ts
index c19bf0e6c..de2ab7e6f 100644
--- a/types.d.ts
+++ b/types.d.ts
@@ -236,16 +236,15 @@ export type GlobalSSROptions = {
 /**
  * The **SSR** props.
  */
-export type SSRProps = {
-  [key: string]: any
+export type SSRProps<Props> = Props & {
   $revalidate?: number
 }
 
 /**
  * The **SSR** options for pages.
  */
-export type SSROptions = {
-  props?(router: RouterURL): (SSRProps | Promise<SSRProps>)
+export type SSROptions<Props = {}> = {
+  props?(router: RouterURL): (SSRProps<Props> | Promise<SSRProps<Props>>)
   paths?(): (string[] | Promise<string[]>)
 }