feat: initial SchwarmbLog monorepo setup
- React + Vite + TanStack Router/Query frontend - Hono + Prisma + MySQL backend - Prisma schema mit allen Entitäten - Docker + docker-compose Setup - Tailwind mit Salm/Ozean Farbpalette
This commit is contained in:
4
.env.example
Normal file
4
.env.example
Normal file
@@ -0,0 +1,4 @@
|
||||
MYSQL_ROOT_PASSWORD=supersecret
|
||||
MYSQL_USER=schwarmblog
|
||||
MYSQL_PASSWORD=schwarmblog_pw
|
||||
JWT_SECRET=change-me-in-production
|
||||
7
.gitignore
vendored
Normal file
7
.gitignore
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
node_modules/
|
||||
dist/
|
||||
.env
|
||||
.env.local
|
||||
.DS_Store
|
||||
*.log
|
||||
.turbo/
|
||||
47
README.md
Normal file
47
README.md
Normal file
@@ -0,0 +1,47 @@
|
||||
# 🐟 SchwarmbLog
|
||||
**Gemeinsam die Welt entdecken**
|
||||
|
||||
BNE-Reiseblog-Portal der SALM Bremerhaven.
|
||||
|
||||
## Stack
|
||||
- **Frontend:** React + Vite + TanStack Router + TanStack Query + Tailwind CSS
|
||||
- **Backend:** Hono + Prisma + MySQL
|
||||
- **Deployment:** Docker + Dokploy
|
||||
|
||||
## Monorepo-Struktur
|
||||
```
|
||||
schwarmblog/
|
||||
├── apps/
|
||||
│ ├── api/ # Hono Backend
|
||||
│ └── web/ # React Frontend
|
||||
├── packages/ # Shared code (zukünftig)
|
||||
└── docker-compose.yml
|
||||
```
|
||||
|
||||
## Lokale Entwicklung
|
||||
|
||||
```bash
|
||||
# Abhängigkeiten installieren
|
||||
pnpm install
|
||||
|
||||
# .env anlegen
|
||||
cp .env.example .env
|
||||
cp apps/api/.env.example apps/api/.env
|
||||
# .env Werte anpassen
|
||||
|
||||
# Datenbank starten (Docker)
|
||||
docker compose up db -d
|
||||
|
||||
# Migrationen ausführen
|
||||
pnpm --filter @schwarmblog/api db:migrate
|
||||
|
||||
# Dev-Server starten
|
||||
pnpm dev
|
||||
```
|
||||
|
||||
## Deployment (Dokploy)
|
||||
Zwei Services in Dokploy anlegen:
|
||||
- `schwarmblog-api` → apps/api/Dockerfile
|
||||
- `schwarmblog-web` → apps/web/Dockerfile
|
||||
|
||||
Subdomain z.B. `schwarmblog.science-teaching.de` auf web zeigen lassen.
|
||||
3
apps/api/.env.example
Normal file
3
apps/api/.env.example
Normal file
@@ -0,0 +1,3 @@
|
||||
DATABASE_URL="mysql://user:password@localhost:3306/schwarmblog"
|
||||
JWT_SECRET="change-me-in-production"
|
||||
PORT=3001
|
||||
24
apps/api/Dockerfile
Normal file
24
apps/api/Dockerfile
Normal file
@@ -0,0 +1,24 @@
|
||||
FROM node:20-alpine AS base
|
||||
RUN corepack enable pnpm
|
||||
|
||||
FROM base AS deps
|
||||
WORKDIR /app
|
||||
COPY package.json pnpm-workspace.yaml ./
|
||||
COPY apps/api/package.json ./apps/api/
|
||||
RUN pnpm install --frozen-lockfile
|
||||
|
||||
FROM base AS build
|
||||
WORKDIR /app
|
||||
COPY --from=deps /app/node_modules ./node_modules
|
||||
COPY --from=deps /app/apps/api/node_modules ./apps/api/node_modules
|
||||
COPY . .
|
||||
WORKDIR /app/apps/api
|
||||
RUN pnpm db:generate
|
||||
RUN pnpm build
|
||||
|
||||
FROM node:20-alpine AS runner
|
||||
WORKDIR /app
|
||||
COPY --from=build /app/apps/api/dist ./dist
|
||||
COPY --from=build /app/apps/api/node_modules ./node_modules
|
||||
EXPOSE 3001
|
||||
CMD ["node", "dist/index.js"]
|
||||
32
apps/api/package.json
Normal file
32
apps/api/package.json
Normal file
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"name": "@schwarmblog/api",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "tsx watch src/index.ts",
|
||||
"build": "tsc",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"db:generate": "prisma generate",
|
||||
"db:migrate": "prisma migrate dev",
|
||||
"db:studio": "prisma studio"
|
||||
},
|
||||
"dependencies": {
|
||||
"@prisma/client": "^5.14.0",
|
||||
"hono": "^4.4.0",
|
||||
"@hono/node-server": "^1.12.0",
|
||||
"bcryptjs": "^2.4.3",
|
||||
"jsonwebtoken": "^9.0.2",
|
||||
"uuid": "^10.0.0",
|
||||
"dotenv": "^16.4.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/bcryptjs": "^2.4.6",
|
||||
"@types/jsonwebtoken": "^9.0.6",
|
||||
"@types/uuid": "^10.0.0",
|
||||
"@types/node": "^20.14.0",
|
||||
"prisma": "^5.14.0",
|
||||
"tsx": "^4.15.0",
|
||||
"typescript": "^5.4.5"
|
||||
}
|
||||
}
|
||||
260
apps/api/prisma/schema.prisma
Normal file
260
apps/api/prisma/schema.prisma
Normal file
@@ -0,0 +1,260 @@
|
||||
// SchwarmbLog – Prisma Schema
|
||||
// Stack: Hono + Prisma + MySQL
|
||||
// Conventions: camelCase in Prisma, snake_case in DB, cuid() for IDs
|
||||
|
||||
generator client {
|
||||
provider = "prisma-client-js"
|
||||
}
|
||||
|
||||
datasource db {
|
||||
provider = "mysql"
|
||||
url = env("DATABASE_URL")
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// USERS & AUTH
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
model User {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
email String? @unique
|
||||
role Role @default(STUDENT)
|
||||
|
||||
// Auth
|
||||
passwordHash String?
|
||||
qrToken String? @unique @map("qr_token")
|
||||
qrTokenCreated DateTime? @map("qr_token_created")
|
||||
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
// Relations
|
||||
classMemberships ClassMembership[]
|
||||
swarmMemberships SwarmMembership[]
|
||||
blog Blog?
|
||||
assignedTodos Todo[] @relation("AssignedTodos")
|
||||
reactions Reaction[]
|
||||
comments Comment[]
|
||||
|
||||
@@map("users")
|
||||
}
|
||||
|
||||
enum Role {
|
||||
ADMIN
|
||||
TEACHER
|
||||
STUDENT
|
||||
PARENT
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// CLASSES & SWARMS
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
model Class {
|
||||
id String @id @default(cuid())
|
||||
name String // z.B. "7a"
|
||||
schoolYear String @map("school_year") // z.B. "2025/26"
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
|
||||
memberships ClassMembership[]
|
||||
swarms Swarm[]
|
||||
blogs Blog[]
|
||||
|
||||
@@map("classes")
|
||||
}
|
||||
|
||||
model ClassMembership {
|
||||
id String @id @default(cuid())
|
||||
user User @relation(fields: [userId], references: [id])
|
||||
userId String @map("user_id")
|
||||
class Class @relation(fields: [classId], references: [id])
|
||||
classId String @map("class_id")
|
||||
role ClassRole @default(STUDENT)
|
||||
|
||||
@@unique([userId, classId])
|
||||
@@map("class_memberships")
|
||||
}
|
||||
|
||||
enum ClassRole {
|
||||
TEACHER
|
||||
STUDENT
|
||||
}
|
||||
|
||||
// Schwarm = Sichtbarkeitsgruppe (Klasse oder ganzer Jahrgang)
|
||||
model Swarm {
|
||||
id String @id @default(cuid())
|
||||
name String // z.B. "Schwarm 7a" oder "Schwarm Jahrgang 7"
|
||||
scope SwarmScope
|
||||
class Class? @relation(fields: [classId], references: [id])
|
||||
classId String? @map("class_id")
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
|
||||
memberships SwarmMembership[]
|
||||
|
||||
@@map("swarms")
|
||||
}
|
||||
|
||||
enum SwarmScope {
|
||||
CLASS // nur eine Klasse
|
||||
YEAR // ganzer Jahrgang
|
||||
}
|
||||
|
||||
model SwarmMembership {
|
||||
id String @id @default(cuid())
|
||||
swarm Swarm @relation(fields: [swarmId], references: [id])
|
||||
swarmId String @map("swarm_id")
|
||||
user User @relation(fields: [userId], references: [id])
|
||||
userId String @map("user_id")
|
||||
|
||||
@@unique([swarmId, userId])
|
||||
@@map("swarm_memberships")
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// STATIONEN & TEMPLATES
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
model Station {
|
||||
id String @id @default(cuid())
|
||||
name String // z.B. "Lagos"
|
||||
country String
|
||||
latitude Float
|
||||
longitude Float
|
||||
bneTopic String @map("bne_topic") // z.B. "Elektroschrott"
|
||||
description String? @db.Text
|
||||
orderIndex Int @map("order_index") // optimale Reihenfolge
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
templates EntryTemplate[]
|
||||
blogEntries BlogEntry[]
|
||||
|
||||
@@map("stations")
|
||||
}
|
||||
|
||||
// Vorstrukturierter Eintrag (Lückentext, Bildblock, etc.)
|
||||
// blocks: JSON-Array von Block-Objekten
|
||||
// Beispiel: [{ type: "gap_text", content: "Ich bin in ___ angekommen..." }, { type: "image" }, { type: "free_text" }]
|
||||
model EntryTemplate {
|
||||
id String @id @default(cuid())
|
||||
station Station @relation(fields: [stationId], references: [id])
|
||||
stationId String @map("station_id")
|
||||
title String
|
||||
blocks Json // Block-Struktur des Templates
|
||||
isOptional Boolean @default(false) @map("is_optional")
|
||||
orderIndex Int @default(0) @map("order_index")
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
todos Todo[]
|
||||
blogEntries BlogEntry[]
|
||||
|
||||
@@map("entry_templates")
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// BLOG & EINTRÄGE
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
model Blog {
|
||||
id String @id @default(cuid())
|
||||
student User @relation(fields: [studentId], references: [id])
|
||||
studentId String @unique @map("student_id")
|
||||
class Class @relation(fields: [classId], references: [id])
|
||||
classId String @map("class_id")
|
||||
title String @default("Mein Reiseblog")
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
entries BlogEntry[]
|
||||
todos Todo[]
|
||||
|
||||
@@map("blogs")
|
||||
}
|
||||
|
||||
model BlogEntry {
|
||||
id String @id @default(cuid())
|
||||
blog Blog @relation(fields: [blogId], references: [id])
|
||||
blogId String @map("blog_id")
|
||||
station Station? @relation(fields: [stationId], references: [id])
|
||||
stationId String? @map("station_id")
|
||||
template EntryTemplate? @relation(fields: [templateId], references: [id])
|
||||
templateId String? @map("template_id") // null = freier Eintrag
|
||||
title String
|
||||
blocks Json // Ausgefüllte Block-Inhalte (Text, Bildpfad, etc.)
|
||||
status EntryStatus @default(DRAFT)
|
||||
visibility Visibility @default(PRIVATE)
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
reactions Reaction[]
|
||||
comments Comment[]
|
||||
|
||||
@@map("blog_entries")
|
||||
}
|
||||
|
||||
enum EntryStatus {
|
||||
DRAFT
|
||||
PUBLISHED
|
||||
}
|
||||
|
||||
enum Visibility {
|
||||
PRIVATE // nur Schüler + Lehrkraft
|
||||
CLASS // Klassen-Schwarm
|
||||
YEAR // Jahrgangs-Schwarm
|
||||
PARENTS // zusätzlich Eltern
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// TODOS
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
// Lehrkraft weist Schüler einen vorstrukturierten Eintrag zu
|
||||
model Todo {
|
||||
id String @id @default(cuid())
|
||||
blog Blog @relation(fields: [blogId], references: [id])
|
||||
blogId String @map("blog_id")
|
||||
template EntryTemplate @relation(fields: [templateId], references: [id])
|
||||
templateId String @map("template_id")
|
||||
assignedBy User @relation("AssignedTodos", fields: [assignedById], references: [id])
|
||||
assignedById String @map("assigned_by")
|
||||
dueDate DateTime? @map("due_date")
|
||||
completedAt DateTime? @map("completed_at")
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
|
||||
@@map("todos")
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────
|
||||
// SOZIALES
|
||||
// ─────────────────────────────────────────────
|
||||
|
||||
model Reaction {
|
||||
id String @id @default(cuid())
|
||||
entry BlogEntry @relation(fields: [entryId], references: [id])
|
||||
entryId String @map("entry_id")
|
||||
user User @relation(fields: [userId], references: [id])
|
||||
userId String @map("user_id")
|
||||
type ReactionType @default(LIKE)
|
||||
|
||||
@@unique([entryId, userId]) // pro Eintrag nur eine Reaktion pro User
|
||||
@@map("reactions")
|
||||
}
|
||||
|
||||
enum ReactionType {
|
||||
LIKE
|
||||
}
|
||||
|
||||
model Comment {
|
||||
id String @id @default(cuid())
|
||||
entry BlogEntry @relation(fields: [entryId], references: [id])
|
||||
entryId String @map("entry_id")
|
||||
user User @relation(fields: [userId], references: [id])
|
||||
userId String @map("user_id")
|
||||
text String @db.Text
|
||||
createdAt DateTime @default(now()) @map("created_at")
|
||||
updatedAt DateTime @updatedAt @map("updated_at")
|
||||
|
||||
@@map("comments")
|
||||
}
|
||||
30
apps/api/src/index.ts
Normal file
30
apps/api/src/index.ts
Normal file
@@ -0,0 +1,30 @@
|
||||
import { serve } from "@hono/node-server";
|
||||
import { Hono } from "hono";
|
||||
import { cors } from "hono/cors";
|
||||
import { logger } from "hono/logger";
|
||||
import "dotenv/config";
|
||||
|
||||
const app = new Hono();
|
||||
|
||||
// Middleware
|
||||
app.use("*", logger());
|
||||
app.use(
|
||||
"*",
|
||||
cors({
|
||||
origin: process.env.FRONTEND_URL ?? "http://localhost:5173",
|
||||
credentials: true,
|
||||
})
|
||||
);
|
||||
|
||||
// Health check
|
||||
app.get("/health", (c) => c.json({ status: "ok", app: "SchwarmbLog API" }));
|
||||
|
||||
// Routes (werden schrittweise ergänzt)
|
||||
// app.route("/auth", authRoutes);
|
||||
// app.route("/stations", stationRoutes);
|
||||
// app.route("/blogs", blogRoutes);
|
||||
|
||||
const port = Number(process.env.PORT ?? 3001);
|
||||
console.log(`🐟 SchwarmbLog API läuft auf Port ${port}`);
|
||||
|
||||
serve({ fetch: app.fetch, port });
|
||||
13
apps/api/src/lib/db.ts
Normal file
13
apps/api/src/lib/db.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { PrismaClient } from "@prisma/client";
|
||||
|
||||
const globalForPrisma = globalThis as unknown as {
|
||||
prisma: PrismaClient | undefined;
|
||||
};
|
||||
|
||||
export const db =
|
||||
globalForPrisma.prisma ??
|
||||
new PrismaClient({
|
||||
log: process.env.NODE_ENV === "development" ? ["query", "error"] : ["error"],
|
||||
});
|
||||
|
||||
if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = db;
|
||||
26
apps/api/src/middleware/auth.ts
Normal file
26
apps/api/src/middleware/auth.ts
Normal file
@@ -0,0 +1,26 @@
|
||||
import { createMiddleware } from "hono/factory";
|
||||
import jwt from "jsonwebtoken";
|
||||
|
||||
export type AuthUser = {
|
||||
id: string;
|
||||
role: string;
|
||||
};
|
||||
|
||||
declare module "hono" {
|
||||
interface ContextVariableMap {
|
||||
user: AuthUser;
|
||||
}
|
||||
}
|
||||
|
||||
export const requireAuth = createMiddleware(async (c, next) => {
|
||||
const token = c.req.header("Authorization")?.replace("Bearer ", "");
|
||||
if (!token) return c.json({ error: "Unauthorized" }, 401);
|
||||
|
||||
try {
|
||||
const payload = jwt.verify(token, process.env.JWT_SECRET ?? "") as AuthUser;
|
||||
c.set("user", payload);
|
||||
await next();
|
||||
} catch {
|
||||
return c.json({ error: "Invalid token" }, 401);
|
||||
}
|
||||
});
|
||||
9
apps/api/tsconfig.json
Normal file
9
apps/api/tsconfig.json
Normal file
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "dist",
|
||||
"rootDir": "src",
|
||||
"moduleResolution": "node"
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
21
apps/web/Dockerfile
Normal file
21
apps/web/Dockerfile
Normal file
@@ -0,0 +1,21 @@
|
||||
FROM node:20-alpine AS base
|
||||
RUN corepack enable pnpm
|
||||
|
||||
FROM base AS deps
|
||||
WORKDIR /app
|
||||
COPY package.json pnpm-workspace.yaml ./
|
||||
COPY apps/web/package.json ./apps/web/
|
||||
RUN pnpm install --frozen-lockfile
|
||||
|
||||
FROM base AS build
|
||||
WORKDIR /app
|
||||
COPY --from=deps /app/node_modules ./node_modules
|
||||
COPY --from=deps /app/apps/web/node_modules ./apps/web/node_modules
|
||||
COPY . .
|
||||
WORKDIR /app/apps/web
|
||||
RUN pnpm build
|
||||
|
||||
FROM nginx:alpine AS runner
|
||||
COPY --from=build /app/apps/web/dist /usr/share/nginx/html
|
||||
COPY apps/web/nginx.conf /etc/nginx/conf.d/default.conf
|
||||
EXPOSE 80
|
||||
13
apps/web/index.html
Normal file
13
apps/web/index.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>SchwarmbLog – Gemeinsam die Welt entdecken</title>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
15
apps/web/nginx.conf
Normal file
15
apps/web/nginx.conf
Normal file
@@ -0,0 +1,15 @@
|
||||
server {
|
||||
listen 80;
|
||||
root /usr/share/nginx/html;
|
||||
index index.html;
|
||||
|
||||
location / {
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
|
||||
location /api/ {
|
||||
proxy_pass http://api:3001/;
|
||||
proxy_set_header Host $host;
|
||||
proxy_set_header X-Real-IP $remote_addr;
|
||||
}
|
||||
}
|
||||
33
apps/web/package.json
Normal file
33
apps/web/package.json
Normal file
@@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "@schwarmblog/web",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"preview": "vite preview",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"lint": "eslint src"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tanstack/react-query": "^5.45.0",
|
||||
"@tanstack/react-router": "^1.42.0",
|
||||
"@tanstack/router-devtools": "^1.42.0",
|
||||
"@tanstack/react-query-devtools": "^5.45.0",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"lucide-react": "^0.395.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.3.3",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"@vitejs/plugin-react": "^4.3.1",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"postcss": "^8.4.38",
|
||||
"tailwindcss": "^3.4.4",
|
||||
"typescript": "^5.4.5",
|
||||
"vite": "^5.3.1",
|
||||
"@tanstack/router-plugin": "^1.42.0"
|
||||
}
|
||||
}
|
||||
6
apps/web/postcss.config.js
Normal file
6
apps/web/postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
9
apps/web/src/index.css
Normal file
9
apps/web/src/index.css
Normal file
@@ -0,0 +1,9 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
body {
|
||||
@apply bg-ocean-50 text-gray-900 font-sans;
|
||||
}
|
||||
}
|
||||
24
apps/web/src/lib/api.ts
Normal file
24
apps/web/src/lib/api.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
const BASE = "/api";
|
||||
|
||||
async function request<T>(path: string, init?: RequestInit): Promise<T> {
|
||||
const token = localStorage.getItem("token");
|
||||
const res = await fetch(`${BASE}${path}`, {
|
||||
...init,
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
...(token ? { Authorization: `Bearer ${token}` } : {}),
|
||||
...init?.headers,
|
||||
},
|
||||
});
|
||||
if (!res.ok) throw new Error(await res.text());
|
||||
return res.json();
|
||||
}
|
||||
|
||||
export const api = {
|
||||
get: <T>(path: string) => request<T>(path),
|
||||
post: <T>(path: string, body: unknown) =>
|
||||
request<T>(path, { method: "POST", body: JSON.stringify(body) }),
|
||||
patch: <T>(path: string, body: unknown) =>
|
||||
request<T>(path, { method: "PATCH", body: JSON.stringify(body) }),
|
||||
delete: <T>(path: string) => request<T>(path, { method: "DELETE" }),
|
||||
};
|
||||
23
apps/web/src/main.tsx
Normal file
23
apps/web/src/main.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import { RouterProvider, createRouter } from "@tanstack/react-router";
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import { routeTree } from "./routeTree.gen";
|
||||
import "./index.css";
|
||||
|
||||
const queryClient = new QueryClient();
|
||||
const router = createRouter({ routeTree, context: { queryClient } });
|
||||
|
||||
declare module "@tanstack/react-router" {
|
||||
interface Register {
|
||||
router: typeof router;
|
||||
}
|
||||
}
|
||||
|
||||
ReactDOM.createRoot(document.getElementById("root")!).render(
|
||||
<React.StrictMode>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<RouterProvider router={router} />
|
||||
</QueryClientProvider>
|
||||
</React.StrictMode>
|
||||
);
|
||||
18
apps/web/src/routes/__root.tsx
Normal file
18
apps/web/src/routes/__root.tsx
Normal file
@@ -0,0 +1,18 @@
|
||||
import { createRootRouteWithContext, Outlet } from "@tanstack/react-router";
|
||||
import { TanStackRouterDevtools } from "@tanstack/router-devtools";
|
||||
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
|
||||
import type { QueryClient } from "@tanstack/react-query";
|
||||
|
||||
interface RouterContext {
|
||||
queryClient: QueryClient;
|
||||
}
|
||||
|
||||
export const Route = createRootRouteWithContext<RouterContext>()({
|
||||
component: () => (
|
||||
<>
|
||||
<Outlet />
|
||||
<TanStackRouterDevtools />
|
||||
<ReactQueryDevtools />
|
||||
</>
|
||||
),
|
||||
});
|
||||
15
apps/web/src/routes/index.tsx
Normal file
15
apps/web/src/routes/index.tsx
Normal file
@@ -0,0 +1,15 @@
|
||||
import { createFileRoute } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createFileRoute("/")({
|
||||
component: Index,
|
||||
});
|
||||
|
||||
function Index() {
|
||||
return (
|
||||
<div className="min-h-screen flex flex-col items-center justify-center gap-6">
|
||||
<div className="text-6xl">🐟</div>
|
||||
<h1 className="text-4xl font-bold text-ocean-800">SchwarmbLog</h1>
|
||||
<p className="text-ocean-600 text-lg">Gemeinsam die Welt entdecken</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
apps/web/tailwind.config.ts
Normal file
37
apps/web/tailwind.config.ts
Normal file
@@ -0,0 +1,37 @@
|
||||
import type { Config } from "tailwindcss";
|
||||
|
||||
export default {
|
||||
content: ["./index.html", "./src/**/*.{ts,tsx}"],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
// SchwarmbLog Farbpalette – Ozean/Lachs
|
||||
salm: {
|
||||
50: "#fff5f0",
|
||||
100: "#ffe0d0",
|
||||
200: "#ffb899",
|
||||
300: "#ff8c5a",
|
||||
400: "#ff6a2b",
|
||||
500: "#e84d0e",
|
||||
600: "#c43a07",
|
||||
700: "#9c2d05",
|
||||
800: "#7a2207",
|
||||
900: "#631d09",
|
||||
},
|
||||
ocean: {
|
||||
50: "#f0f9ff",
|
||||
100: "#e0f2fe",
|
||||
200: "#b9e6fd",
|
||||
300: "#7dd3fc",
|
||||
400: "#38bdf8",
|
||||
500: "#0ea5e9",
|
||||
600: "#0284c7",
|
||||
700: "#0369a1",
|
||||
800: "#075985",
|
||||
900: "#0c4a6e",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
} satisfies Config;
|
||||
11
apps/web/tsconfig.json
Normal file
11
apps/web/tsconfig.json
Normal file
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"jsx": "react-jsx",
|
||||
"outDir": "dist",
|
||||
"rootDir": "src"
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
19
apps/web/vite.config.ts
Normal file
19
apps/web/vite.config.ts
Normal file
@@ -0,0 +1,19 @@
|
||||
import { defineConfig } from "vite";
|
||||
import react from "@vitejs/plugin-react";
|
||||
import { TanStackRouterVite } from "@tanstack/router-plugin/vite";
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
TanStackRouterVite(),
|
||||
react(),
|
||||
],
|
||||
server: {
|
||||
port: 5173,
|
||||
proxy: {
|
||||
"/api": {
|
||||
target: "http://localhost:3001",
|
||||
rewrite: (path) => path.replace(/^\/api/, ""),
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
40
docker-compose.yml
Normal file
40
docker-compose.yml
Normal file
@@ -0,0 +1,40 @@
|
||||
services:
|
||||
db:
|
||||
image: mysql:8.0
|
||||
restart: unless-stopped
|
||||
environment:
|
||||
MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD}
|
||||
MYSQL_DATABASE: schwarmblog
|
||||
MYSQL_USER: ${MYSQL_USER}
|
||||
MYSQL_PASSWORD: ${MYSQL_PASSWORD}
|
||||
volumes:
|
||||
- db_data:/var/lib/mysql
|
||||
ports:
|
||||
- "3306:3306"
|
||||
|
||||
api:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: apps/api/Dockerfile
|
||||
restart: unless-stopped
|
||||
environment:
|
||||
DATABASE_URL: mysql://${MYSQL_USER}:${MYSQL_PASSWORD}@db:3306/schwarmblog
|
||||
JWT_SECRET: ${JWT_SECRET}
|
||||
NODE_ENV: production
|
||||
depends_on:
|
||||
- db
|
||||
ports:
|
||||
- "3001:3001"
|
||||
|
||||
web:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: apps/web/Dockerfile
|
||||
restart: unless-stopped
|
||||
depends_on:
|
||||
- api
|
||||
ports:
|
||||
- "80:80"
|
||||
|
||||
volumes:
|
||||
db_data:
|
||||
16
package.json
Normal file
16
package.json
Normal file
@@ -0,0 +1,16 @@
|
||||
{
|
||||
"name": "schwarmblog",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"packageManager": "pnpm@9.0.0",
|
||||
"scripts": {
|
||||
"dev": "pnpm --parallel -r dev",
|
||||
"build": "pnpm -r build",
|
||||
"lint": "pnpm -r lint",
|
||||
"typecheck": "pnpm -r typecheck"
|
||||
},
|
||||
"workspaces": [
|
||||
"apps/*",
|
||||
"packages/*"
|
||||
]
|
||||
}
|
||||
3
pnpm-workspace.yaml
Normal file
3
pnpm-workspace.yaml
Normal file
@@ -0,0 +1,3 @@
|
||||
packages:
|
||||
- 'apps/*'
|
||||
- 'packages/*'
|
||||
10
tsconfig.json
Normal file
10
tsconfig.json
Normal file
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2022",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": true
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user