COG-GTM · vibhaseshadri-cognition · Aug 5, 2026 · Aug 6, 2026 · Aug 6, 2026
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -0,0 +1,25 @@
+name: CI
+
+on:
+    push:
+        branches: [master]
+    pull_request:
+
+jobs:
+    web:
+        name: Lint, test and build the React app
+        runs-on: ubuntu-latest
+        defaults:
+            run:
+                working-directory: web
+        steps:
+            - uses: actions/checkout@v4
+            - uses: actions/setup-node@v4
+              with:
+                  node-version: 20
+                  cache: npm
+                  cache-dependency-path: web/package-lock.json
+            - run: npm ci
+            - run: npm run lint
+            - run: npm test
+            - run: npm run build
diff --git a/README.md b/README.md
@@ -19,6 +19,22 @@
 
 ---
 
+## React migration (in progress)
+
+The app is being migrated from Angular to React 18 + TypeScript + Vite. The React app lives in [`web/`](/web) while the
+Angular app in `src/` stays buildable until parity is reached.
+
+```bash
+cd web
+npm ci
+npm run dev     # dev server on http://localhost:5173
+npm run lint
+npm test
+npm run build
+```
+
+---
+
 :zap: **Fast:** Service Worker App Shell + Dynamic Content model to achieve faster load times with and without a network.
 
 :iphone: **Responsive:** Completely responsive UI that can be installed to your mobile home screen to provide a native feel.

diff --git a/web/.gitignore b/web/.gitignore
@@ -0,0 +1,5 @@
+node_modules
+dist
+dev-dist
+coverage
+*.local
diff --git a/web/eslint.config.js b/web/eslint.config.js
@@ -0,0 +1,37 @@
+import js from '@eslint/js';
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+import react from 'eslint-plugin-react';
+import reactHooks from 'eslint-plugin-react-hooks';
+import reactRefresh from 'eslint-plugin-react-refresh';
+import prettier from 'eslint-config-prettier';
+
+export default tseslint.config(
+    { ignores: ['dist', 'coverage', 'dev-dist'] },
+    {
+        extends: [js.configs.recommended, ...tseslint.configs.recommended, prettier],
+        files: ['**/*.{ts,tsx}'],
+        languageOptions: {
+            ecmaVersion: 2020,
+            globals: { ...globals.browser, ...globals.node },
+        },
+        settings: {
+            react: { version: 'detect' },
+        },
+        plugins: {
+            react,
+            'react-hooks': reactHooks,
+            'react-refresh': reactRefresh,
+        },
+        rules: {
+            ...reactHooks.configs.recommended.rules,
+            '@typescript-eslint/no-unused-vars': [
+                'error',
+                { argsIgnorePattern: '^_', varsIgnorePattern: '^_', caughtErrorsIgnorePattern: '^_' },
+            ],
+            'react/jsx-uses-react': 'off',
+            'react/react-in-jsx-scope': 'off',
+            'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
+        },
+    }
+);
diff --git a/web/index.html b/web/index.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <title>Angular 2 HN</title>
+        <meta name="description" content="A Hacker News client built with React, TypeScript and Vite" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <meta name="theme-color" content="#b92b27" />
+        <link rel="icon" type="image/x-icon" href="/favicon.ico" />
+    </head>
+    <body>
+        <div id="skip"><a href="#content">skip to navigation</a></div>
+        <div id="root"></div>
+        <script type="module" src="/src/main.tsx"></script>
+    </body>
+</html>