Build your own Shopify.

# Build an original app inspired by Shopify

You are an experienced product designer and full-stack engineer. Build a working, polished MVP from the brief below. Implement the core journeys end to end; a static mockup is not sufficient. Inspect the current environment, make sensible implementation decisions, and get started. Ask a question only if a missing answer genuinely blocks implementation.

Starting platform: Web. Explicit customized Product & audience and Tech stack requirements take precedence over this starting target.

## Product & audience
Build an original single-merchant commerce app called Shopfront, inspired by Shopify. It is for a small store managing a catalog and orders. The main flow is adding a product, browsing it as a customer, placing it in a cart, and completing a verified test checkout. The MVP is one store and one currency, not a multi-tenant commerce platform.

## Design
Create an original responsive storefront with product cards, variant selection, cart, and a transparent checkout summary. Provide a separate accessible merchant dashboard for products, stock, and orders. Keep shipping, payment state, and demo/test mode clearly visible.

## Features
1. Catalog: create and edit products, descriptions, original images, variant options, SKU, price, and stock. Separate draft and published products and enforce unique SKU rules.

2. Storefront: browse/search published products, open details, select a valid available variant, and add/update/remove cart lines. Recalculate prices server-side before checkout.

3. Checkout: record an address, compute a documented simple shipping rule, and place an order through a real payment provider’s sandbox if configured. Otherwise provide a clearly labeled no-payment order request.

4. Inventory and payments: reserve/decrement stock atomically, expire abandoned holds, verify webhook signatures, and make events idempotent. Do not mark an order paid from a client redirect.

5. Merchant workflow: review order status, mark fulfillment, record tracking text, and manage cancellations in the supported test flow. Provide original demo products and useful empty states.

## Tech stack
Use PHP with Laravel and PostgreSQL for a new backend, plus a TypeScript frontend or Laravel-compatible rendering approach. Use a verified official SDK for a configured test payment provider. Store secrets server-side, separate payment and fulfillment states, and use transactions for stock. If no provider is available, implement the no-payment request flow and document what must be configured for checkout.

## Data & behavior
Merchant; Product; Variant {sku, priceMinorUnits, stock}; ProductImage; Cart; CartLine; InventoryHold; Order {userId, currency, totalsSnapshot, paymentStatus, fulfillmentStatus}; OrderLine; PaymentEvent {providerEventId}; Shipment. Use integer minor units for money and snapshot prices into orders. Do not let clients choose total charges or stock counts.

Acceptance checks and scope:
Test last-item concurrent checkout, stale cart prices, invalid variants, duplicate/out-of-order webhooks, abandoned stock holds, unauthorized catalog edits, and sandbox payment failure. No real payment actions should be required to verify the MVP. Exclude app marketplaces, multi-store tenancy, tax compliance engines, subscriptions, and production payouts.

## Originality and assets
The named product is a reference for general workflows only. Use an original product name, visual identity, wording, layout, and assets. Do not copy proprietary code, branded logos, distinctive screens, private APIs, paid templates, or protected media. Use original or appropriately licensed sample data and assets. Build from this brief rather than scraping the reference service. Do not imply affiliation with the referenced company.

## Implementation quality
- Make every visible control work, with clear loading, success, empty, validation, and failure states. Remove controls for unimplemented features.
- Support the target platform and responsive or resizable layouts where appropriate. Use platform-appropriate accessibility semantics, labels, keyboard operation, visible focus, sufficient contrast, and reduced-motion preferences. Provide alternatives for drag-only interactions.
- Validate inputs at the relevant boundary. Treat imported or user-generated content as untrusted; render it safely. Confirm destructive actions or offer undo.
- Keep state changes reliable across navigation and reloads. Never silently lose edits. Handle persistence and network errors with an actionable message.
- Keep the scope realistic. Prioritize the complete primary journey. If a custom Features section differs from the baseline, update the data model, design, and acceptance checks to match it; explicit custom requirements take precedence over baseline assumptions.
- Provide realistic original sample content and a useful empty state. Keep sample data clearly separate from user-created data.

## Delivery and verification
1. Inspect the repository and outline the implementation in a few sentences.
2. Implement the app and connect its actual data flow. Continue until the primary journey works.
3. Run appropriate checks and test the acceptance cases above on the target platform. Verify responsive layouts and keyboard navigation when browser tools are available. For native projects, build with the available SDK and test an emulator or device when possible; report any missing native verification honestly. For games, verify the rules and gameplay loop, not only the menus.
4. Fix observed failures, then provide the runnable result, setup/run instructions, a brief explanation of what is implemented, and any specific configuration or verification limits.

This is a focused MVP. Do not add billing, AI services, or unrelated features unless explicitly requested in the brief. Start building now.