Update README.md
This commit is contained in:
Yannik
GitHub
181
README.md
181
README.md
@@ -1,159 +1,96 @@
|
|||||||
|
|
||||||
|
|
||||||
# ✨ Lumify Sanity Template
|
# ✨ Lumify Sanity Template
|
||||||
|
|
||||||
Modern web template for Next.js, Sanity Studio, and Bun, with monorepo structure and reusable UI components. 🚀
|
Official CLI and starter template for building modern web apps with Next.js, Sanity, Bun, and Shadcn UI — bundled into a single monorepo.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 📦 What It Does
|
||||||
|
|
||||||
## 🧩 Features
|
The `lumify/sanity-template` CLI sets up a fully functional monorepo with:
|
||||||
|
|
||||||
- ⚡ **Next.js** (App Router, TypeScript, Tailwind CSS)
|
* ⚡ **Next.js App Router** for the frontend
|
||||||
- 📝 **Sanity Studio** (custom schemas, live preview, type generation)
|
* 📝 **Sanity Studio** CMS with custom schemas
|
||||||
- 🏗️ **Monorepo** (TurboRepo, packages for UI and Sanity connection)
|
* 🏗️ **TurboRepo** structure (client, studio, shared packages)
|
||||||
- 🎨 **Reusable UI components**
|
* 🎨 **Shadcn UI** components and theming pre-installed
|
||||||
|
* 🧪 Preconfigured dev tools (Tailwind, TypeScript, ESLint, Prettier)
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 🚀 How to Use
|
||||||
|
|
||||||
|
You can scaffold a new project using the CLI:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
bunx lumify/sanity-template
|
||||||
|
```
|
||||||
|
|
||||||
|
Then follow the interactive prompts:
|
||||||
|
|
||||||
|
* Choose a project name
|
||||||
|
* Select a package manager (bun, npm, etc.)
|
||||||
|
* (Optionally) Provide a path to a favicon
|
||||||
|
|
||||||
|
After that:
|
||||||
|
|
||||||
|
* The CLI will create a Sanity project and prompt you to log in.
|
||||||
|
* It will open a GitHub repository creation screen in your browser.
|
||||||
|
* Once you confirm and hit **Enter** in the CLI again, it will push the entire project and complete setup automatically.
|
||||||
|
* You can edit your values anytime after setup in `packages/sanity-connection/index.ts`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## 🗂️ Project Structure
|
## 🗂️ Project Structure
|
||||||
|
|
||||||
```
|
```
|
||||||
apps/
|
apps/
|
||||||
client/ # Next.js frontend app
|
client/ # Next.js frontend
|
||||||
src/
|
studio/ # Sanity Studio CMS
|
||||||
app/ # App router pages & layouts
|
|
||||||
components/ # React UI components
|
|
||||||
lib/ # Utility functions
|
|
||||||
public/ # Static assets
|
|
||||||
studio/ # Sanity Studio (CMS)
|
|
||||||
packages/
|
packages/
|
||||||
sanity-connection/ # Shared Sanity config/utilities
|
ui/ # Shadcn components & design system
|
||||||
typescript-config/ # Shared tsconfig presets
|
sanity-connection/ # Shared Sanity config and token
|
||||||
ui/ # Shared UI components
|
typescript-config/ # Shared TypeScript presets
|
||||||
|
```
|
||||||
|
|
||||||
|
All apps and packages are connected with TurboRepo workspaces.
|
||||||
|
|
||||||
|
You can run commands from the root:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
bun run dev # Start client and studio in parallel
|
||||||
|
bun run build # Build all apps and packages
|
||||||
|
bun run deploy # Deploy the Sanity Studio
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 🧩 Shadcn UI
|
||||||
|
|
||||||
## 🏁 Getting Started
|
Shadcn UI is pre-installed and configured in `client`
|
||||||
|
|
||||||
|
To add components run the following inside the client folder:
|
||||||
|
|
||||||
### 1️⃣ Sanity Project Setup
|
```bash
|
||||||
|
bunx shadcn-ui@latest add [component]
|
||||||
1. Create a new project at [sanity.io](https://www.sanity.io/)
|
|
||||||
2. Copy your **Project ID** for later
|
|
||||||
3. In Sanity, set up the following CORS origins:
|
|
||||||
|
|
||||||
| URL | Status |
|
|
||||||
|-------------------------------|-------------|
|
|
||||||
| https://example.vercel.app | Not Allowed |
|
|
||||||
| http://localhost:3000 | Not Allowed |
|
|
||||||
| https://*.api.sanity.io | Not Allowed |
|
|
||||||
| wss://*.api.sanity.io | Not Allowed |
|
|
||||||
| https://example.sanity.studio | Allowed |
|
|
||||||
| http://localhost:3333 | Allowed |
|
|
||||||
|
|
||||||
4. Create a **token** with `Viewer` permissions (for live preview):
|
|
||||||
|
|
||||||
| Name | Permissions |
|
|
||||||
|----------------------------------------|-------------|
|
|
||||||
| Main Token (Copy it for the next step) | Viewer |
|
|
||||||
|
|
||||||
|
|
||||||
### 2️⃣ Configure the Repo
|
|
||||||
|
|
||||||
Edit `packages/sanity-connection/index.ts` and fill in:
|
|
||||||
|
|
||||||
1. `pageTitle` – Name for your Sanity Studio
|
|
||||||
2. `publicViewerToken` – The token from above
|
|
||||||
3. `studioHost` – Lowercase, no special chars (e.g. `myproject`)
|
|
||||||
4. `studioUrl` – `https://<studioHost>.sanity.studio`
|
|
||||||
5. `projectId` – From Sanity project settings
|
|
||||||
6. `previewUrl` – Your website URL (`http://localhost:3000` for local dev)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
## 💻 Local Development
|
|
||||||
|
|
||||||
|
|
||||||
Install dependencies (from the root):
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bun install
|
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🔗 [ui.shadcn.dev](https://ui.shadcn.dev/docs/components)
|
||||||
|
|
||||||
Start all apps (Next.js and Sanity Studio) in parallel from the root:
|
🔗 [shadcnui-blocks.com](http://www.shadcnui-blocks.com)
|
||||||
|
|
||||||
```sh
|
🔗 [kokonutui.com](https://kokonutui.com)
|
||||||
bun run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
|
🔗 [ui.aceternity.com](https://ui.aceternity.com)
|
||||||
|
|
||||||
✨ You do not need to `cd` into any subdirectory—TurboRepo will handle running the correct scripts in each package/app.
|
🔗 [21st.dev](https://21st.dev)
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 🧠 Sanity Docs
|
||||||
|
|
||||||
## 🛠️ Useful Scripts
|
Customize your Studio or learn more about Sanity at:
|
||||||
|
|
||||||
| Script | Description |
|
📘 [sanity.io/docs](https://www.sanity.io/docs)
|
||||||
|--------------------|------------------------------------|
|
|
||||||
| bun run dev | Start dev server (client/studio) |
|
|
||||||
| bun run build | Build app/studio |
|
|
||||||
| bun run deploy | Deploy Sanity Studio |
|
|
||||||
| bun run generate | Generate Sanity types |
|
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
Happy building with Lumify! 🚀
|
||||||
## 🚢 Deployment
|
|
||||||
|
|
||||||
To deploy Sanity Studio:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bun run deploy
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
## 🧬 Type Generation
|
|
||||||
|
|
||||||
To generate types from your Sanity schemas:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bun run generate
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
on github
|
|
||||||
|
|
||||||
## 🚀 Use This Template
|
|
||||||
|
|
||||||
Easily kickstart your own project with this template on GitHub:
|
|
||||||
|
|
||||||
1. ⭐️ **Go to the repository page on GitHub.**
|
|
||||||
2. ⤴️ Click the **"Use this template"** button (top right) and select **"Create a new repository"**.
|
|
||||||
3. 📝 Fill in your new repository details and click **"Create repository from template"**.
|
|
||||||
4. ⬇️ Clone your new repository:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
git clone https://github.com/your-username/your-repo-name.git
|
|
||||||
cd your-repo-name
|
|
||||||
```
|
|
||||||
|
|
||||||
5. 📦 Install dependencies and start development:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
bun install
|
|
||||||
bun run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
6. 🛠️ Follow the [Getting Started](#getting-started) steps above to configure your Sanity project and environment.
|
|
||||||
|
|
||||||
Happy building! 🎉
|
|
||||||
|
|||||||
Reference in New Issue
Block a user