docs/tutorials/ask-for-react-(vite)

Beginner6 min

Ask for React (Vite)

Start the app, run tests, and add a component. You run the printed command in the project folder.

What you will do

Simulated CLI sessions for a Vite + React app. Recall does not start the dev server. You copy the printed command into the repo root.

01Start the app

simulated — nothing here is executed.

$ recall "start the react app" npm run dev Starts the Vite dev server for this package.json. Open the URL it prints. shell: zsh risk: SAFE source: recall agent ai left this month: 19 alt npx vite alt yarn dev Ask mode does not run commands. Copy or save this yourself. ? Save this command? No

you run this in the project

cd my-appnpm run dev VITE v6 ready http://localhost:5173

02Tests in watch mode

simulated — nothing here is executed.

$ recall "run react tests in watch mode" npm test -- --watch Runs the test script and keeps watching files. Stop with Ctrl+C. shell: zsh risk: SAFE source: recall agent ai left this month: 18 Ask mode does not run commands. Copy or save this yourself. ? Save this command? No

03Scaffold a component

simulated — nothing here is executed.

$ recall "add a new react function component file called UserCard" mkdir -p src/components && touch src/components/UserCard.tsx Creates an empty UserCard.tsx. Open it in your editor and add the component. shell: zsh risk: SAFE source: recall agent ai left this month: 17 Ask mode does not run commands. Copy or save this yourself. ? Save this command? No

This is a suggestion, not an automatic file write. Paste only if you want that file. Prefer your own editor for real components.

04Save start as a vault command

simulated — nothing here is executed.

$ recall "start the react app" npm run dev Starts the Vite dev server for this package.json. shell: zsh risk: SAFE source: recall agent ai left this month: 17 Ask mode does not run commands. Copy or save this yourself. ? Save this command? Yes? Name (optional): react-dev? Tags (optional): react,dev Saved as "react-dev" [react,dev].

Later, recall run react-dev executes the saved command. Ask itself still never runs it.

// what's next

→ Same flow for a Next.js + pnpm app → Git Asks: log, stash, undo