afiqzudinhadi/ecommerce-template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(create-turbo): create kitchen-sink

Browse source
This commit is contained in:
Turbobot 2025-06-19 02:40:01 +08:00 • committed by afiqzudinhadi
commit 4625c93980
80 changed files with 11572 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

12
.gitignore vendored Normal file
View file

@ -0,0 +1,12 @@
.DS_Store
node_modules
.turbo
*.log
.next
dist
dist-ssr
*.local
.env
.cache
server/dist
public/dist

1
.npmrc Normal file
View file

@ -0,0 +1 @@
auto-install-peers = true

40
README.md Normal file
View file

@ -0,0 +1,40 @@
# Turborepo kitchen sink starter
This Turborepo starter is maintained by the Turborepo core team.
This example also shows how to use [Workspace Configurations](https://turborepo.com/docs/core-concepts/monorepos/configuring-workspaces).
## Using this example
Run the following command:
```sh
npx create-turbo@latest -e kitchen-sink
```
## What's inside?
This Turborepo includes the following packages and apps:
### Apps and Packages
- `api`: an [Express](https://expressjs.com/) server
- `storefront`: a [Next.js](https://nextjs.org/) app
- `admin`: a [Vite](https://vitejs.dev/) single page app
- `blog`: a [Remix](https://remix.run/) blog
- `@repo/eslint-config`: ESLint configurations used throughout the monorepo
- `@repo/jest-presets`: Jest configurations
- `@repo/logger`: isomorphic logger (a small wrapper around console.log)
- `@repo/ui`: a dummy React UI library (which contains `<CounterButton>` and `<Link>` components)
- `@repo/typescript-config`: tsconfig.json's used throughout the monorepo
Each package and app is 100% [TypeScript](https://www.typescriptlang.org/).
### Utilities
This Turborepo has some additional tools already setup for you:
- [TypeScript](https://www.typescriptlang.org/) for static type checking
- [ESLint](https://eslint.org/) for code linting
- [Jest](https://jestjs.io) test runner for all things JavaScript
- [Prettier](https://prettier.io) for code formatting

4
apps/admin/eslint.config.js Normal file
View file

@ -0,0 +1,4 @@
/** @type {import("eslint").Linter.Config} */
import { config } from "@repo/eslint-config";
export default config;

12
apps/admin/index.html Normal file
View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Admin | Kitchen Sink</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

27
apps/admin/package.json Normal file
View file

@ -0,0 +1,27 @@
{
"name": "admin",
"version": "0.0.0",
"type": "module",
"private": true,
"scripts": {
"build": "vite build",
"dev": "vite --host 0.0.0.0 --port 3001 --clearScreen false",
"check-types": "tsc --noEmit",
"lint": "eslint src/ --max-warnings 0"
},
"dependencies": {
"@repo/ui": "workspace:*",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@repo/eslint-config": "workspace:*",
"@repo/typescript-config": "workspace:*",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"@vitejs/plugin-react": "^4.5.1",
"eslint": "^9.29.0",
"typescript": "5.8.2",
"vite": "^5.4.14"
}
}

BIN
apps/admin/public/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 364 KiB

27
apps/admin/src/app/index.tsx Normal file
View file

@ -0,0 +1,27 @@
import "./styles.css";
import { CounterButton } from "@repo/ui/counter-button";
import { Link } from "@repo/ui/link";
function App() {
return (
<div className="container">
<h1 className="title">
Admin <br />
<span>Kitchen Sink</span>
</h1>
<CounterButton />
<p className="description">
Built With{" "}
<Link href="https://turborepo.com" newTab>
Turborepo
</Link>
{" & "}
<Link href="https://vitejs.dev/" newTab>
Vite
</Link>
</p>
</div>
);
}
export default App;

40
apps/admin/src/app/styles.css Normal file
View file

@ -0,0 +1,40 @@
.container {
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.5rem;
max-width: 100%;
margin: 0 auto;
padding: 0 16px;
text-align: center;
}
.title {
font-size: 3rem;
font-weight: 700;
margin: 0;
}
.title span {
display: inline-block;
background-image: linear-gradient(to right, #3b82f6, #ef4444);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.description {
color: #9ca3af;
font-weight: 500;
}
.description a {
color: #3b82f6;
text-decoration: none;
}
.description a:hover {
text-decoration: underline;
}

14
apps/admin/src/index.css Normal file
View file

@ -0,0 +1,14 @@
html {
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: transparent;
line-height: 1.5;
tab-size: 4;
}
body {
margin: 0;
}

16
apps/admin/src/main.tsx Normal file
View file

@ -0,0 +1,16 @@
import React from "react";
import { createRoot } from "react-dom/client";
import App from "./app";
import "./index.css";
const el = document.getElementById("root");
if (el) {
const root = createRoot(el);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);
} else {
throw new Error("Could not find root element");
}

25
apps/admin/tsconfig.json Normal file
View file

@ -0,0 +1,25 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"],
"references": [{ "path": "./tsconfig.node.json" }]
}

10
apps/admin/tsconfig.node.json Normal file
View file

@ -0,0 +1,10 @@
{
"compilerOptions": {
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
"include": ["vite.config.ts"]
}

12
apps/admin/turbo.json Normal file
View file

@ -0,0 +1,12 @@
{
"extends": [
"//"
],
"tasks": {
"build": {
"outputs": [
"dist/**"
]
}
}
}

6
apps/admin/vite.config.ts Normal file
View file

@ -0,0 +1,6 @@
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [react()],
});

4
apps/api/eslint.config.js Normal file
View file

@ -0,0 +1,4 @@
import { config } from "@repo/eslint-config";
/** @type {import("eslint").Linter.Config} */
export default config;

41
apps/api/package.json Normal file
View file

@ -0,0 +1,41 @@
{
"name": "api",
"version": "0.0.0",
"type": "module",
"private": true,
"scripts": {
"start": "node dist/index.js",
"dev": "tsup --watch --onSuccess \"node dist/index.cjs\"",
"build": "tsup",
"check-types": "tsc --noEmit",
"lint": "eslint src/ --max-warnings 0",
"test": "jest --detectOpenHandles"
},
"jest": {
"preset": "@repo/jest-presets/node"
},
"dependencies": {
"@repo/logger": "workspace:*",
"body-parser": "^1.20.3",
"cors": "^2.8.5",
"express": "4.21.2",
"morgan": "^1.10.0"
},
"devDependencies": {
"@jest/globals": "^29.7.0",
"@repo/eslint-config": "workspace:*",
"@repo/jest-presets": "workspace:*",
"@repo/typescript-config": "workspace:*",
"@types/body-parser": "^1.19.5",
"@types/cors": "^2.8.17",
"@types/express": "4.17.21",
"@types/morgan": "^1.9.9",
"@types/node": "^22.15.3",
"@types/supertest": "^6.0.2",
"eslint": "^9.29.0",
"jest": "^29.7.0",
"supertest": "^7.1.0",
"tsup": "^8.5.0",
"typescript": "5.8.2"
}
}

23
apps/api/src/__tests__/server.test.ts Normal file
View file

@ -0,0 +1,23 @@
import supertest from "supertest";
import { describe, it, expect } from "@jest/globals";
import { createServer } from "../server";
describe("Server", () => {
it("health check returns 200", async () => {
await supertest(createServer())
.get("/status")
.expect(200)
.then((res) => {
expect(res.ok).toBe(true);
});
});
it("message endpoint says hello", async () => {
await supertest(createServer())
.get("/message/jared")
.expect(200)
.then((res) => {
expect(res.body).toEqual({ message: "hello jared" });
});
});
});

9
apps/api/src/index.ts Normal file
View file

@ -0,0 +1,9 @@
import { log } from "@repo/logger";
import { createServer } from "./server";
const port = process.env.PORT || 5001;
const server = createServer();
server.listen(port, () => {
log(`api running on ${port}`);
});

22
apps/api/src/server.ts Normal file
View file

@ -0,0 +1,22 @@
import { json, urlencoded } from "body-parser";
import express, { type Express } from "express";
import morgan from "morgan";
import cors from "cors";
export const createServer = (): Express => {
const app = express();
app
.disable("x-powered-by")
.use(morgan("dev"))
.use(urlencoded({ extended: true }))
.use(json())
.use(cors())
.get("/message/:name", (req, res) => {
return res.json({ message: `hello ${req.params.name}` });
})
.get("/status", (_, res) => {
return res.json({ ok: true });
});
return app;
};

9
apps/api/tsconfig.json Normal file
View file

@ -0,0 +1,9 @@
{
"extends": "@repo/typescript-config/base.json",
"compilerOptions": {
"lib": ["ES2015"],
"outDir": "./dist"
},
"exclude": ["node_modules"],
"include": ["."]
}

8
apps/api/tsup.config.ts Normal file
View file

@ -0,0 +1,8 @@
import { defineConfig, type Options } from "tsup";
export default defineConfig((options: Options) => ({
entry: ["src/**/*"],
clean: true,
format: ["cjs"],
...options,
}));

9
apps/api/turbo.json Normal file
View file

@ -0,0 +1,9 @@
{
"extends": ["//"],
"tasks": {
"build": {
"env": ["PORT"],
"outputs": ["dist/**"]
}
}
}

5
apps/blog/.gitignore vendored Normal file
View file

@ -0,0 +1,5 @@
node_modules
/build
.env
.vercel

38
apps/blog/README.md Normal file
View file

@ -0,0 +1,38 @@
# Remix
This directory is a brief example of a [Remix](https://remix.run/docs) site that can be deployed to Vercel with zero configuration.
To get started, run the Remix cli with this template
```sh
npx create-remix@latest --template vercel/vercel/examples/remix
```
## Deploy Your Own
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/vercel/tree/main/examples/remix&template=remix)
_Live Example: https://remix-run-template.vercel.app_
You can also deploy using the [Vercel CLI](https://vercel.com/docs/cli):
```sh
npm i -g vercel
vercel
```
## Development
To run your Remix app locally, make sure your project's local dependencies are installed:
```sh
npm install
```
Afterwards, start the Remix development server like so:
```sh
npm run dev
```
Open up [http://localhost:5173](http://localhost:5173) and you should be ready to go!

32
apps/blog/app/root.tsx Normal file
View file

@ -0,0 +1,32 @@
import {
Links,
Meta,
Outlet,
Scripts,
ScrollRestoration,
} from "@remix-run/react";
import { Analytics } from "@vercel/analytics/react";
import "./styles.css";
export function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<Links />
</head>
<body>
{children}
<ScrollRestoration />
<Scripts />
<Analytics />
</body>
</html>
);
}
export default function App() {
return <Outlet />;
}

19
apps/blog/app/routes/_index.tsx Normal file
View file

@ -0,0 +1,19 @@
import { CounterButton } from "@repo/ui/counter-button";
import { Link } from "@repo/ui/link";
export default function Index() {
return (
<div className="container">
<h1 className="title">
Blog <br />
<span>Kitchen Sink</span>
</h1>
<CounterButton />
<p className="description">
Built With <Link href="https://turborepo.com">Turborepo</Link>
{" & "}
<Link href="https://remix.run/">Remix</Link>
</p>
</div>
);
}

15
apps/blog/app/routes/edge.tsx Normal file
View file

@ -0,0 +1,15 @@
import type { MetaFunction } from "@vercel/remix";
export const config = { runtime: "edge" };
export const meta: MetaFunction = () => [
{ title: "Remix@Edge | New Remix App" },
];
export default function Edge() {
return (
<div style={{ fontFamily: "system-ui, sans-serif", lineHeight: "1.4" }}>
<h1>Welcome to Remix@Edge</h1>
</div>
);
}

55
apps/blog/app/styles.css Normal file
View file

@ -0,0 +1,55 @@
html {
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: transparent;
line-height: 1.5;
tab-size: 4;
}
body {
margin: 0;
}
.container {
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.5rem;
max-width: 100%;
margin: 0 auto;
padding: 0 16px;
text-align: center;
}
.title {
font-size: 3rem;
font-weight: 700;
margin: 0;
}
.title span {
display: inline-block;
background-image: linear-gradient(to right, #3b82f6, #ef4444);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.description {
color: #9ca3af;
font-weight: 500;
}
.description a {
color: #3b82f6;
text-decoration: none;
}
.description a:hover {
text-decoration: underline;
}

4
apps/blog/eslint.config.js Normal file
View file

@ -0,0 +1,4 @@
import { config } from "@repo/eslint-config/react";
/** @type {import("eslint").Linter.Config} */
export default config;

40
apps/blog/package.json Normal file
View file

@ -0,0 +1,40 @@
{
"name": "blog",
"version": "0.0.0",
"private": true,
"sideEffects": false,
"type": "module",
"scripts": {
"build": "remix vite:build",
"dev": "remix vite:dev",
"check-types": "tsc --noEmit",
"lint": "eslint app/ --max-warnings 0"
},
"dependencies": {
"@remix-run/node": "^2.15.2",
"@remix-run/react": "^2.15.2",
"@remix-run/server-runtime": "^2.15.2",
"@repo/ui": "workspace:*",
"@vercel/analytics": "^1.5.0",
"@vercel/remix": "2.16.6",
"isbot": "^5.1.23",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@remix-run/dev": "^2.15.2",
"@repo/eslint-config": "workspace:*",
"@types/react": "^18.3.18",
"@types/react-dom": "^18.3.5",
"@typescript-eslint/eslint-plugin": "^8.34.0",
"@typescript-eslint/parser": "^8.34.0",
"autoprefixer": "^10.4.20",
"eslint": "^9.29.0",
"typescript": "5.8.2",
"vite": "^5.4.14",
"vite-tsconfig-paths": "4.2.1"
},
"engines": {
"node": ">=18.0.0"
}
}

BIN
apps/blog/public/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 KiB

25
apps/blog/tsconfig.json Normal file
View file

@ -0,0 +1,25 @@
{
"include": ["**/*.ts", "**/*.tsx"],
"compilerOptions": {
"lib": ["DOM", "DOM.Iterable", "ES2022"],
"types": ["@vercel/remix", "vite/client"],
"isolatedModules": true,
"esModuleInterop": true,
"jsx": "react-jsx",
"module": "ESNext",
"moduleResolution": "Bundler",
"resolveJsonModule": true,
"target": "ES2022",
"strict": true,
"allowJs": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"baseUrl": ".",
"paths": {
"~/*": ["./app/*"]
},
// Vite takes care of building everything, not tsc.
"noEmit": true
}
}

11
apps/blog/vite.config.ts Normal file
View file

@ -0,0 +1,11 @@
import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { defineConfig } from "vite";
import { vercelPreset } from "@vercel/remix/vite";
import tsconfigPaths from "vite-tsconfig-paths";
installGlobals();
export default defineConfig({
plugins: [remix({ presets: [vercelPreset()] }), tsconfigPaths()],
});

4
apps/storefront/eslint.config.js Normal file
View file

@ -0,0 +1,4 @@
import { config } from "@repo/eslint-config/next";
/** @type {import("eslint").Linter.Config} */
export default config;

5
apps/storefront/next-env.d.ts vendored Normal file
View file

@ -0,0 +1,5 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

12
apps/storefront/next.config.ts Normal file
View file

@ -0,0 +1,12 @@
import { NextConfig } from "next";
const nextConfig: NextConfig = {
typescript: {
ignoreBuildErrors: true,
},
eslint: {
ignoreDuringBuilds: true,
},
};
export default nextConfig;

30
apps/storefront/package.json Normal file
View file

@ -0,0 +1,30 @@
{
"name": "storefront",
"version": "0.0.0",
"type": "module",
"private": true,
"scripts": {
"build": "next build",
"dev": "next dev -p 3002",
"lint": "next lint",
"check-types": "tsc --noEmit",
"start": "next start"
},
"dependencies": {
"@repo/logger": "workspace:*",
"@repo/ui": "workspace:*",
"next": "^15.3.0",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@next/eslint-plugin-next": "^15.3.0",
"@repo/eslint-config": "workspace:*",
"@repo/typescript-config": "workspace:*",
"@types/node": "^22.15.3",
"@types/react": "^19.0.10",
"@types/react-dom": "^19.0.4",
"eslint": "^9.29.0",
"typescript": "5.8.2"
}
}

BIN
apps/storefront/public/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

13
apps/storefront/src/app/layout.tsx Normal file
View file

@ -0,0 +1,13 @@
import "./styles.css";
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body>{children}</body>
</html>
);
}

31
apps/storefront/src/app/page.tsx Normal file
View file

@ -0,0 +1,31 @@
import { log } from "@repo/logger";
import { Link } from "@repo/ui/link";
import { CounterButton } from "@repo/ui/counter-button";
export const metadata = {
title: "Store | Kitchen Sink",
};
export default function Store() {
log("Hey! This is the Store page.");
return (
<div className="container">
<h1 className="title">
Store <br />
<span>Kitchen Sink</span>
</h1>
<CounterButton />
<p className="description">
Built With{" "}
<Link href="https://turborepo.com" newTab>
Turborepo
</Link>
{" & "}
<Link href="https://nextjs.org/" newTab>
Next.js
</Link>
</p>
</div>
);
}

55
apps/storefront/src/app/styles.css Normal file
View file

@ -0,0 +1,55 @@
html {
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
-webkit-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: transparent;
line-height: 1.5;
tab-size: 4;
}
body {
margin: 0;
}
.container {
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.5rem;
max-width: 100%;
margin: 0 auto;
padding: 0 16px;
text-align: center;
}
.title {
font-size: 3rem;
font-weight: 700;
margin: 0;
}
.title span {
display: inline-block;
background-image: linear-gradient(to right, #3b82f6, #ef4444);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.description {
color: #9ca3af;
font-weight: 500;
}
.description a {
color: #3b82f6;
text-decoration: none;
}
.description a:hover {
text-decoration: underline;
}

13
apps/storefront/tsconfig.json Normal file
View file

@ -0,0 +1,13 @@
{
"exclude": ["node_modules"],
"extends": "@repo/typescript-config/nextjs.json",
"compilerOptions": {
"outDir": "dist",
"plugins": [
{
"name": "next"
}
]
},
"include": ["src", "next.config.ts", "next-env.d.ts", ".next/types/**/*.ts"]
}

13
apps/storefront/turbo.json Normal file
View file

@ -0,0 +1,13 @@
{
"extends": [
"//"
],
"tasks": {
"build": {
"outputs": [
".next/**",
"!.next/cache/**"
]
}
}
}

6
meta.json Normal file
View file

@ -0,0 +1,6 @@
{
"name": "Kitchen sink",
"description": "Multiple frameworks, both frontend and backend",
"template": "https://vercel.com/templates/remix/turborepo-kitchensink",
"maintainedByCoreTeam": true
}

21
package.json Normal file
View file

@ -0,0 +1,21 @@
{
"name": "kitchen-sink",
"private": true,
"scripts": {
"build": "turbo run build",
"clean": "turbo run clean",
"dev": "turbo run dev",
"format": "prettier --write \"**/*.{ts,tsx,md}\"",
"lint": "turbo run lint",
"test": "turbo run test",
"check-types": "turbo run check-types"
},
"devDependencies": {
"prettier": "^3.5.3",
"turbo": "^2.5.0"
},
"packageManager": "pnpm@8.15.6",
"engines": {
"node": ">=18"
}
}

3
packages/config-eslint/README.md Normal file
View file

@ -0,0 +1,3 @@
# `@turbo/eslint-config`
Collection of internal eslint configurations.

32
packages/config-eslint/index.js Normal file
View file

@ -0,0 +1,32 @@
import js from "@eslint/js";
import eslintConfigPrettier from "eslint-config-prettier";
import turboPlugin from "eslint-plugin-turbo";
import tseslint from "typescript-eslint";
import onlyWarn from "eslint-plugin-only-warn";
/**
* A shared ESLint configuration for the repository.
*
* @type {import("eslint").Linter.Config}
* */
export const config = [
js.configs.recommended,
eslintConfigPrettier,
...tseslint.configs.recommended,
{
plugins: {
turbo: turboPlugin,
},
rules: {
"turbo/no-undeclared-env-vars": "warn",
},
},
{
plugins: {
onlyWarn,
},
},
{
ignores: ["dist/**"],
},
];

49
packages/config-eslint/next.js Normal file
View file

@ -0,0 +1,49 @@
import js from "@eslint/js";
import eslintConfigPrettier from "eslint-config-prettier";
import tseslint from "typescript-eslint";
import pluginReactHooks from "eslint-plugin-react-hooks";
import pluginReact from "eslint-plugin-react";
import globals from "globals";
import pluginNext from "@next/eslint-plugin-next";
import { config as baseConfig } from "./index.js";
/**
* A custom ESLint configuration for libraries that use Next.js.
*
* @type {import("eslint").Linter.Config}
* */
export const config = [
...baseConfig,
js.configs.recommended,
eslintConfigPrettier,
...tseslint.configs.recommended,
{
...pluginReact.configs.flat.recommended,
languageOptions: {
...pluginReact.configs.flat.recommended.languageOptions,
globals: {
...globals.serviceworker,
},
},
},
{
plugins: {
"@next/next": pluginNext,
},
rules: {
...pluginNext.configs.recommended.rules,
...pluginNext.configs["core-web-vitals"].rules,
},
},
{
plugins: {
"react-hooks": pluginReactHooks,
},
settings: { react: { version: "detect" } },
rules: {
...pluginReactHooks.configs.recommended.rules,
// React scope no longer necessary with new JSX transform.
"react/react-in-jsx-scope": "off",
},
},
];

26
packages/config-eslint/package.json Normal file
View file

@ -0,0 +1,26 @@
{
"name": "@repo/eslint-config",
"version": "0.0.0",
"type": "module",
"private": true,
"exports": {
".": "./index.js",
"./next": "./next.js",
"./react": "./react.js",
"./remix": "./remix.js",
"./vite": "./vite.js"
},
"devDependencies": {
"@eslint/js": "^9.29.0",
"@next/eslint-plugin-next": "^15.3.0",
"eslint": "^9.29.0",
"eslint-config-prettier": "^10.1.1",
"eslint-plugin-only-warn": "^1.1.0",
"eslint-plugin-react": "^7.37.5",
"eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-turbo": "^2.5.0",
"globals": "^16.2.0",
"typescript": "^5.8.2",
"typescript-eslint": "^8.34.0"
}
}

39
packages/config-eslint/react.js vendored Normal file
View file

@ -0,0 +1,39 @@
import js from "@eslint/js";
import eslintConfigPrettier from "eslint-config-prettier";
import tseslint from "typescript-eslint";
import pluginReactHooks from "eslint-plugin-react-hooks";
import pluginReact from "eslint-plugin-react";
import globals from "globals";
import { config as baseConfig } from "./index.js";
/**
* A custom ESLint configuration for libraries that use React.
*
* @type {import("eslint").Linter.Config} */
export const config = [
...baseConfig,
js.configs.recommended,
eslintConfigPrettier,
...tseslint.configs.recommended,
pluginReact.configs.flat.recommended,
{
languageOptions: {
...pluginReact.configs.flat.recommended.languageOptions,
globals: {
...globals.serviceworker,
...globals.browser,
},
},
},
{
plugins: {
"react-hooks": pluginReactHooks,
},
settings: { react: { version: "detect" } },
rules: {
...pluginReactHooks.configs.recommended.rules,
// React scope no longer necessary with new JSX transform.
"react/react-in-jsx-scope": "off",
},
},
];

39
packages/config-eslint/remix.js Normal file
View file

@ -0,0 +1,39 @@
const { resolve } = require("node:path");
const project = resolve(process.cwd(), "tsconfig.json");
/*
* This is a custom ESLint configuration for use a library
* that utilizes React.
*/
module.exports = {
extends: [
"@vercel/style-guide/eslint/browser",
"@vercel/style-guide/eslint/typescript",
"@vercel/style-guide/eslint/react",
].map(require.resolve),
parserOptions: {
project,
},
env: {
browser: true,
node: true,
},
plugins: ["only-warn"],
globals: {
JSX: true,
},
settings: {
"import/resolver": {
typescript: {
project,
},
},
},
ignorePatterns: ["node_modules/", "dist/", ".eslintrc.js", "**/*.css"],
// add rules configurations here
rules: {
"import/no-default-export": "off",
},
};

26
packages/config-eslint/vite.js Normal file
View file

@ -0,0 +1,26 @@
import js from "@eslint/js";
import globals from "globals";
import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import tseslint from "typescript-eslint";
export default tseslint.config({
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ["**/*.{ts,tsx}"],
ignores: ["dist"],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
"react-hooks": reactHooks,
"react-refresh": reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
"react-refresh/only-export-components": [
"warn",
{ allowConstantExport: true },
],
},
});

23
packages/config-typescript/base.json Normal file
View file

@ -0,0 +1,23 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"compilerOptions": {
"composite": false,
"declaration": true,
"declarationMap": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"allowImportingTsExtensions": true,
"inlineSources": false,
"isolatedModules": true,
"module": "ESNext",
"moduleResolution": "Bundler",
"noUnusedLocals": false,
"noUnusedParameters": false,
"preserveWatchOutput": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"strictNullChecks": true
},
"exclude": ["node_modules"]
}

17
packages/config-typescript/nextjs.json Normal file
View file

@ -0,0 +1,17 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"extends": "./base.json",
"compilerOptions": {
"plugins": [{ "name": "next" }],
"allowJs": true,
"declaration": false,
"declarationMap": false,
"incremental": true,
"jsx": "preserve",
"lib": ["dom", "dom.iterable", "esnext"],
"module": "esnext",
"noEmit": true,
"resolveJsonModule": true,
"target": "es5"
}
}

9
packages/config-typescript/package.json Normal file
View file

@ -0,0 +1,9 @@
{
"name": "@repo/typescript-config",
"version": "0.0.0",
"private": true,
"license": "MIT",
"publishConfig": {
"access": "public"
}
}

16
packages/config-typescript/react-app.json Normal file
View file

@ -0,0 +1,16 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"extends": "./base.json",
"compilerOptions": {
"allowJs": true,
"declaration": false,
"declarationMap": false,
"incremental": true,
"jsx": "preserve",
"lib": ["dom", "dom.iterable", "esnext"],
"module": "esnext",
"noEmit": true,
"resolveJsonModule": true,
"target": "es5"
}
}

11
packages/config-typescript/react-library.json Normal file
View file

@ -0,0 +1,11 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"extends": "./base.json",
"compilerOptions": {
"lib": ["ES2015"],
"module": "ESNext",
"target": "ES6",
"jsx": "react-jsx",
"noEmit": true
}
}

17
packages/config-typescript/remix.json Normal file
View file

@ -0,0 +1,17 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"extends": "./base.json",
"compilerOptions": {
"lib": ["DOM", "DOM.Iterable", "ES2019"],
"isolatedModules": true,
"esModuleInterop": true,
"jsx": "react-jsx",
"moduleResolution": "Bundler",
"resolveJsonModule": true,
"target": "ES2019",
"strict": true,
"allowJs": true,
"forceConsistentCasingInFileNames": true,
"baseUrl": "."
}
}

21
packages/config-typescript/vite.json Normal file
View file

@ -0,0 +1,21 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"],
"references": [{ "path": "./tsconfig.node.json" }]
}

17
packages/jest-presets/browser/jest-preset.mjs Normal file
View file

@ -0,0 +1,17 @@
/** @type {import('jest').Config} */
const config = {
roots: ["<rootDir>"],
testEnvironment: "jsdom",
transform: {
"^.+\\.tsx?$": "ts-jest",
},
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
modulePathIgnorePatterns: [
"<rootDir>/test/__fixtures__",
"<rootDir>/node_modules",
"<rootDir>/dist",
],
preset: "ts-jest",
};
export default config;

16
packages/jest-presets/node/jest-preset.mjs Normal file
View file

@ -0,0 +1,16 @@
/** @type {import('jest').Config} */
const config = {
roots: ["<rootDir>"],
transform: {
"^.+\\.tsx?$": "ts-jest",
},
moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
modulePathIgnorePatterns: [
"<rootDir>/test/__fixtures__",
"<rootDir>/node_modules",
"<rootDir>/dist",
],
preset: "ts-jest",
};
export default config;

17
packages/jest-presets/package.json Normal file
View file

@ -0,0 +1,17 @@
{
"name": "@repo/jest-presets",
"version": "0.0.0",
"private": true,
"license": "MIT",
"files": [
"browser/jest-preset.ts",
"node/jest-preset.ts"
],
"dependencies": {
"jest": "^29.7.0",
"ts-jest": "^29.4.0"
},
"devDependencies": {
"jest-environment-jsdom": "^29.7.0"
}
}

4
packages/logger/eslint.config.js Normal file
View file

@ -0,0 +1,4 @@
import { config } from "@repo/eslint-config";
/** @type {import("eslint").Linter.Config} */
export default config;

45
packages/logger/package.json Normal file
View file

@ -0,0 +1,45 @@
{
"name": "@repo/logger",
"version": "0.0.0",
"type": "module",
"private": true,
"files": [
"dist"
],
"main": "./dist/es/index.js",
"module": "./dist/es/index.js",
"types": "./dist/es/index.d.ts",
"exports": {
".": {
"import": {
"types": "./dist/es/index.d.ts",
"default": "./dist/es/index.js"
},
"require": {
"types": "./dist/cjs/index.d.cts",
"default": "./dist/cjs/index.cjs"
}
}
},
"scripts": {
"build": "bunchee",
"dev": "bunchee --watch",
"lint": "eslint src/",
"check-types": "tsc --noEmit",
"test": "jest"
},
"jest": {
"preset": "@repo/jest-presets/node"
},
"devDependencies": {
"@jest/globals": "^29.7.0",
"@repo/eslint-config": "workspace:*",
"@repo/jest-presets": "workspace:*",
"@repo/typescript-config": "workspace:*",
"@types/node": "^22.15.3",
"bunchee": "^6.4.0",
"eslint": "^9.29.0",
"jest": "^29.7.0",
"typescript": "5.8.2"
}
}

12
packages/logger/src/__tests__/log.test.ts Normal file
View file

@ -0,0 +1,12 @@
import { describe, it, expect, jest } from "@jest/globals";
import { log } from "..";
jest.spyOn(global.console, "log");
describe("@repo/logger", () => {
it("prints a message", () => {
log("hello");
// eslint-disable-next-line no-console -- testing console
expect(console.log).toBeCalledWith("LOGGER: ", "hello");
});
});

4
packages/logger/src/index.ts Normal file
View file

@ -0,0 +1,4 @@
export const log = (...args: unknown[]): void => {
// eslint-disable-next-line no-console -- logger
console.log("LOGGER: ", ...args);
};

10
packages/logger/tsconfig.json Normal file
View file

@ -0,0 +1,10 @@
{
"extends": "@repo/typescript-config/base.json",
"compilerOptions": {
"lib": ["ES2015"],
"outDir": "./dist",
"types": ["jest", "node"]
},
"include": ["."],
"exclude": ["node_modules", "dist"],
}

12
packages/logger/turbo.json Normal file
View file

@ -0,0 +1,12 @@
{
"extends": [
"//"
],
"tasks": {
"build": {
"outputs": [
"dist/**"
]
}
}
}

4
packages/ui/eslint.config.mjs Normal file
View file

@ -0,0 +1,4 @@
import { config } from "@repo/eslint-config/react";
/** @type {import("eslint").Linter.Config} */
export default config;

60
packages/ui/package.json Normal file
View file

@ -0,0 +1,60 @@
{
"name": "@repo/ui",
"version": "0.0.0",
"private": true,
"license": "MIT",
"sideEffects": false,
"files": [
"dist/**",
"dist"
],
"exports": {
"./counter-button": {
"import": {
"types": "./dist/es/counter-button.d.mts",
"default": "./dist/es/counter-button.mjs"
},
"require": {
"types": "./dist/cjs/counter-button.d.ts",
"default": "./dist/cjs/counter-button.js"
}
},
"./link": {
"import": {
"types": "./dist/es/link.d.mts",
"default": "./dist/es/link.mjs"
},
"require": {
"types": "./dist/cjs/link.d.ts",
"default": "./dist/cjs/link.js"
}
}
},
"scripts": {
"build": "bunchee",
"dev": "bunchee --watch",
"check-types": "tsc --noEmit",
"lint": "eslint src/",
"test": "jest"
},
"jest": {
"preset": "@repo/jest-presets/browser"
},
"devDependencies": {
"@jest/globals": "^29.7.0",
"@repo/eslint-config": "workspace:*",
"@repo/jest-presets": "workspace:*",
"@repo/typescript-config": "workspace:*",
"@types/node": "^22.15.3",
"bunchee": "^6.4.0",
"eslint": "^9.29.0",
"jest": "^29.7.0",
"typescript": "5.8.2"
},
"peerDependencies": {
"@types/react": ">=18",
"@types/react-dom": ">=18",
"react": ">=18",
"react-dom": ">=18"
}
}

12
packages/ui/src/counter-button/index.test.tsx Normal file
View file

@ -0,0 +1,12 @@
import { describe, it } from "@jest/globals";
import { createRoot } from "react-dom/client";
import { CounterButton } from ".";
describe("CounterButton", () => {
it("renders without crashing", () => {
const div = document.createElement("div");
const root = createRoot(div);
root.render(<CounterButton />);
root.unmount();
});
});

50
packages/ui/src/counter-button/index.tsx Normal file
View file

@ -0,0 +1,50 @@
"use client";
import { useState } from "react";
export function CounterButton() {
const [count, setCount] = useState(0);
return (
<div
style={{
background: `rgba(0,0,0,0.05)`,
borderRadius: `8px`,
padding: "1.5rem",
fontWeight: 500,
}}
>
<p style={{ margin: "0 0 1.5rem 0" }}>
This component is from{" "}
<code
style={{
padding: "0.2rem 0.3rem",
background: `rgba(0,0,0,0.1)`,
borderRadius: "0.25rem",
}}
>
ui
</code>
</p>
<div>
<button
onClick={() => {
setCount((c) => c + 1);
}}
style={{
background: "black",
color: "white",
border: "none",
padding: "0.5rem 1rem",
borderRadius: "0.25rem",
display: "inline-block",
cursor: "pointer",
}}
type="button"
>
Count: {count}
</button>
</div>
</div>
);
}

12
packages/ui/src/link/index.test.tsx Normal file
View file

@ -0,0 +1,12 @@
import { describe, it } from "@jest/globals";
import { createRoot } from "react-dom/client";
import { Link } from ".";
describe("Link", () => {
it("renders without crashing", () => {
const div = document.createElement("div");
const root = createRoot(div);
root.render(<Link href="https://turborepo.com">Turborepo Docs</Link>);
root.unmount();
});
});

20
packages/ui/src/link/index.tsx Normal file
View file

@ -0,0 +1,20 @@
import type { AnchorHTMLAttributes, ReactNode } from "react";
interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
children: ReactNode;
newTab?: boolean;
href: string;
}
export function Link({ children, href, newTab, ...other }: LinkProps) {
return (
<a
href={href}
rel={newTab ? "noreferrer" : undefined}
target={newTab ? "_blank" : undefined}
{...other}
>
{children}
</a>
);
}

10
packages/ui/tsconfig.json Normal file
View file

@ -0,0 +1,10 @@
{
"extends": "@repo/typescript-config/react-library.json",
"compilerOptions": {
"lib": ["dom", "ES2015"],
"sourceMap": true,
"types": ["jest", "node"]
},
"include": ["."],
"exclude": ["dist", "build", "node_modules"]
}

8
packages/ui/turbo.json Normal file
View file

@ -0,0 +1,8 @@
{
"extends": ["//"],
"tasks": {
"build": {
"outputs": ["dist/**"]
}
}
}

10078
pnpm-lock.yaml generated Normal file
View file

File diff suppressed because it is too large Load diff

3
pnpm-workspace.yaml Normal file
View file

@ -0,0 +1,3 @@
packages:
- "apps/*"
- "packages/*"

32
turbo.json Normal file
View file

@ -0,0 +1,32 @@
{
"$schema": "https://turborepo.com/schema.json",
"ui": "tui",
"tasks": {
"build": {
"inputs": ["$TURBO_DEFAULT$", ".env*"],
"dependsOn": ["^build"],
"outputs": [
"build/**",
".vercel/**",
"dist/**",
".next/**",
"!.next/cache/**"
]
},
"test": {
"outputs": ["coverage/**"],
"dependsOn": []
},
"lint": {
"dependsOn": ["^build", "^lint"]
},
"check-types": {
"dependsOn": ["^build", "^check-types"]
},
"dev": {
"dependsOn": ["^build"],
"cache": false,
"persistent": true
}
}
}