---
name: blade-views
description: Creating Blade views and server-rendered pages in RSX. Use when building SEO pages, login/auth pages, server-rendered content, working with @rsx_id, @rsx_page_data, or Blade-specific patterns.
---
# RSX Blade Views
**Note**: SPA pages are the preferred standard. Use Blade only for:
- SEO-critical public pages
- Authentication flows (login, password reset)
- Marketing/landing pages
## Basic View Structure
Every Blade view starts with `@rsx_id`:
```blade
@rsx_id('Frontend_Index')
@section('content')
Welcome
@endsection
```
- `@rsx_id('View_Name')` - Required first line, identifies the view
- `rsx_body_class()` - Adds view class for CSS scoping
## View Rules
- **NO inline styles** - Use companion `.scss` files
- **NO inline scripts** - Use companion `.js` files
- **NO inline event handlers** - Use `on_app_ready()` pattern
- **jqhtml components** work fully in Blade (but no slots)
---
## JavaScript for Blade Pages
Unlike SPA actions (which use component lifecycle), Blade pages use static `on_app_ready()`:
```javascript
class My_Page {
static on_app_ready() {
// Guard required - fires for ALL pages in bundle
if (!$('.My_Page').exists()) return;
// Page initialization code
$('.My_Page .btn').on('click', () => {
// Handle click
});
}
}
```
The guard (`if (!$('.My_Page').exists()) return;`) is essential because `on_app_ready()` fires for every page in the bundle.
---
## Passing Data to JavaScript
Use `@rsx_page_data` for data needed by JavaScript:
```blade
@rsx_page_data(['user_id' => $user->id, 'mode' => 'edit', 'config' => $config])
@section('content')
...
@endsection
```
Access in JavaScript:
```javascript
class Editor {
static on_app_ready() {
if (!$('.Editor').exists()) return;
const user_id = window.rsxapp.page_data.user_id;
const mode = window.rsxapp.page_data.mode;
const config = window.rsxapp.page_data.config;
}
}
```
- Use when data doesn't belong in DOM attributes
- Multiple calls merge together
- Available after page load in `window.rsxapp.page_data`
---
## Using jqhtml Components in Blade
jqhtml components work in Blade templates:
```blade
```
**Note**: Blade slots (`@slot`) don't work with jqhtml components. Use component attributes instead.
---
## Controller Pattern for Blade Routes
Use standard #[Route] controllers with Blade templates:
```php
/**
* @auth-exempt Login routes are public
*/
class Login_Controller extends Rsx_Controller_Abstract {
#[Route('/login', methods: ['GET', 'POST'])]
public static function index(Request $request, array $params = []) {
if ($request->is_post()) {
// Handle form submission
}
return rsx_view('Login_Index', ['data' => $data]);
}
}
```
**Key points**:
- GET/POST in same method
- Returns `rsx_view('Template_Name', $data)`
- jqhtml works but not server-rendered for SEO
---
## Converting Blade to SPA
When converting server-rendered Blade pages to SPA actions:
```bash
php artisan rsx:man blade_to_spa
```
The process involves:
1. Creating Action classes with `@route` decorators
2. Converting templates from Blade to jqhtml syntax
3. Moving data loading from controller to `on_load()`
## More Information
Details: `php artisan rsx:man blade`