About

This project was bootstrapped with a turbopress

Useful docs

• Astro docs: Integrating with PayloadCMS
• Astro docs: Deployment and SSR adapters
• Astro docs: On demand rendering adapters

Why Astro?

Astro allow you to use your favorite UI components and libraries. Mix and match React, Preact, Svelte, Vue, SolidJS, AlpineJS, and Lit to build your own website.

Why PayloadCMS?

I need a headless CMS that is easy to use with TypeScript support. PayloadCMS work really well in this use case.

What's inside?

This Turborepo includes the following packages/apps:

Apps and Packages

• api: a Payload app
• web: an Astro app
• eslint-config-custom: eslint configurations (includes eslint-config-prettier and eslint-configg-turbo)

Each package/app is 100% TypeScript.

Utilities

This Turborepo has some additional tools already setup for you:

• TypeScript for static type checking
• TailwindCSS for CSS utility
• ESLint for code linting
• Prettier for code formatting

Prerequisites

Install nodejs, pnpm and turborepo on your local machine

Develop

Create a .env file in the root folder, you can use the .env.example file as an example

I use pnpm for this project.

Run the following command:

pnpm installl
pnpm dev

By default, the payloadCMS will run on port 3000, and Astro will be served on port 3001.

Build & Serve (NodeJs)

pnpm build
pnpm serve

TypeScript support

To fully utilize the type safe features, manually generate the types for PayloadCMS by runng pnpm generate:types

Then, you can import the types easily as simple as

import type { User } from "@turbopress/api/types";