CBWIRE Examples is an interactive demonstration application showcasing the full capabilities of CBWIRE, a modern reactive component framework for ColdBox applications. This repository provides hands-on examples that illustrate best practices and patterns for building dynamic, reactive user interfaces in CFML.
Whether you're new to CBWIRE or looking to master advanced techniques, these examples provide practical, real-world implementations you can learn from and adapt for your own projects.
This application demonstrates:
- Data Properties - Managing component state and data
- Passing Parameters - Component initialization and parameter handling
- Actions - Event handling and method invocation
- Computed Properties - Dynamic data derivation
- Data Binding - Two-way data synchronization
- JavaScript Listeners - Integration with JavaScript events
- Query String - URL state management
- Redirect - Navigation and routing patterns
- Text Input - Single-line text handling
- Checkbox Input - Boolean and array selections
- Radio Input - Exclusive option selection
- Select Input - Dropdown menus
- Multiselect Input - Multiple value selection
- Submit Button - Form submission handling
- Validation - Client and server-side validation patterns
- File Upload - File handling and uploads
- Modal - Dynamic modal dialogs
- wire:model - Data binding directive
- wire:click - Click event handling
- wire:keydown - Keyboard event handling
- wire:loading - Loading state management
- wire:dirty - Change detection
- wire:poll - Automatic polling
- wire:init - Component initialization
- Magic Actions - Special action modifiers
- S3 Dropdown - Cloud storage integration
- Parse URI - URL parsing and manipulation
- Nested Wires - Component composition
- Headless CBWIRE - API-first patterns
- Poll with Long Running Process - Async operation handling
- Alpine x-data - Combining CBWIRE with Alpine.js
- CommandBox 6.1 or higher
- Modern web browser (Chrome, Firefox, Safari, Edge)
-
Clone the repository
git clone git@github.com:grantcopley/cbwire-examples.git cd cbwire-examples -
Install dependencies
box install
-
Start the server
box server start --open
Your browser will automatically open to the application homepage once the server completes startup.
You can also use HTTPS for cloning:
git clone https://github.com/grantcopley/cbwire-examples.gitcbwire-examples/
├── config/ # Application configuration
├── handlers/ # ColdBox event handlers
├── layouts/ # Application layouts
├── models/ # Business logic and services
├── views/ # View templates
├── wires/ # CBWIRE component examples
├── tests/ # Test specifications
└── box.json # Dependency management
We recommend exploring the examples in the following order:
- Start with Getting Started examples to understand core concepts
- Progress to Forms to learn input handling and validation
- Explore Template Directives for advanced UI patterns
- Study Advanced examples for complex scenarios
- Review Alpine Integration for hybrid approaches
Contributions are welcome! If you'd like to add new examples or improve existing ones:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-example) - Commit your changes (
git commit -m 'Add amazing example') - Push to the branch (
git push origin feature/amazing-example) - Open a Pull Request
For comprehensive CBWIRE documentation, visit:
- Official Docs: cbwire.ortusbooks.com
- GitHub Repository: coldbox-modules/cbwire
- ColdBox Platform: coldbox.org
Found a bug or have a question?
- Report Issues: GitHub Issues
- ColdBox Slack: Join the #cbwire channel
- Forums: Ortus Community Forums
This project is licensed under the Apache License 2.0. See the LICENSE file for details.
- Ortus Solutions - For creating and maintaining CBWIRE and the ColdBox Platform
- The ColdBox Community - For continuous feedback and contributions
- Livewire - For inspiring reactive component patterns in web development