feat: initialize Next.js TypeScript starter

.eslintrc.cjs

@@ -0,0 +1,17 @@
+/**
+ * @file ESLint configuration for the Next.js project with Prettier integration.
+ */
+module.exports = {
+  root: true,
+  extends: [
+    'next/core-web-vitals',
+    'plugin:prettier/recommended'
+  ],
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  },
+  rules: {
+    'prettier/prettier': ['error']
+  }
+};

.gitignore

@@ -0,0 +1,40 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Next.js
+.next/
+out/
+
+# Production
+build
+
+# Misc
+.DS_Store
+*.swp
+
+# Dependency directories
+node_modules/
+
+# Local env files
+.env*
+!.env.example

CHANGELOG.md

@@ -0,0 +1,5 @@
+# Changelog
+
+## [0.1.0] - 2025-10-29
+- Removed the placeholder root README header in favor of a project overview.
+- Replaced default scaffolded boilerplate with custom TypeScript-first structure.

README.md

@@ -1 +1,20 @@
-# web
+# Next.js TypeScript Starter
+
+This project bootstraps a Next.js application configured for TypeScript, ESLint, and Prettier.
+
+## Getting Started
+
+Install dependencies and run the development server:
+
+```bash
+npm install
+npm run dev
+```
+
+## Available Scripts
+
+- `npm run dev` – start the development server.
+- `npm run build` – create an optimized production build.
+- `npm run start` – run the production server locally.
+- `npm run lint` – execute ESLint checks.
+- `npm run format` – format files with Prettier.

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/basic-features/typescript for more information.

next.config.js

@@ -0,0 +1,13 @@
+/**
+ * @file Next.js configuration enabling the src directory structure.
+ * @see https://nextjs.org/docs/app/building-your-application/configuring
+ */
+const nextConfig = {
+  reactStrictMode: true,
+  swcMinify: true,
+  experimental: {
+    typedRoutes: true
+  }
+};
+
+module.exports = nextConfig;

package.json

@@ -0,0 +1,28 @@
+{
+  "name": "web-app",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "format": "prettier --write ."
+  },
+  "dependencies": {
+    "next": "14.2.15",
+    "react": "18.3.1",
+    "react-dom": "18.3.1"
+  },
+  "devDependencies": {
+    "@types/node": "20.17.6",
+    "@types/react": "18.3.10",
+    "@types/react-dom": "18.3.5",
+    "eslint": "9.14.0",
+    "eslint-config-next": "14.2.15",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.2.1",
+    "prettier": "3.4.1",
+    "typescript": "5.6.3"
+  }
+}

prettier.config.cjs

@@ -0,0 +1,11 @@
+/**
+ * @file Shared Prettier configuration to enforce consistent formatting.
+ */
+module.exports = {
+  singleQuote: true,
+  semi: true,
+  trailingComma: 'es5',
+  tabWidth: 2,
+  printWidth: 100,
+  endOfLine: 'lf'
+};

src/components/Hero.tsx

@@ -0,0 +1,13 @@
+/**
+ * @file Hero component highlighting the primary call to action.
+ */
+import styles from '@/styles/Home.module.css';
+
+export const Hero = () => {
+  return (
+    <section className={styles.hero}>
+      <h1>Welcome to the Next.js TypeScript Starter</h1>
+      <p>Build delightful interfaces faster with a well-structured foundation.</p>
+    </section>
+  );
+};

src/components/Layout.tsx

@@ -0,0 +1,20 @@
+/**
+ * @file Layout component providing consistent page chrome.
+ */
+import { PropsWithChildren } from 'react';
+
+import styles from '@/styles/Home.module.css';
+
+export const Layout = ({ children }: PropsWithChildren) => {
+  return (
+    <div className={styles.container}>
+      <header className={styles.header}>
+        <span className={styles.brand}>Next TypeScript Starter</span>
+      </header>
+      <main className={styles.main}>{children}</main>
+      <footer className={styles.footer}>
+        Crafted with Next.js • {new Date().getFullYear()}
+      </footer>
+    </div>
+  );
+};

src/pages/_app.tsx

@@ -0,0 +1,12 @@
+/**
+ * @file Custom Next.js App component responsible for global setup.
+ */
+import type { AppProps } from 'next/app';
+
+import '@/styles/globals.css';
+
+const App = ({ Component, pageProps }: AppProps) => {
+  return <Component {...pageProps} />;
+};
+
+export default App;

src/pages/index.tsx

@@ -0,0 +1,24 @@
+/**
+ * @file Landing page showcasing the initial project structure.
+ */
+import Head from 'next/head';
+
+import { Hero } from '@/components/Hero';
+import { Layout } from '@/components/Layout';
+
+const HomePage = () => {
+  return (
+    <Layout>
+      <Head>
+        <title>Next.js TypeScript Starter</title>
+        <meta
+          name="description"
+          content="Kick-start your Next.js project with opinionated tooling."
+        />
+      </Head>
+      <Hero />
+    </Layout>
+  );
+};
+
+export default HomePage;

src/styles/Home.module.css

@@ -0,0 +1,53 @@
+/*
+ * @file Module CSS providing styles for the landing page layout.
+ */
+.container {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 2rem;
+  gap: 2rem;
+}
+
+.header {
+  font-size: 1.5rem;
+  font-weight: 600;
+  letter-spacing: 0.05em;
+}
+
+.brand {
+  color: #38bdf8;
+}
+
+.main {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  gap: 1.5rem;
+  max-width: 48rem;
+}
+
+.hero {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.hero h1 {
+  font-size: clamp(2.5rem, 5vw, 3.5rem);
+}
+
+.hero p {
+  font-size: 1.25rem;
+  color: #cbd5f5;
+}
+
+.footer {
+  font-size: 0.9rem;
+  color: #94a3b8;
+}

src/styles/globals.css

@@ -0,0 +1,26 @@
+/*
+ * @file Global CSS resets and theme variables.
+ */
+:root {
+  color-scheme: light dark;
+  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  background-color: #0f172a;
+  color: #e2e8f0;
+}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html,
+body,
+#__next {
+  height: 100%;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}

tsconfig.json

@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": false,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/components/*": ["src/components/*"],
+      "@/styles/*": ["src/styles/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}