senior-frontend

Run the frontend_scaffolder.py script with your project name and the nextjs template flag. It generates the App Router structure, UI components, hooks, Tailwind config, and package.json, with optional features like auth, api, forms, testing, and storybook.

Use component_generator.py with the component name and the --with-test and --with-story flags. It creates a TypeScript component file, a Testing Library test file, a Storybook story, and an index export in the specified output directory.

Replace moment (290KB) with date-fns (12KB) or dayjs (2KB), and replace lodash with lodash-es using tree-shaking or individual imports. The bundle analyzer script detects these heavy packages and prints the recommended alternatives automatically.

Use Server Components by default for data fetching and non-interactive content. Add 'use client' only when you need event handlers, useState, useEffect, or browser APIs, keeping client JavaScript minimal for better performance.

Yes, the analyzer works with any project containing a valid package.json, including React + Vite apps. Next.js-specific config checks are skipped gracefully when no next.config file is found, though a missing config slightly lowers the health score.