{"id":29057708,"url":"https://github.com/xjectro/payload-cms-boilerplate","last_synced_at":"2026-04-04T20:33:01.278Z","repository":{"id":301442127,"uuid":"1007128052","full_name":"Xjectro/payload-cms-boilerplate","owner":"Xjectro","description":"Hello world! 👋 This is a super powerful boilerplate built with Payload CMS 3.0 and Next.js 15! Everything is ready to get started right away! ✨","archived":false,"fork":false,"pushed_at":"2025-06-26T22:19:10.000Z","size":876,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-26T23:14:57.362Z","etag":null,"topics":["app","boilerplate","boilerplate-template","header-only","headless","headless-cms","next","next-js","nextjs","payload","payload-cms","payloadcms","radix-ui","sass","sassoftware","shadcn","starter","tailwind","tailwindcss","template"],"latest_commit_sha":null,"homepage":"https:/xjectro.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Xjectro.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-23T14:00:18.000Z","updated_at":"2025-06-26T22:19:14.000Z","dependencies_parsed_at":"2025-06-26T23:15:03.038Z","dependency_job_id":"6295ce4a-1d81-423e-b36e-385a0a194c3f","html_url":"https://github.com/Xjectro/payload-cms-boilerplate","commit_stats":null,"previous_names":["xjectro/payload-cms-boilerplate"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Xjectro/payload-cms-boilerplate","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Xjectro%2Fpayload-cms-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Xjectro%2Fpayload-cms-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Xjectro%2Fpayload-cms-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Xjectro%2Fpayload-cms-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Xjectro","download_url":"https://codeload.github.com/Xjectro/payload-cms-boilerplate/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Xjectro%2Fpayload-cms-boilerplate/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262202514,"owners_count":23274383,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["app","boilerplate","boilerplate-template","header-only","headless","headless-cms","next","next-js","nextjs","payload","payload-cms","payloadcms","radix-ui","sass","sassoftware","shadcn","starter","tailwind","tailwindcss","template"],"created_at":"2025-06-27T06:06:49.102Z","updated_at":"2025-12-30T22:22:42.528Z","avatar_url":"https://github.com/Xjectro.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🚀 Payload CMS Boilerplate\n\n\u003e **Modern, powerful and super fun CMS experience!** 🎉\n\nHello world! 👋 This is a super powerful boilerplate built with **Payload CMS 3.64.0** and **Next.js 16**! Everything is ready to get started right away! ✨\n\n## 🌟 Features\n\n- 🎨 **Modern UI/UX** - Beautiful design with Tailwind CSS and Radix UI\n- 🔐 **Secure Authentication** - Login/Register system ready\n- 📱 **Responsive Design** - Mobile, tablet and desktop compatible\n- 🌙 **Dark/Light Mode** - Theme switcher for night/day mode\n- 📝 **Rich Text Editor** - Powerful text editor with Lexical\n- 🖼️ **Media Management** - File upload and image management\n- 🔍 **SEO Optimized** - Optimized for search engines\n- 🌐 **GraphQL API** - Modern API structure\n- 🐳 **Docker Ready** - Easy to deploy\n- ⚡ **Live Preview** - Real-time preview\n\n## 🛠️ Technologies\n\n| Technology          | Version | Description     |\n| ------------------- | ------- | --------------- |\n| 🚀 **Next.js**      | 16.0.3  | React framework | \n| 📦 **Payload CMS**  | 3.43.0  | Headless CMS    |\n| 🎨 **Tailwind CSS** | 4.1.10  | CSS framework   |\n| 🗄️ **PostgreSQL**   | -       | Database        |\n| 🔧 **TypeScript**   | 5.7.3   | Type safety     |\n| 🎭 **React**        | 19.1.0  | UI library      |\n\n## 🏁 Quick Start\n\n### 1. 📥 Clone the Project\n\n```bash\ngit clone https://github.com/Xjectro/payload-cms-boilerplate.git\ncd payload-cms-boilerplate\n```\n\n### 2. 📦 Install Dependencies\n\n```bash\npnpm install\n# or\nnpm install\n# or\nyarn install\n```\n\n### 3. ⚙️ Environment Setup\n\nCreate a `.env.local` file and add the required variables:\n\n```env\n# Database Configuration\nDATABASE_URL=postgres://postgres:B100dy50.waf!@127.0.0.1:5432/this-is-my-test-db\n\n# Application Secrets\nPAYLOAD_SECRET=YOUR_SECRET_HERE\nPREVIEW_SECRET=your_preview_secret_here\n\n# Site\nAPP_URL=http://localhost:3000\nAPP_TITLE=Your Site Name\n\n# Environment Variables for Next.js\nNEXT_PUBLIC_APP_URL=${APP_URL}\nNEXT_PUBLIC_APP_TITLE=${APP_TITLE}\n```\n\n### 4. 🗄️ Setup Database\n\n```bash\n# Start PostgreSQL (with Docker)\ndocker-compose up -d\n\n# Migrate the database\npnpm payload migrate\n```\n\n### 5. 🎉 Start the Project\n\n```bash\npnpm dev\n```\n\nGo to `http://localhost:3000` in your browser! 🎯\n\n## 📁 Project Structure\n\n```\n📦 payload-cms-boilerplate\n├── 🎨 src/\n│   ├── 📄 app/                     # Next.js App Router\n│   │   ├── (api)/                 # API routes\n│   │   │   ├── health/            # Health check\n│   │   │   │   └── route.ts       # Health endpoint\n│   │   │   └── next/              # Next.js integration\n│   │   │       ├── exit-preview/  # Preview exit\n│   │   │       │   └── route.ts\n│   │   │       └── preview/       # Preview mode\n│   │   │           └── route.ts\n│   │   ├── (frontend)/            # Frontend application\n│   │   │   ├── layout.tsx         # Frontend main layout\n│   │   │   ├── (auth)/            # Authentication pages\n│   │   │   │   ├── layout.tsx     # Auth layout\n│   │   │   │   ├── login/         # Login page\n│   │   │   │   │   └── page.tsx\n│   │   │   │   └── register/      # Register page\n│   │   │   │       └── page.tsx\n│   │   │   ├── (protected)/       # Protected area\n│   │   │   │   ├── layout.tsx     # Protected layout\n│   │   │   │   └── dashboard/     # Dashboard page\n│   │   │   │       └── page.tsx\n│   │   │   └── (public)/          # Public area\n│   │   │       ├── layout.tsx     # Public layout\n│   │   │       ├── page.tsx       # Home page\n│   │   │       └── [slug]/        # Dynamic pages\n│   │   │           └── page.tsx   # Slug page\n│   │   └── (payload)/             # Payload admin\n│   │       ├── layout.tsx         # Payload layout\n│   │       ├── custom.scss        # Admin custom styles\n│   │       ├── admin/             # Admin panel\n│   │       │   ├── importMap.js   # Import map\n│   │       │   └── [[...segments]]/\n│   │       │       ├── not-found.tsx\n│   │       │       └── page.tsx\n│   │       └── api/               # Payload API routes\n│   │           ├── [...slug]/     # Dynamic API\n│   │           │   └── route.ts\n│   │           ├── graphql/       # GraphQL endpoint\n│   │           └── graphql-playground/\n│   ├── 🗂️ collections/            # Payload collections\n│   │   ├── Media/                 # Media collection\n│   │   │   └── index.ts\n│   │   ├── Pages/                 # Pages collection\n│   │   │   ├── hooks.ts           # Page hooks\n│   │   │   └── index.ts\n│   │   └── Users/                 # Users collection\n│   │       └── index.ts\n│   ├── 🧩 components/             # React components\n│   │   ├── common/                # Common components\n│   │   │   ├── footer.tsx         # Footer\n│   │   │   └── header.tsx         # Header\n│   │   ├── features/              # Feature components\n│   │   │   └── auth/              # Authentication components\n│   │   │       ├── buttons/       # Auth buttons\n│   │   │       └── forms/         # Auth forms\n│   │   ├── payload/               # Payload components\n│   │   │   ├── rich-text.tsx      # Rich text renderer\n│   │   │   ├── blocks/            # Content blocks\n│   │   │   │   ├── render-blocks.tsx # Block renderer\n│   │   │   │   ├── banner-block/  # Banner block\n│   │   │   │   ├── code-block/    # Code block\n│   │   │   │   ├── content-block/ # Content block\n│   │   │   │   ├── cta-block/     # CTA block\n│   │   │   │   └── media-block/   # Media block\n│   │   │   ├── fields/            # Custom field components\n│   │   │   │   ├── link/          # Link field\n│   │   │   │   └── media/         # Media field\n│   │   │   ├── heroes/            # Hero components\n│   │   │   │   ├── config.ts      # Hero configuration\n│   │   │   │   ├── high-impact.tsx # High impact hero\n│   │   │   │   ├── low-impact.tsx # Low impact hero\n│   │   │   │   ├── medium-impact.tsx # Medium impact hero\n│   │   │   │   └── render-hero.tsx # Hero renderer\n│   │   │   └── plugins/           # Plugin components\n│   │   │       └── live-preview-listener.tsx\n│   │   ├── providers/             # Provider components\n│   │   │   └── theme/             # Theme components\n│   │   │       ├── theme-provider.tsx # Theme provider\n│   │   │       └── theme-toggle.tsx # Theme switcher\n│   │   └── ui/                    # UI components\n│   │       ├── design-system.tsx  # Design system\n│   │       ├── forms/             # Form components\n│   │       │   ├── form-box.tsx   # Form box\n│   │       │   └── submit-button.tsx # Submit button\n│   │       └── primitives/        # UI primitives\n│   │           ├── alert.tsx      # Alert component\n│   │           ├── badge.tsx      # Badge component\n│   │           ├── button.tsx     # Button component\n│   │           ├── checkbox.tsx   # Checkbox component\n│   │           ├── form.tsx       # Form component\n│   │           ├── input.tsx      # Input component\n│   │           └── label.tsx      # Label component\n│   ├── 🔗 fields/                 # Payload field types\n│   │   ├── link-group.ts          # Link group field\n│   │   ├── link.ts                # Link field\n│   │   └── slug/                  # Slug field\n│   │       ├── format-slug.ts     # Slug format\n│   │       ├── index.scss         # Slug styles\n│   │       ├── index.ts           # Slug field\n│   │       └── slug-component.tsx # Slug component\n│   ├── 🔧 lib/                    # Helper libraries\n│   │   ├── auth.ts                # Authentication\n│   │   └── utils.ts               # General helpers\n│   ├── 🔄 migrations/             # Database migrations\n│   ├── 🎨 styles/                 # Global styles\n│   │   └── globals.css            # Global CSS\n│   ├── 🛠️ utils/                  # Utility functions\n│   │   ├── plugins.ts             # Plugin configuration\n│   │   ├── helpers/               # Helper functions\n│   │   │   └── generate-preview-path.ts\n│   │   ├── meta/                  # Meta data\n│   │   │   ├── generate-meta.ts   # Meta generator\n│   │   │   └── open-graph.ts      # OpenGraph utilities\n│   │   ├── payload-hooks/         # Payload hooks\n│   │   │   ├── access.ts          # Access controls\n│   │   │   └── revalidate-redirects.ts\n│   │   └── validations/           # Validation schemas\n│   │       └── auth.ts            # Auth validations\n│   ├── payload-types.ts           # Payload type definitions\n│   └── payload.config.ts          # Payload configuration\n├── 🖼️ public/                     # Static files\n│   ├── favicon.ico                # Site icon\n│   ├── opengraph-image.webp       # OpenGraph image\n│   └── media/                     # Media files\n├── ⚙️ Config Files\n│   ├── .env                       # Environment variables\n│   ├── .prettierrc.json           # Prettier settings\n│   ├── components.json            # Shadcn/ui config\n│   ├── next.config.ts            # Next.js configuration\n│   ├── package.json               # Project dependencies\n│   ├── tailwind.config.ts         # Tailwind configuration\n│   └── tsconfig.json              # TypeScript settings\n```\n\n## 🎮 Available Commands\n\n| Command        | Description                 |\n| -------------- | --------------------------- |\n| `pnpm dev`     | 🚀 Start development server |\n| `pnpm build`   | 📦 Build for production     |\n| `pnpm start`   | ▶️ Start production server  |\n| `pnpm lint`    | 🔍 Check code quality       |\n| `pnpm format`  | ✨ Format code              |\n| `pnpm payload` | ⚡ Payload CLI commands     |\n\n## 🌈 Block Types\n\nThis boilerplate includes many pre-built block types:\n\n- 🎯 **Banner Block** - Eye-catching banners\n- 📝 **Content Block** - Rich content areas\n- 🖼️ **Media Block** - Image/video blocks\n- 💻 **Code Block** - Code display\n- 🎪 **CTA Block** - Call-to-action buttons\n\n## 🔐 Authentication\n\n- ✅ User registration and login\n- 🔒 Protected page redirects\n- 👤 User profile management\n- 🚪 Secure logout\n\n## 🌐 API Endpoints\n\n| Endpoint                  | Description            |\n| ------------------------- | ---------------------- |\n| `/api/graphql`            | 🔗 GraphQL API         |\n| `/api/graphql-playground` | 🎮 GraphQL Playground  |\n| `/admin`                  | 🔧 Payload Admin Panel |\n\n## 🚀 Deployment\n\n### Deploy to Vercel\n\n```bash\n# With Vercel CLI\nvercel deploy\n\n# or push to GitHub, auto deploy! 🎉\n```\n\n## 🤝 Contributing\n\n1. 🍴 Fork it\n2. 🌿 Create feature branch (`git checkout -b feature/amazing-feature`)\n3. 💾 Commit your changes (`git commit -m 'Add amazing feature'`)\n4. 📤 Push to the branch (`git push origin feature/amazing-feature`)\n5. 🎯 Create a Pull Request\n\n## 📞 Support\n\nGot any issues? 🤔\n\n- 📧 Website: https://xjectro.com\n- 💬 GitHub Issues: [Issues page](https://github.com/Xjectro/payload-cms-boilerplate/issues)\n- 📖 Documentation: [Payload CMS Docs](https://payloadcms.com/docs)\n\n## 📄 License\n\nThis project is licensed under the MIT License. See the `LICENSE` file for details! 📜\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n**⭐ Don't forget to star if you liked it! ⭐**\n\nMade with ❤️ by [Xjectro](https://github.com/Xjectro)\n\n🚀 **Happy coding!** 🚀\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxjectro%2Fpayload-cms-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxjectro%2Fpayload-cms-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxjectro%2Fpayload-cms-boilerplate/lists"}