Brown Bear Adventure Co.
Commerce and editorial platform for an outdoor brand.
In development. The storefront uses concept merchandise and sample prices. Checkout is closed; the separate commerce services are implemented locally, with provider accounts and production deployment still pending.
Overview.
Brown Bear Adventure Co. is the apparel and outdoor gear brand I’m building around time outside—camping, fishing, family trips, and the everyday clothes that come along. The website brings the shop, journal, films, and brand story into one experience.
The current storefront is a working Nuxt preview with sample merchandise, variant selection, product discovery, and a persistent guest bag. Behind it, a separate C# commerce backend handles catalog revisions, quotes, payment verification, fulfillment recovery, and private order status.
Screens & workflows.
Application screens and development prototypes. Select a capture for a closer look.
Find a product
- Browse curated collections or search product names and tags.
- Filter by product type, available color, and size; sort or paginate through results.
- Open a product and choose an exact color/size combination.
- Use the size guide and availability feedback before adding it to the preview bag.
Manage the preview bag
- Add the selected variant and quantity.
- Review exact variant prices and adjust quantities within availability limits.
- Return in another tab or visit later; browser storage keeps the bag in sync for up to 30 days.
- At checkout, see the current development notice—purchases are not enabled.
Read and explore
- Browse Journal or Films from the shared navigation.
- Search and filter journal entries by category or tag.
- Open a story, move between headings, and explore related content.
- Read concept film notes alongside their imagery; published footage is still to come.
Local development: recover a checkout
- Connect the explicitly enabled local storefront to the current catalog and guest-cart API.
- Review catalog changes, accept the current selections, and request a shipping/manual-tax quote.
- Create or resume a gated test checkout using the original operation identity.
- Reconcile signed payment events and inspect private order status without creating a second fulfillment intent.
Inside the build.
Explore the components, their boundaries, and the decisions behind them.
A static Nuxt storefront and public editorial snapshot sit alongside a separate .NET commerce system. The browser owns presentation and selections; the backend owns catalog authority, immutable quotes, payment adjudication, and provider delivery state. The hosted preview deliberately stays disconnected until the real commerce environment is ready.
Storefront & guest experience
Render product discovery, exact variant pages, editorial content, and an accessible guest bag.
- URL-backed filters, sort, pagination, and variant selections make views shareable.
- The preview bag has bounded quantities, 30-day storage expiry, cross-tab reconciliation, and explicit stale-item recovery.
- The local connected mode is separately enabled; static previews make no commerce API calls.
Design decisions & tradeoffs.
Separate the brand experience from commerce authority
The static storefront can be reviewed and published without a payment processor, supplier account, or running database. Connected commerce is a distinct runtime mode.
The tradeoffTwo execution modes require clear contracts and explicit integration checks, but previews cannot accidentally place real orders.
Freeze the commercial facts at checkout
Catalog revisions, complete quotes, purchase lines, and delivery payloads are immutable snapshots. Revision and generation checks prevent an old selection from silently borrowing a newer price or catalog state.
The tradeoffMore state and validation are required, but retries and later catalog changes have a precise record to reconcile against.
Reconcile uncertain provider outcomes
Durable inbox/outbox records and fenced leases preserve the original intent. After a timeout or crash, the worker looks up the existing provider operation before attempting another send.
The tradeoffSome uncertain operations pause for review instead of immediately retrying; that is preferable to duplicate supplier orders or contradictory payment state.
Publish only the eligible editorial projection
The app imports a generated public snapshot rather than raw authored documents. Drafts, archived entries, private metadata, and ineligible relationships are excluded before rendering or discovery.
The tradeoffPublishing needs a validation/build step, but privacy and release behavior can be tested without relying on every component to filter content correctly.
Technical stack.
Web application
- Nuxt 4
- Vue 3
- TypeScript
Static generation, file-based routes, product discovery, variant selection, guest bag state, and editorial rendering.
Commerce services
- C#
- .NET 10
- ASP.NET Core
Separate Domain, Persistence, Payments, Printful, Notifications, API, and operator-tool modules.
Persistence
- PostgreSQL
- Npgsql
- SQL migrations
Durable guest carts, immutable catalog/quote/purchase records, transactional inbox/outbox, restricted runtime roles, and recovery.
Integration adapters
- Stripe .NET SDK
- Printful API
- Resend-compatible email delivery
Implemented behind configuration and authority gates; actual merchant/provider accounts are not connected to the preview.
Content & delivery
- JSON Schema
- AJV
- Pages CMS configuration
- Static hosting
Strict authored-content validation and generated public snapshots. CMS installation and production hosting remain launch work.
Verification
- Vitest
- Vue Test Utils
- Playwright
- axe-core
- xUnit
- Docker
- GitHub Actions
Component, contract, accessibility, browser, database concurrency, and synthetic recovery verification.