From fc6ef06c53fa4d87ea714c64ea04a3a35e6f13a5 Mon Sep 17 00:00:00 2001
From: ruhil6789 <sachinruhil11@gmail.com>
Date: Sun, 22 Feb 2026 23:27:09 +0530
Subject: [PATCH] add missing link

---
 apps/playground/src/data/links-frameworks.ts  |  6 +-
 apps/playground/src/data/links-resources.ts   |  8 ++
 .../src/data/links-starter-templates.ts       | 58 +++++++++++++++
 .../src/pages/starter-templates/index.tsx     | 73 +++++++++++++++++++
 4 files changed, 142 insertions(+), 3 deletions(-)
 create mode 100644 apps/playground/src/data/links-starter-templates.ts
 create mode 100644 apps/playground/src/pages/starter-templates/index.tsx

diff --git a/apps/playground/src/data/links-frameworks.ts b/apps/playground/src/data/links-frameworks.ts
index 38393f36f..0f3a92d72 100644
--- a/apps/playground/src/data/links-frameworks.ts
+++ b/apps/playground/src/data/links-frameworks.ts
@@ -5,13 +5,13 @@ import { MenuItem } from "~/types/menu-item";
 export const metaNextjs = {
   title: "Next.js",
   desc: "React-based web applications with server-side rendering and static website generation",
-  link: "/getting-started/frameworks/nextjs",
+  link: "/resources/platforms/nextjs",
 };
 
 export const metaSvelte = {
   title: "Svelte",
   desc: "Cybernetically enhanced web apps",
-  link: "/getting-started/frameworks/svelte",
+  link: "/svelte/getting-started",
 };
 
 // vite
@@ -28,7 +28,7 @@ export const linksFrameworks: MenuItem[] = [metaNextjs, metaSvelte];
 export const metaFrameworks: MenuItem = {
   title: "Setup on Frameworks",
   desc: "Get started with Mesh on different frameworks",
-  link: "/getting-started/frameworks",
+  link: "/resources/platforms",
   items: linksFrameworks,
   icon: CpuChipIcon,
 };
diff --git a/apps/playground/src/data/links-resources.ts b/apps/playground/src/data/links-resources.ts
index a896058e8..4b29b18bb 100644
--- a/apps/playground/src/data/links-resources.ts
+++ b/apps/playground/src/data/links-resources.ts
@@ -1,5 +1,6 @@
 import {
   AcademicCapIcon,
+  CubeIcon,
   DocumentTextIcon,
   Squares2X2Icon,
   StarIcon,
@@ -7,9 +8,16 @@ import {
 
 import { MenuItem } from "~/types/menu-item";
 import { metaGuides } from "./links-guides";
+import { metaStarterTemplates } from "./links-starter-templates";
 
 export const linksResources: MenuItem[] = [
   metaGuides,
+  {
+    title: metaStarterTemplates.title,
+    desc: metaStarterTemplates.desc,
+    link: metaStarterTemplates.link,
+    icon: CubeIcon,
+  },
   {
     title: "Documentation",
     desc: "Full documentation for MeshJS",
diff --git a/apps/playground/src/data/links-starter-templates.ts b/apps/playground/src/data/links-starter-templates.ts
new file mode 100644
index 000000000..a7ab0f0e5
--- /dev/null
+++ b/apps/playground/src/data/links-starter-templates.ts
@@ -0,0 +1,58 @@
+/**
+ * Starter templates from https://github.com/MeshJS?q=template&type=all
+ * Each template can have a live demo at https://<repo-name>.meshjs.dev
+ */
+
+export type StarterTemplate = {
+  name: string;
+  description: string;
+  githubUrl: string;
+  liveUrl?: string;
+};
+
+export const starterTemplates: StarterTemplate[] = [
+  {
+    name: "Next.js",
+    description:
+      "Start a new project on Next.js with connect wallet button and wallet integration.",
+    githubUrl: "https://github.com/MeshJS/mesh-nextjs-template",
+    liveUrl: "https://starter-template.meshjs.dev",
+  },
+  {
+    name: "Svelte",
+    description: "Start a new project with Svelte and Mesh.",
+    githubUrl: "https://github.com/MeshJS/mesh-svelte-template",
+    liveUrl: "https://mesh-svelte-template.meshjs.dev",
+  },
+  {
+    name: "Aiken",
+    description: "Build with Aiken smart contracts and Mesh.",
+    githubUrl: "https://github.com/MeshJS/mesh-aiken-template",
+    liveUrl: "https://aiken-template.meshjs.dev",
+  },
+  {
+    name: "Midnight",
+    description: "Mesh Midnight starter template with counter contract and Vite React frontend.",
+    githubUrl: "https://github.com/MeshJS/midnight-starter-template",
+  },
+  {
+    name: "Minting",
+    description: "Sell native tokens with multi-sig minting.",
+    githubUrl: "https://github.com/MeshJS/minting-template",
+    liveUrl: "https://minting-template.meshjs.dev",
+  },
+  {
+    name: "Standalone",
+    description: "Execute a standalone script to manage wallets and create transactions.",
+    githubUrl: "https://github.com/MeshJS/standalone-template",
+  },
+];
+
+export const metaStarterTemplates = {
+  title: "Starter Templates",
+  desc: "Scaffold a new project with Mesh using our starter templates. Each template includes wallet connection and integration to get you building quickly.",
+  link: "/starter-templates",
+};
+
+export const GITHUB_TEMPLATES_URL =
+  "https://github.com/MeshJS?q=template&type=all&language=&sort=";
diff --git a/apps/playground/src/pages/starter-templates/index.tsx b/apps/playground/src/pages/starter-templates/index.tsx
new file mode 100644
index 000000000..e5acc5088
--- /dev/null
+++ b/apps/playground/src/pages/starter-templates/index.tsx
@@ -0,0 +1,73 @@
+import type { NextPage } from "next";
+
+import Link from "~/components/link";
+import Metatags from "~/components/site/metatags";
+import {
+  starterTemplates,
+  metaStarterTemplates,
+  GITHUB_TEMPLATES_URL,
+} from "~/data/links-starter-templates";
+import CenterPadded from "~/components/layouts/root/center-padded";
+import CenterAlignHeaderParagraph from "~/components/sections/center-align-header-paragraph";
+
+const StarterTemplatesPage: NextPage = () => {
+  return (
+    <>
+      <Metatags
+        title={metaStarterTemplates.title}
+        description={metaStarterTemplates.desc}
+      />
+      <CenterPadded>
+        <CenterAlignHeaderParagraph headerTitle={metaStarterTemplates.title}>
+          {metaStarterTemplates.desc}
+        </CenterAlignHeaderParagraph>
+
+        <p className="mb-8 text-center text-neutral-500 dark:text-neutral-400">
+          All starter templates are available on{" "}
+          <Link href={GITHUB_TEMPLATES_URL} className="font-medium">
+            GitHub
+          </Link>
+          . Use{" "}
+          <code className="rounded bg-neutral-200 px-1.5 py-0.5 dark:bg-neutral-700">
+            npx meshjs your-app-name
+          </code>{" "}
+          to scaffold with the Mesh CLI.
+        </p>
+
+        <div className="grid gap-6 sm:grid-cols-1 lg:grid-cols-2">
+          {starterTemplates.map((template) => (
+            <div
+              key={template.githubUrl}
+              className="flex flex-col rounded-lg border border-neutral-200 bg-white p-6 shadow-sm dark:border-neutral-700 dark:bg-neutral-800"
+            >
+              <h3 className="mb-2 text-lg font-bold text-neutral-900 dark:text-white">
+                {template.name}
+              </h3>
+              <p className="mb-4 flex-1 text-sm text-neutral-500 dark:text-neutral-400">
+                {template.description}
+              </p>
+              <div className="flex flex-wrap gap-4">
+                <Link
+                  href={template.githubUrl}
+                  className="inline-flex items-center text-sm font-medium text-primary-600 hover:underline dark:text-primary-400"
+                >
+                  Source on GitHub
+                </Link>
+                {template.liveUrl && (
+                  <Link
+                    href={template.liveUrl}
+                    className="inline-flex items-center text-sm font-medium text-primary-600 hover:underline dark:text-primary-400"
+                  >
+                    Live demo
+                  </Link>
+                )}
+              </div>
+            </div>
+          ))}
+        </div>
+      </CenterPadded>
+    </>
+  );
+};
+
+export default StarterTemplatesPage;