This directory contains the OpenCodeReview landing page, built with TypeScript, React, Webpack, and Tailwind CSS.
- Node.js
>=18(recommended: latest LTS) npm(comes with Node.js) orpnpm
From the pages/ directory:
npm installOr with pnpm:
pnpm installnpx webpack serveEquivalent npm script:
npm run devDefault dev server settings (from webpack.config.js):
- URL:
http://localhost:3030 - Host:
0.0.0.0 - Port:
3030
npx webpackProject script (recommended, sets production mode):
npm run buildBuild output is generated in pages/dist/.
npm run typecheckpages/
├── src/ # React + TypeScript source code
│ ├── components/ # Reusable UI components
│ ├── pages/ # Route-level page components
│ ├── i18n/ # Localization resources and i18n context
│ ├── styles/ # Global styles (Tailwind entry, custom CSS)
│ └── index.tsx # Frontend entry point
├── dist/ # Production build artifacts (generated)
├── index.html # HTML template used by HtmlWebpackPlugin
├── webpack.config.js # Bundling + dev server config
├── tailwind.config.js # Tailwind theme/content configuration
├── postcss.config.js # PostCSS pipeline (Tailwind + Autoprefixer)
├── tsconfig.json # TypeScript compiler options
└── package.json # Dependencies and scripts
Any PR that changes files in pages/ must include before/after screenshots of affected views in the PR description.
Please include:
- What page/section changed
- Before screenshot
- After screenshot
- Desktop or mobile context (if responsive behavior changed)
- Follow existing TypeScript + React style in this directory.
- Keep components focused and readable; prefer splitting large JSX blocks into smaller components.
- Prefer utility-first Tailwind classes and reuse existing design tokens from
tailwind.config.js. - Keep imports and file naming consistent with surrounding code.
- Run
npm run typecheckbefore opening a PR.
- Tailwind config is in
tailwind.config.js. - Content scanning targets:
./src/**/*.{ts,tsx}./index.html
- PostCSS integration is configured in
postcss.config.jswith:tailwindcssautoprefixer
- TypeScript config is in
tsconfig.json. - Important defaults:
strict: truejsx: react-jsxtarget: ES2020noEmit: true(Webpack handles output)
- Dependencies installed and project runs locally
-
npm run typecheckpasses -
npm run buildsucceeds - Before/after screenshots added to PR
- Scope is limited to one logical change