---
name: atomic-example-product-detail-page
description: Example decomposition for generating a Product Detail Page with Atomic Bomb and DDD boundaries.
---

# Example: Product Detail Page

User request:

```text
Create a Product Detail Page.
```

## Decomposition

Atoms:

- Heading
- Paragraph
- Image
- Button
- Price

Molecules:

- ProductGallery
- ProductInfo
- PurchaseActions

Organisms:

- ProductHero
- ProductSpecs
- RelatedProducts

Template:

- ProductDetailTemplate

Page:

- ProductDetailPage

Domain:

- Products

## Commands

```shell
npx atomic-bomb --type domain --name Products
npx atomic-bomb --type atom --name Heading,Paragraph,Image,Button,Price
npx atomic-bomb --type molecule --name ProductGallery,ProductInfo,PurchaseActions
npx atomic-bomb --type organism --name ProductHero,ProductSpecs,RelatedProducts
npx atomic-bomb --type template --name ProductDetailTemplate
npx atomic-bomb --type page --name ProductDetailPage
```

## Done Criteria

- Products domain owns product types, services, and validation.
- ProductDetailPage wires domain data into the template.
- ProductHero and ProductSpecs receive typed props.
- No atom fetches or formats domain data directly.