feat(frontend): Next.js 15 + React 19 + Tailwind 4 + lightweight-charts scaffold

frontend/.prettierignore

@@ -0,0 +1,5 @@
+node_modules
+.next
+out
+dist
+pnpm-lock.yaml

frontend/.prettierrc.json

@@ -0,0 +1,8 @@
+{
+  "semi": true,
+  "singleQuote": false,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "tabWidth": 2,
+  "arrowParens": "always"
+}

frontend/app/chart/[index]/page.tsx

@@ -0,0 +1,10 @@
+type Params = Promise<{ index: string }>;
+
+export default async function ChartPage({ params }: { params: Params }) {
+  const { index } = await params;
+  return (
+    <main className="min-h-screen flex items-center justify-center px-6">
+      <p className="text-sm text-foreground/60">chart — {index} — placeholder</p>
+    </main>
+  );
+}

frontend/app/docs/page.tsx

@@ -0,0 +1,7 @@
+export default function DocsPage() {
+  return (
+    <main className="min-h-screen flex items-center justify-center px-6">
+      <p className="text-sm text-foreground/60">api docs — placeholder</p>
+    </main>
+  );
+}

frontend/app/globals.css

@@ -0,0 +1,24 @@
+@import "tailwindcss";
+
+:root {
+  --background: #0a0a0a;
+  --foreground: #ededed;
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+}
+
+body {
+  background: var(--background);
+  color: var(--foreground);
+  font-family:
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+}

frontend/app/layout.tsx

@@ -0,0 +1,19 @@
+import type { Metadata } from "next";
+import "./globals.css";
+
+export const metadata: Metadata = {
+  title: "VolX",
+  description: "Crypto volatility index — BVOL + EVOL, 60s cadence, multi-venue.",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  );
+}

frontend/app/methodology/page.tsx

@@ -0,0 +1,7 @@
+export default function MethodologyPage() {
+  return (
+    <main className="min-h-screen flex items-center justify-center px-6">
+      <p className="text-sm text-foreground/60">methodology — placeholder</p>
+    </main>
+  );
+}

frontend/app/page.tsx

@@ -0,0 +1,13 @@
+export default function HomePage() {
+  return (
+    <main className="min-h-screen flex flex-col items-center justify-center px-6">
+      <div className="max-w-2xl text-center">
+        <h1 className="text-4xl font-semibold tracking-tight">VolX</h1>
+        <p className="mt-3 text-sm text-foreground/60">
+          Crypto volatility index. BVOL + EVOL, 60-second cadence, multi-venue blend.
+        </p>
+        <p className="mt-8 text-xs text-foreground/40">scaffold — landing &amp; chart land next</p>
+      </div>
+    </main>
+  );
+}

frontend/eslint.config.mjs

@@ -0,0 +1,21 @@
+import { dirname } from "node:path";
+import { fileURLToPath } from "node:url";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+});
+
+const config = [
+  ...compat.extends("next/core-web-vitals", "next/typescript"),
+  {
+    rules: {
+      "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
+    },
+  },
+];
+
+export default config;

frontend/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.

frontend/next.config.ts

@@ -0,0 +1,11 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  reactStrictMode: true,
+  poweredByHeader: false,
+  experimental: {
+    typedRoutes: true,
+  },
+};
+
+export default nextConfig;

frontend/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "volx-frontend",
+  "version": "0.1.0",
+  "private": true,
+  "packageManager": "pnpm@9.15.0",
+  "engines": {
+    "node": ">=22.0.0"
+  },
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "typecheck": "tsc --noEmit",
+    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json,md,css}\"",
+    "format:check": "prettier --check \"**/*.{ts,tsx,js,jsx,json,md,css}\""
+  },
+  "dependencies": {
+    "next": "15.1.6",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "lightweight-charts": "4.2.2"
+  },
+  "devDependencies": {
+    "@types/node": "22.10.7",
+    "@types/react": "19.0.7",
+    "@types/react-dom": "19.0.3",
+    "@tailwindcss/postcss": "4.0.17",
+    "tailwindcss": "4.0.17",
+    "postcss": "8.5.1",
+    "typescript": "5.7.3",
+    "eslint": "9.18.0",
+    "eslint-config-next": "15.1.6",
+    "@eslint/eslintrc": "3.2.0",
+    "prettier": "3.4.2"
+  }
+}