create-stackrjs 1.4.0

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "create-stackrjs",
+  "version": "1.4.0",
+  "description": "Scaffold a runnable full-stack Next.js project in one command",
+  "type": "module",
+  "bin": {
+    "create-stackrjs": "dist/index.js"
+  },
+  "files": [
+    "dist",
+    "template"
+  ],
+  "engines": {
+    "node": ">=18.18.0"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "start": "node dist/index.js",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "smoke": "tsx scripts/smoke.ts",
+    "release": "semantic-release",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "cli",
+    "scaffold",
+    "nextjs",
+    "starter",
+    "fullstack",
+    "create",
+    "generator"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Tristan-stack/stackr.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Tristan-stack/stackr/issues"
+  },
+  "homepage": "https://github.com/Tristan-stack/stackr#readme",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@clack/prompts": "^0.7.0",
+    "picocolors": "^1.0.1"
+  },
+  "devDependencies": {
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@types/node": "^20.14.0",
+    "semantic-release": "^24.2.0",
+    "tsup": "^8.3.5",
+    "tsx": "^4.19.2",
+    "typescript": "^5.7.2",
+    "vitest": "^2.1.8"
+  }
+}

package/template/architectures/microservices/_gitignore

@@ -0,0 +1,26 @@
+node_modules
+.pnp
+.pnp.js
+
+# next.js
+.next/
+out/
+build/
+dist/
+
+# misc
+.DS_Store
+*.pem
+*.log
+
+# env files
+.env
+.env*.local
+
+# typescript
+next-env.d.ts
+*.tsbuildinfo
+
+# prisma
+services/api/prisma/migrations/dev.db*
+services/api/src/generated

package/template/architectures/microservices/apps/web/Dockerfile

@@ -0,0 +1,11 @@
+FROM node:20-alpine
+WORKDIR /app
+
+COPY package.json ./
+RUN npm install
+
+COPY . .
+RUN npm run build
+
+EXPOSE 3000
+CMD ["npm", "start"]

package/template/architectures/microservices/apps/web/next-env.d.ts

@@ -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.

package/template/architectures/microservices/apps/web/next.config.mjs

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {};
+
+export default nextConfig;

package/template/architectures/microservices/apps/web/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@app/web",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "next": "^15.1.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "devDependencies": {
+    "@types/node": "^20.14.0",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "eslint": "^8.57.1",
+    "eslint-config-next": "^15.1.3",
+    "typescript": "^5.7.2"
+  }
+}

package/template/architectures/microservices/apps/web/src/app/account/page.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
+import { api } from "@/lib/api";
+
+interface Me {
+  id: string;
+  email: string;
+}
+
+export default function AccountPage() {
+  const router = useRouter();
+  const [me, setMe] = useState<Me | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    let active = true;
+    api("/auth/me").then(async (res) => {
+      if (!active) return;
+      if (res.ok) setMe(await res.json());
+      else router.replace("/login");
+      setLoading(false);
+    });
+    return () => {
+      active = false;
+    };
+  }, [router]);
+
+  async function logout() {
+    await api("/auth/logout", { method: "POST" });
+    router.replace("/login");
+    router.refresh();
+  }
+
+  if (loading) {
+    return <main className="flex min-h-screen items-center justify-center p-8">Loading…</main>;
+  }
+
+  return (
+    <main className="mx-auto flex min-h-screen max-w-sm flex-col justify-center gap-6 p-8">
+      <h1 className="text-2xl font-bold">Your account</h1>
+      <p className="text-gray-600">
+        Signed in as <strong>{me?.email}</strong>. This page is protected — it reads your session
+        from the API service.
+      </p>
+      <button
+        type="button"
+        onClick={logout}
+        className="rounded-md border border-gray-300 px-4 py-2 text-sm font-medium hover:bg-gray-100"
+      >
+        Sign out
+      </button>
+    </main>
+  );
+}

package/template/architectures/microservices/apps/web/src/app/globals.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/template/architectures/microservices/apps/web/src/app/layout.tsx

@@ -0,0 +1,16 @@
+import "./globals.css";
+import type { Metadata } from "next";
+import type { ReactNode } from "react";
+
+export const metadata: Metadata = {
+  title: "Stackr app",
+  description: "Generated by Stackr (microservices)",
+};
+
+export default function RootLayout({ children }: { children: ReactNode }) {
+  return (
+    <html lang="en">
+      <body className="min-h-screen bg-gray-50 text-gray-900 antialiased">{children}</body>
+    </html>
+  );
+}

package/template/architectures/microservices/apps/web/src/app/login/page.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import Link from "next/link";
+import { api } from "@/lib/api";
+
+export default function LoginPage() {
+  const router = useRouter();
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [pending, setPending] = useState(false);
+
+  async function onSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setPending(true);
+    setError(null);
+    const res = await api("/auth/login", {
+      method: "POST",
+      body: JSON.stringify({ email, password }),
+    });
+    setPending(false);
+    if (res.ok) {
+      router.push("/account");
+      router.refresh();
+    } else {
+      const data = await res.json().catch(() => ({}));
+      setError(data.error ?? "Login failed.");
+    }
+  }
+
+  return (
+    <main className="mx-auto flex min-h-screen max-w-sm flex-col justify-center gap-6 p-8">
+      <h1 className="text-2xl font-bold">Sign in</h1>
+      <form onSubmit={onSubmit} className="flex flex-col gap-3">
+        <input
+          type="email"
+          required
+          placeholder="you@example.com"
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+          className="rounded-md border border-gray-300 px-3 py-2 text-sm"
+        />
+        <input
+          type="password"
+          required
+          placeholder="Password"
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+          className="rounded-md border border-gray-300 px-3 py-2 text-sm"
+        />
+        {error && <p className="text-sm text-red-600">{error}</p>}
+        <button
+          type="submit"
+          disabled={pending}
+          className="rounded-md bg-gray-900 px-4 py-2 text-sm font-medium text-white hover:bg-gray-700 disabled:opacity-50"
+        >
+          {pending ? "Signing in…" : "Sign in"}
+        </button>
+      </form>
+      <p className="text-sm text-gray-600">
+        No account?{" "}
+        <Link href="/register" className="underline">
+          Register
+        </Link>
+      </p>
+    </main>
+  );
+}

package/template/architectures/microservices/apps/web/src/app/page.tsx

@@ -0,0 +1,33 @@
+import Link from "next/link";
+
+export default function Home() {
+  return (
+    <main className="mx-auto flex min-h-screen max-w-2xl flex-col items-center justify-center gap-6 p-8 text-center">
+      <h1 className="text-4xl font-bold tracking-tight">It works 🎉</h1>
+      <p className="text-gray-600">
+        This is the <strong>web</strong> service. It talks to the <strong>api</strong> service
+        through the gateway. Register an account, then sign in.
+      </p>
+      <div className="flex gap-3">
+        <Link
+          href="/register"
+          className="rounded-md bg-gray-900 px-4 py-2 text-sm font-medium text-white hover:bg-gray-700"
+        >
+          Register
+        </Link>
+        <Link
+          href="/login"
+          className="rounded-md border border-gray-300 px-4 py-2 text-sm font-medium hover:bg-gray-100"
+        >
+          Sign in
+        </Link>
+        <Link
+          href="/account"
+          className="rounded-md border border-gray-300 px-4 py-2 text-sm font-medium hover:bg-gray-100"
+        >
+          Account
+        </Link>
+      </div>
+    </main>
+  );
+}

package/template/architectures/microservices/apps/web/src/app/register/page.tsx

@@ -0,0 +1,71 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import Link from "next/link";
+import { api } from "@/lib/api";
+
+export default function RegisterPage() {
+  const router = useRouter();
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [pending, setPending] = useState(false);
+
+  async function onSubmit(e: React.FormEvent) {
+    e.preventDefault();
+    setPending(true);
+    setError(null);
+    const res = await api("/auth/register", {
+      method: "POST",
+      body: JSON.stringify({ email, password }),
+    });
+    setPending(false);
+    if (res.ok) {
+      router.push("/account");
+      router.refresh();
+    } else {
+      const data = await res.json().catch(() => ({}));
+      setError(data.error ?? "Registration failed.");
+    }
+  }
+
+  return (
+    <main className="mx-auto flex min-h-screen max-w-sm flex-col justify-center gap-6 p-8">
+      <h1 className="text-2xl font-bold">Create your account</h1>
+      <form onSubmit={onSubmit} className="flex flex-col gap-3">
+        <input
+          type="email"
+          required
+          placeholder="you@example.com"
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+          className="rounded-md border border-gray-300 px-3 py-2 text-sm"
+        />
+        <input
+          type="password"
+          required
+          minLength={8}
+          placeholder="Password (min 8 characters)"
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+          className="rounded-md border border-gray-300 px-3 py-2 text-sm"
+        />
+        {error && <p className="text-sm text-red-600">{error}</p>}
+        <button
+          type="submit"
+          disabled={pending}
+          className="rounded-md bg-gray-900 px-4 py-2 text-sm font-medium text-white hover:bg-gray-700 disabled:opacity-50"
+        >
+          {pending ? "Creating…" : "Create account"}
+        </button>
+      </form>
+      <p className="text-sm text-gray-600">
+        Already registered?{" "}
+        <Link href="/login" className="underline">
+          Sign in
+        </Link>
+      </p>
+    </main>
+  );
+}

package/template/architectures/microservices/apps/web/src/lib/api.ts

@@ -0,0 +1,15 @@
+/**
+ * Tiny fetch wrapper for talking to the API service. In the browser, requests go
+ * through the gateway (NEXT_PUBLIC_API_URL, e.g. http://localhost:8080/api),
+ * which proxies /api/* to the API service. `credentials: "include"` carries the
+ * httpOnly session cookie.
+ */
+const API_URL = process.env.NEXT_PUBLIC_API_URL ?? "http://localhost:3001";
+
+export async function api(path: string, init?: RequestInit): Promise<Response> {
+  return fetch(`${API_URL}${path}`, {
+    ...init,
+    credentials: "include",
+    headers: { "Content-Type": "application/json", ...(init?.headers ?? {}) },
+  });
+}

package/template/architectures/microservices/apps/web/tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [{ "name": "next" }],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/template/architectures/microservices/docker-compose.yml

@@ -0,0 +1,45 @@
+services:
+  db:
+    image: postgres:16
+    restart: unless-stopped
+    environment:
+      POSTGRES_USER: postgres
+      POSTGRES_PASSWORD: postgres
+      POSTGRES_DB: app
+    ports:
+      - "5432:5432"
+    volumes:
+      - db_data:/var/lib/postgresql/data
+
+  api:
+    build: ./services/api
+    restart: unless-stopped
+    environment:
+      DATABASE_URL: postgresql://postgres:postgres@db:5432/app?schema=public
+      AUTH_SECRET: ${AUTH_SECRET:-dev-insecure-change-me}
+      PORT: "3001"
+    depends_on:
+      - db
+
+  web:
+    build: ./apps/web
+    restart: unless-stopped
+    environment:
+      # The browser reaches the API through the gateway (see gateway/nginx.conf).
+      NEXT_PUBLIC_API_URL: http://localhost:8080/api
+    depends_on:
+      - api
+
+  gateway:
+    image: nginx:1.27-alpine
+    restart: unless-stopped
+    ports:
+      - "8080:80"
+    volumes:
+      - ./gateway/nginx.conf:/etc/nginx/conf.d/default.conf:ro
+    depends_on:
+      - web
+      - api
+
+volumes:
+  db_data:

package/template/architectures/microservices/gateway/nginx.conf

@@ -0,0 +1,20 @@
+# Reverse proxy: a single public origin in front of the web app and the API.
+# Requests to /api/* are forwarded to the API service (prefix stripped); every
+# other path goes to the Next.js web app.
+server {
+  listen 80;
+
+  location /api/ {
+    proxy_pass http://api:3001/;
+    proxy_set_header Host $host;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+  }
+
+  location / {
+    proxy_pass http://web:3000;
+    proxy_set_header Host $host;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+  }
+}

package/template/architectures/microservices/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "app",
+  "version": "0.1.0",
+  "private": true,
+  "workspaces": [
+    "apps/*",
+    "services/*"
+  ],
+  "scripts": {
+    "dev": "npm run dev --workspaces --if-present",
+    "build": "npm run build --workspaces --if-present",
+    "dev:web": "npm run dev --workspace apps/web",
+    "dev:api": "npm run dev --workspace services/api",
+    "db:migrate": "npm run db:migrate --workspace services/api",
+    "db:studio": "npm run db:studio --workspace services/api",
+    "compose:up": "docker compose up -d",
+    "compose:down": "docker compose down"
+  },
+  "dependencies": {},
+  "devDependencies": {}
+}

package/template/architectures/microservices/services/api/Dockerfile

@@ -0,0 +1,11 @@
+FROM node:20-alpine
+WORKDIR /app
+
+COPY package.json ./
+RUN npm install
+
+COPY . .
+RUN npx prisma generate && npm run build
+
+EXPOSE 3001
+CMD ["npm", "start"]

package/template/architectures/microservices/services/api/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@app/api",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "tsx watch src/index.ts",
+    "build": "tsc",
+    "start": "node dist/index.js",
+    "typecheck": "tsc --noEmit",
+    "db:migrate": "prisma migrate dev",
+    "db:studio": "prisma studio",
+    "postinstall": "prisma generate"
+  },
+  "dependencies": {
+    "@hono/node-server": "^1.13.7",
+    "@prisma/adapter-pg": "^7.8.0",
+    "@prisma/client": "^7.8.0",
+    "bcryptjs": "^2.4.3",
+    "hono": "^4.6.14",
+    "jose": "^5.9.6",
+    "pg": "^8.13.1",
+    "zod": "^3.24.1"
+  },
+  "devDependencies": {
+    "@types/bcryptjs": "^2.4.6",
+    "@types/node": "^20.14.0",
+    "@types/pg": "^8.11.10",
+    "dotenv": "^16.4.7",
+    "prisma": "^7.8.0",
+    "tsx": "^4.19.2",
+    "typescript": "^5.7.2"
+  }
+}

package/template/architectures/microservices/services/api/prisma/schema.prisma

@@ -0,0 +1,17 @@
+generator client {
+  provider            = "prisma-client"
+  output              = "../src/generated/prisma"
+  moduleFormat        = "esm"
+  importFileExtension = "js"
+}
+
+datasource db {
+  provider = "postgresql"
+}
+
+model User {
+  id           String   @id @default(cuid())
+  email        String   @unique
+  passwordHash String
+  createdAt    DateTime @default(now())
+}

package/template/architectures/microservices/services/api/prisma.config.ts

@@ -0,0 +1,17 @@
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import { config } from "dotenv";
+import { defineConfig, env } from "prisma/config";
+
+// The workspace `.env` lives at the monorepo root (two levels up), so load it
+// explicitly rather than relying on the current working directory.
+const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "../..");
+config({ path: path.join(root, ".env") });
+
+// Prisma 7 reads connection config from here (not the schema). The API service
+// owns its database; the URL comes from the workspace `.env`.
+export default defineConfig({
+  schema: "prisma/schema.prisma",
+  migrations: { path: "prisma/migrations" },
+  datasource: { url: env("DATABASE_URL") },
+});

package/template/architectures/microservices/services/api/src/auth.ts

@@ -0,0 +1,22 @@
+import { SignJWT, jwtVerify } from "jose";
+
+const secret = new TextEncoder().encode(process.env.AUTH_SECRET ?? "dev-insecure-change-me");
+
+/** Sign a 7-day session token for a user id. */
+export async function signSession(userId: string): Promise<string> {
+  return new SignJWT({ sub: userId })
+    .setProtectedHeader({ alg: "HS256" })
+    .setIssuedAt()
+    .setExpirationTime("7d")
+    .sign(secret);
+}
+
+/** Verify a session token, returning the user id or null when invalid/expired. */
+export async function verifySession(token: string): Promise<string | null> {
+  try {
+    const { payload } = await jwtVerify(token, secret);
+    return typeof payload.sub === "string" ? payload.sub : null;
+  } catch {
+    return null;
+  }
+}

package/template/architectures/microservices/services/api/src/db.ts

@@ -0,0 +1,12 @@
+import { PrismaClient } from "./generated/prisma/client.js";
+import { PrismaPg } from "@prisma/adapter-pg";
+
+const globalForPrisma = globalThis as unknown as { prisma?: PrismaClient };
+
+// Reuse a single PrismaClient across hot reloads in development. Prisma 7 connects
+// through a driver adapter (connection string from `.env`).
+const adapter = new PrismaPg({ connectionString: process.env.DATABASE_URL });
+
+export const prisma = globalForPrisma.prisma ?? new PrismaClient({ adapter });
+
+if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma;

package/template/architectures/microservices/services/api/src/index.ts

@@ -0,0 +1,22 @@
+import { serve } from "@hono/node-server";
+import { Hono } from "hono";
+import { cors } from "hono/cors";
+import { authRoutes } from "./routes/auth.js";
+
+const app = new Hono();
+
+// Allow the web app's origin to send/receive the session cookie.
+app.use(
+  "*",
+  cors({
+    origin: (origin) => origin ?? "*",
+    credentials: true,
+  }),
+);
+
+app.get("/health", (c) => c.json({ status: "ok" }));
+app.route("/auth", authRoutes);
+
+const port = Number(process.env.PORT ?? 3001);
+serve({ fetch: app.fetch, port });
+console.log(`API service listening on :${port}`);