[
{
"path": ".gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.*\n.yarn/*\n!.yarn/patches\n!.yarn/plugins\n!.yarn/releases\n!.yarn/versions\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n.pnpm-debug.log*\n\n# env files (can opt-in for committing if needed)\n.env*\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnext-env.d.ts\n"
},
{
"path": "README.md",
"content": "# Next.js Multi-Tenant Example\n\nA production-ready example of a multi-tenant application built with Next.js 15, featuring custom subdomains for each tenant.\n\n## Features\n\n- ✅ Custom subdomain routing with Next.js middleware\n- ✅ Tenant-specific content and pages\n- ✅ Shared components and layouts across tenants\n- ✅ Redis for tenant data storage\n- ✅ Admin interface for managing tenants\n- ✅ Emoji support for tenant branding\n- ✅ Support for local development with subdomains\n- ✅ Compatible with Vercel preview deployments\n\n## Tech Stack\n\n- [Next.js 15](https://nextjs.org/) with App Router\n- [React 19](https://react.dev/)\n- [Upstash Redis](https://upstash.com/) for data storage\n- [Tailwind 4](https://tailwindcss.com/) for styling\n- [shadcn/ui](https://ui.shadcn.com/) for the design system\n\n## Getting Started\n\n### Prerequisites\n\n- Node.js 18.17.0 or later\n- pnpm (recommended) or npm/yarn\n- Upstash Redis account (for production)\n\n### Installation\n\n1. Clone the repository:\n\n ```bash\n git clone https://github.com/vercel/platforms.git\n cd platforms\n ```\n\n2. Install dependencies:\n\n ```bash\n pnpm install\n ```\n\n3. Set up environment variables:\n Create a `.env.local` file in the root directory with:\n\n ```\n KV_REST_API_URL=your_redis_url\n KV_REST_API_TOKEN=your_redis_token\n ```\n\n4. Start the development server:\n\n ```bash\n pnpm dev\n ```\n\n5. Access the application:\n - Main site: http://localhost:3000\n - Admin panel: http://localhost:3000/admin\n - Tenants: http://[tenant-name].localhost:3000\n\n## Multi-Tenant Architecture\n\nThis application demonstrates a subdomain-based multi-tenant architecture where:\n\n- Each tenant gets their own subdomain (`tenant.yourdomain.com`)\n- The middleware handles routing requests to the correct tenant\n- Tenant data is stored in Redis using a `subdomain:{name}` key pattern\n- The main domain hosts the landing page and admin interface\n- Subdomains are dynamically mapped to tenant-specific content\n\nThe middleware (`middleware.ts`) intelligently detects subdomains across various environments (local development, production, and Vercel preview deployments).\n\n## Deployment\n\nThis application is designed to be deployed on Vercel. To deploy:\n\n1. Push your repository to GitHub\n2. Connect your repository to Vercel\n3. Configure environment variables\n4. Deploy\n\nFor custom domains, make sure to:\n\n1. Add your root domain to Vercel\n2. Set up a wildcard DNS record (`*.yourdomain.com`) on Vercel\n"
},
{
"path": "app/actions.ts",
"content": "'use server';\n\nimport { redis } from '@/lib/redis';\nimport { isValidIcon } from '@/lib/subdomains';\nimport { revalidatePath } from 'next/cache';\nimport { redirect } from 'next/navigation';\nimport { rootDomain, protocol } from '@/lib/utils';\n\nexport async function createSubdomainAction(\n prevState: any,\n formData: FormData\n) {\n const subdomain = formData.get('subdomain') as string;\n const icon = formData.get('icon') as string;\n\n if (!subdomain || !icon) {\n return { success: false, error: 'Subdomain and icon are required' };\n }\n\n if (!isValidIcon(icon)) {\n return {\n subdomain,\n icon,\n success: false,\n error: 'Please enter a valid emoji (maximum 10 characters)'\n };\n }\n\n const sanitizedSubdomain = subdomain.toLowerCase().replace(/[^a-z0-9-]/g, '');\n\n if (sanitizedSubdomain !== subdomain) {\n return {\n subdomain,\n icon,\n success: false,\n error:\n 'Subdomain can only have lowercase letters, numbers, and hyphens. Please try again.'\n };\n }\n\n const subdomainAlreadyExists = await redis.get(\n `subdomain:${sanitizedSubdomain}`\n );\n if (subdomainAlreadyExists) {\n return {\n subdomain,\n icon,\n success: false,\n error: 'This subdomain is already taken'\n };\n }\n\n await redis.set(`subdomain:${sanitizedSubdomain}`, {\n emoji: icon,\n createdAt: Date.now()\n });\n\n redirect(`${protocol}://${sanitizedSubdomain}.${rootDomain}`);\n}\n\nexport async function deleteSubdomainAction(\n prevState: any,\n formData: FormData\n) {\n const subdomain = formData.get('subdomain');\n await redis.del(`subdomain:${subdomain}`);\n revalidatePath('/admin');\n return { success: 'Domain deleted successfully' };\n}\n"
},
{
"path": "app/admin/dashboard.tsx",
"content": "'use client';\n\nimport { useActionState } from 'react';\nimport { Button } from '@/components/ui/button';\nimport { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';\nimport { Trash2, Loader2 } from 'lucide-react';\nimport Link from 'next/link';\nimport { deleteSubdomainAction } from '@/app/actions';\nimport { rootDomain, protocol } from '@/lib/utils';\n\ntype Tenant = {\n subdomain: string;\n emoji: string;\n createdAt: number;\n};\n\ntype DeleteState = {\n error?: string;\n success?: string;\n};\n\nfunction DashboardHeader() {\n // TODO: You can add authentication here with your preferred auth provider\n\n return (\n