1
0

feat: react/vite/tailwind web scaffold with jsdom tests

This commit is contained in:
2026-08-29 19:26:10 +02:00
parent 26609d8b62
commit 63e8c5f054
11 changed files with 2395 additions and 7 deletions

2273
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -3,29 +3,47 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"type": "module", "type": "module",
"engines": { "node": ">=20" }, "engines": {
"node": ">=20"
},
"scripts": { "scripts": {
"dev:server": "tsx watch server/src/index.ts", "dev:server": "tsx watch server/src/index.ts",
"dev": "npm run dev:server", "dev:web": "vite --config web/vite.config.ts",
"dev": "concurrently -k \"npm:dev:server\" \"npm:dev:web\"",
"test": "vitest run", "test": "vitest run",
"test:watch": "vitest", "test:watch": "vitest",
"build:server": "tsc -p server/tsconfig.build.json", "build:server": "tsc -p server/tsconfig.build.json",
"build": "npm run build:server", "build:web": "vite build --config web/vite.config.ts",
"build": "npm run build:server && npm run build:web",
"start": "node server/dist/index.js", "start": "node server/dist/index.js",
"typecheck": "tsc -p server/tsconfig.json --noEmit" "typecheck": "tsc -p server/tsconfig.json --noEmit && tsc -p web --noEmit"
}, },
"dependencies": { "dependencies": {
"@fastify/cookie": "^11.0.0", "@fastify/cookie": "^11.0.0",
"@fastify/static": "^8.0.0", "@fastify/static": "^8.0.0",
"argon2": "^0.41.1", "argon2": "^0.41.1",
"better-sqlite3": "^13.0.3", "better-sqlite3": "^13.0.3",
"fastify": "^5.0.0" "fastify": "^5.0.0",
"react": "^19.2.8",
"react-dom": "^19.2.8",
"react-router-dom": "^7.18.3"
}, },
"devDependencies": { "devDependencies": {
"@tailwindcss/vite": "^4.3.3",
"@testing-library/dom": "^10.4.1",
"@testing-library/react": "^16.3.3",
"@testing-library/user-event": "^14.6.6",
"@types/better-sqlite3": "^7.6.11", "@types/better-sqlite3": "^7.6.11",
"@types/node": "^22.5.0", "@types/node": "^22.5.0",
"@types/react": "^19.2.18",
"@types/react-dom": "^19.2.5",
"@vitejs/plugin-react": "^5.2.0",
"concurrently": "^10.0.5",
"jsdom": "^30.0.1",
"tailwindcss": "^4.3.3",
"tsx": "^4.16.0", "tsx": "^4.16.0",
"typescript": "^5.5.4", "typescript": "^5.5.4",
"vite": "^7.3.6",
"vitest": "^3.0.0" "vitest": "^3.0.0"
} }
} }

View File

@@ -2,6 +2,22 @@ import { defineConfig } from 'vitest/config'
export default defineConfig({ export default defineConfig({
test: { test: {
projects: [
{
test: {
name: 'server',
include: ['server/test/**/*.test.ts'], include: ['server/test/**/*.test.ts'],
environment: 'node',
},
},
{
test: {
name: 'web',
include: ['web/test/**/*.test.tsx'],
environment: 'jsdom',
setupFiles: ['web/test/setup.ts'],
},
},
],
}, },
}) })

13
web/index.html Normal file
View File

@@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#0a0a0a" />
<title>record-shop</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

7
web/src/App.tsx Normal file
View File

@@ -0,0 +1,7 @@
export default function App() {
return (
<div className="min-h-dvh bg-neutral-950 text-neutral-100 flex items-center justify-center">
<h1 className="text-2xl font-semibold">record-shop</h1>
</div>
)
}

10
web/src/main.tsx Normal file
View File

@@ -0,0 +1,10 @@
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './styles.css'
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<App />
</React.StrictMode>
)

1
web/src/styles.css Normal file
View File

@@ -0,0 +1 @@
@import 'tailwindcss';

6
web/test/setup.ts Normal file
View File

@@ -0,0 +1,6 @@
import { afterEach } from 'vitest'
import { cleanup } from '@testing-library/react'
afterEach(() => {
cleanup()
})

10
web/test/smoke.test.tsx Normal file
View File

@@ -0,0 +1,10 @@
import { describe, it, expect } from 'vitest'
import { render, screen } from '@testing-library/react'
import App from '../src/App'
describe('App', () => {
it('renders the app title', () => {
render(<App />)
expect(screen.getByRole('heading', { name: 'record-shop' })).toBeTruthy()
})
})

19
web/tsconfig.json Normal file
View File

@@ -0,0 +1,19 @@
{
"compilerOptions": {
"target": "ES2022",
"module": "ESNext",
"moduleResolution": "bundler",
"lib": ["ES2022", "DOM", "DOM.Iterable"],
"jsx": "react-jsx",
"strict": true,
"noUncheckedIndexedAccess": true,
"forceConsistentCasingInFileNames": true,
"skipLibCheck": true,
"esModuleInterop": true,
"resolveJsonModule": true,
"noEmit": true,
"isolatedModules": true,
"types": ["vite/client"]
},
"include": ["src", "test", "vite.config.ts"]
}

17
web/vite.config.ts Normal file
View File

@@ -0,0 +1,17 @@
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'
export default defineConfig({
plugins: [react(), tailwindcss()],
root: import.meta.dirname,
server: {
proxy: {
'/api': 'http://localhost:3000',
'/artwork': 'http://localhost:3000',
},
},
build: {
outDir: 'dist',
},
})