Recipes Overview

Real-world, production-ready examples showing Aurelia templates in action. Each recipe is a complete, working example demonstrating multiple templating features working together.

Available Recipes

E-Commerce & Shopping

• Product Catalog with Search & Filters - Search, filter, sort products with real-time updates

• Shopping Cart - Add/remove items, update quantities, calculate totals

Data Display & Tables

• Data Table with Sorting, Filtering & Pagination - Complete data table with sorting, filtering, pagination, row selection

UI Components

• Notification/Toast System - Global notifications with auto-dismiss, multiple types, and queue management

• Search with Autocomplete - Typeahead search with keyboard navigation and highlighting

How to Use These Recipes

Each recipe includes:

• Complete working code - Copy and paste to get started

• Feature breakdown - What templating features are being used

• Variations - Common modifications and extensions

• Related patterns - Links to similar recipes

Recipe Template

Looking to contribute a recipe? Follow this structure:

# Recipe Name

Brief description of what this recipe demonstrates.

## Live Demo

[Open in StackBlitz](link-to-stackblitz)

## Features Demonstrated

- Feature 1
- Feature 2
- Feature 3

## Code

### View Model (TypeScript)

[code]

### Template (HTML)

[code]

### Styles (CSS) - Optional

[code]

## How It Works

Step-by-step explanation...

## Variations

- Variation 1: Description and code
- Variation 2: Description and code

## Related

- [Related Recipe](link)
- [Related Docs](link)

Contributing

Have a great real-world example? We'd love to include it! Submit a PR with your recipe following the template above.