feat: Initialize React Infrastructure (Phase 1 Migration)

[devin-ai-integration]

feat: Initialize React Infrastructure (Phase 1 Migration)

Summary

This PR sets up the foundational React infrastructure for migrating Angular2-HN to React while keeping the Angular app fully functional. The React app lives in a new react-app/ directory and includes:

• Vite + React 18 + TypeScript - Modern build tooling with fast HMR
• React Router v6 - Route structure matching Angular's configuration exactly:
  • Root redirect: / → /news/1
  • Feed routes: /news/:page, /newest/:page, /show/:page, /ask/:page, /jobs/:page
  • Lazy-loaded routes: /item/:id, /user/:id
• PWA Support - vite-plugin-pwa with Workbox for service worker and offline support
• Code Quality - ESLint, Prettier, TypeScript strict mode
• Documentation - Comprehensive README with setup instructions

Important: All components are currently placeholders with no HN API integration. This is intentional for Phase 1 - actual functionality will be implemented in subsequent phases.

Review & Testing Checklist for Human

• Compare route structure - Open src/app/app.routes.ts in the Angular app and verify that react-app/src/routes/index.tsx matches it exactly (especially the root redirect and feed type handling)
• Test PWA functionality - Run cd react-app && npm run build && npm run preview, then check if the app is installable and service worker registers correctly in browser DevTools
• Verify production build - Build for production and test all routes work with lazy loading (item and user pages should be in separate chunks)
• Check icon paths - Inspect the generated manifest.webmanifest after building and verify icon paths resolve correctly
• Test parallel setup - Ensure the existing Angular app still runs with npm start from the root directory

Browser Testing Screenshots

I tested all routes in the development server - here are screenshots showing each route working:

Notes

• No CI checks configured - This repository doesn't have CI set up, so automated testing hasn't run
• ESLint 8.x used - Downgraded from 9.x to support .eslintrc.json format (more common in React projects)
• TypeScript 5.9 - Slightly newer than officially supported by typescript-eslint (5.6), but linting passes without issues
• Build artifacts - .tsbuildinfo files are included in the commit (TypeScript incremental build cache)
• Next steps - Phase 2 will implement actual component logic and HN API integration

Link to Devin run: https://app.devin.ai/sessions/2e8a734264e541c080f0e0d7a57a9a25
Requested by: Gabe Smith ([email protected])

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring