So my basic approach is:
1. Create the project folder
2. Initialize everything using a template scaffolding system (vite, nextjs, etc.)
3. Create a simple README.md which contains a list of the desired tech stack (for reinforcement purposes) and goal of the project.
4. Start up Claude
5. Use the `/init` command which creates the vanilla CLAUDE.md file
Interestingly, Claude captures all the NPM commands from the package json into the instructional file but the issue with this is that in my particular test case it kept trying to run `npm run dev` which spins up the app itself. That's... not ideal since I'm running it myself so it can hot-reload and I can see the changes applied immediately. I usually delete that line.
But I should note that I've never used any "agentic coding assistants" before (Aider.chat, Cursor, etc.) - so I'm sort of learning as I go.
One thing I'd be curious about is if there is a "clientside browser" MCP that Claude (or other assistants) can monitor - because ideally you'd really want Claude to be doing the following periodically:
- Taking a screenshot of the browser and using some multimodal system to sanity check
- Monitor the Dev Tools console for errors/warnings/etc.
- Read through the DOM to sanity check
So I have "npm run dev" already running and I could theoretically instruct Claude (or another system) to attach itself to the Chromium/Firefox browser window.
This MCP server seems to be focused on Node/serverside debugging.
1. Create the project folder
2. Initialize everything using a template scaffolding system (vite, nextjs, etc.)
3. Create a simple README.md which contains a list of the desired tech stack (for reinforcement purposes) and goal of the project.
4. Start up Claude
5. Use the `/init` command which creates the vanilla CLAUDE.md file
Interestingly, Claude captures all the NPM commands from the package json into the instructional file but the issue with this is that in my particular test case it kept trying to run `npm run dev` which spins up the app itself. That's... not ideal since I'm running it myself so it can hot-reload and I can see the changes applied immediately. I usually delete that line.
But I should note that I've never used any "agentic coding assistants" before (Aider.chat, Cursor, etc.) - so I'm sort of learning as I go.
One thing I'd be curious about is if there is a "clientside browser" MCP that Claude (or other assistants) can monitor - because ideally you'd really want Claude to be doing the following periodically:
- Taking a screenshot of the browser and using some multimodal system to sanity check
- Monitor the Dev Tools console for errors/warnings/etc.
- Read through the DOM to sanity check
So I have "npm run dev" already running and I could theoretically instruct Claude (or another system) to attach itself to the Chromium/Firefox browser window.
This MCP server seems to be focused on Node/serverside debugging.