diff --git a/apps/next/app/page.tsx b/apps/next/app/page.tsx
index 28ea73a..f4f2518 100644
--- a/apps/next/app/page.tsx
+++ b/apps/next/app/page.tsx
@@ -1,17 +1,48 @@
-import { DoubleServerNumber } from 'double-server-number'
+import {
+  submitDoubleServerNumber,
+  DoubleServerNumberShell,
+  DoubleServerNumberValue,
+  DoubleServerNumber,
+} from "double-server-number/rsc";
+import { DoubleServerNumberForm } from "double-server-number";
+import { revalidatePath } from "next/cache";
 
 export default async function HomePage() {
+  async function action(data: FormData) {
+    "use server";
+    await submitDoubleServerNumber({}, data);
+    revalidatePath("/");
+  }
+
   return (
     <main className="page-shell">
       <div className="copy-block">
         <p className="eyebrow">Next.js 16 App Router</p>
         <h1>Shared React Server Component import</h1>
         <p>
-          This page renders the workspace package directly from a Next.js server component.
+          This page renders the workspace package directly from a Next.js server
+          component.
         </p>
       </div>
-
-      <DoubleServerNumber title="double-server-number in Next.js" />
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "row",
+          gap: "1rem",
+        }}
+      >
+        <div>
+          <h2>Exported with internal action</h2>
+          <DoubleServerNumber />
+        </div>
+        <div>
+          <h2>Decomposed with invalidating cache</h2>
+          <DoubleServerNumberShell>
+            <DoubleServerNumberValue />
+            <DoubleServerNumberForm action={action} />
+          </DoubleServerNumberShell>
+        </div>
+      </div>
     </main>
-  )
+  );
 }
diff --git a/apps/next/next.config.ts b/apps/next/next.config.ts
index b54597b..cb651cd 100644
--- a/apps/next/next.config.ts
+++ b/apps/next/next.config.ts
@@ -1,10 +1,5 @@
 import type { NextConfig } from "next";
 
-const nextConfig: NextConfig = {
-  transpilePackages: ["double-server-number"],
-  env: {
-    PORT: "3010",
-  },
-};
+const nextConfig: NextConfig = {};
 
 export default nextConfig;
diff --git a/apps/next/package.json b/apps/next/package.json
index 81ead9f..8b2bdc1 100644
--- a/apps/next/package.json
+++ b/apps/next/package.json
@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "dev": "next dev"
+    "dev": "next dev -p 3010"
   },
   "dependencies": {
     "double-server-number": "workspace:*",