← All posts

CYAN PRO anime character scanning a product at a shop counter beside a product-manager infographic.

Build a Small-Shop Product Manager with Claude Code: Start with a Prototype


A small shop often needs simple answers: how much stock remains, which price applies, and what needs replenishment? A focused product manager can bring that information together. Start with a small prototype and verify its data flow before relying on it for daily business.

The official Claude Code overview describes a tool that reads code, edits files, and runs commands across supported environments. Access and account requirements depend on the surface you choose; do not assume unlimited free use.

🧾 1. Define the shop's actual data

A first version might use sku, name, category, price_vnd, stock, and updated_at. Give each variant a unique SKU. Different colors and sizes should not silently share one stock count.

Define valid prices and quantities, required fields, and how discontinued items behave. A catalog manager does not need orders, payments, and accounting in its first iteration.

Use sample records, including accented names, long names, zero-stock items, and intentionally invalid inputs for testing.

🛠️ 2. Write a testable brief

Open the project in your configured Claude Code environment. If a codebase exists, ask the agent to inspect it and respect the existing stack before proposing a major replacement.

Build a product-management web prototype for a small shop.
Scope: one user, sample data, local execution.
Inspect the existing project first; if empty, propose a minimal structure.

Features:
- SKU, name, category, VND price, stock, and update date.
- Add, edit, search, and correctly sort numeric fields.
- Reject duplicate SKUs, negative prices, negative or fractional stock.
- Archive and restore products rather than immediately deleting them.
- Export/import a backup with schema checks and an overwrite preview.
- Mobile layout, labeled fields, useful empty states.

Exclude payments and customer data at this stage.
Explain storage choices and prototype limitations before implementation.
Afterward, run relevant checks and report anything unverified.

Behavior is more useful than a technology shopping list. “Reject duplicate SKUs” can be tested; “make it modern” does not define correctness.

💾 3. Understand browser storage

MDN explains that localStorage belongs to an origin and persists across browser sessions; private-session data is cleared when the final private tab closes. It is not cross-device synchronization or an independent backup.

Local storage can be useful for a demo. However, surviving a refresh is not proof of durable data protection. Provide an export and test restoration. Multiple staff updating shared records require a suitable server-side store, authentication, and permissions.

🧪 4. Test likely failure cases

Test these scenarios:
1. Create a SKU, edit its price, reload, and read the saved value.
2. Attempt a duplicate SKU; reject it without changing existing data.
3. Reject a negative price, fractional stock, and an empty name.
4. Search accented names; sort 9000, 20000, and 100000 numerically.
5. Archive and restore an item.
6. Export a backup, restore in a separate test environment, and compare.
7. Import an invalid schema; report the error without overwriting data.
Report executed results and remaining failures, not just a test plan.

On a phone, check whether the keyboard hides Save, long names break the layout, or validation messages fail to explain the fix.

📤 Name the export format accurately

Call a CSV export CSV. Opening it in Excel does not turn it into a formatted, multi-sheet .xlsx workbook. Specify whether you need a simple list, a presentation-ready report, or a recoverable backup.

🚀 5. Prepare for real use

Decide who may change prices, adjust stock, and approve imports. Concurrent editing needs conflict handling and a change history. Test restoring data, not merely downloading a backup file.

Uploading a demo to hosting does not automatically supply those capabilities. Have an experienced developer review storage, authentication, and deployment before depending on the app for daily operations.

📚 6. Hand over a maintainable tool

Save startup instructions, configuration, backup procedures, and remaining limitations. Create a short staff guide using the customer-documentation workflow. CYAN CAM, currently in beta, can help record an import-and-edit walkthrough.

A small app earns its place through correct data, clear operations, and recovery when something goes wrong. Claude Code accelerates implementation; practical checks establish readiness.

Related posts