Skip to content

Commit 4743509

Browse files
committed
server driven UI references in the docs 🤔
1 parent 7e37d57 commit 4743509

File tree

2 files changed

+11
-5
lines changed

2 files changed

+11
-5
lines changed

Diff for: docs/01-introduction/01-overview.md

+6-4
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ import Aside from "@components/Aside.astro"
66

77
## Introduction
88

9-
Filament is a meta-framework for Laravel that provides a set of components and conventions to simplify building frontend interfaces using Livewire, Alpine.js, and Tailwind CSS. It's designed to be flexible and extensible, allowing you to use as much or as little of it as needed while customizing it to fit your requirements.
9+
**Filament is a Server-Driven UI (SDUI) framework for Laravel.** It allows you to define user interfaces entirely in PHP using structured configuration objects, rather than traditional templating. Built on top of Livewire, Alpine.js, and Tailwind CSS, Filament empowers you to build full-featured interfaces like admin panels, dashboards, and form-based apps, all without writing custom JavaScript or frontend code.
1010

11-
Thousands of developers choose Filament to add an admin panel interface to their applications. You can implement this regardless of your app's frontend technology stack - it's commonly paired with tools like Inertia.js that integrate Laravel with full frontend frameworks such as Vue.js, React, or Svelte.
11+
SDUI is a proven architecture used by companies like Meta, Airbnb, and Shopify. It moves control of the UI to the server, allowing for faster iteration, greater consistency, and centralized logic. Filament embraces this pattern for web development, letting you define interfaces declaratively using PHP classes that are rendered into HTML by the server.
1212

13-
When building your app's frontend with Blade (whether using Livewire or not), you can enhance your views with framework components to improve development efficiency. For instance, the same form builder and table builder that power our admin panel tool can be installed into a Livewire component. These Livewire components can be inserted into any Blade view or rendered from a route, regardless of whether you're using Livewire elsewhere in your application.
13+
One key distinction to note is the difference between Server-Driven UI (SDUI) and Server-Rendered UI. While both approaches involve rendering content on the server, Server-Rendered UI relies on static templates (like traditional Blade views), where the structure and behavior of the UI are defined upfront in HTML or PHP files. In contrast, SDUI gives the server the power to dynamically generate the UI based on real-time configurations and business logic, allowing for more flexibility and reactivity without needing to modify frontend templates directly.
1414

15-
Beyond admin panels, Filament panels can be used to create various interfaces in your application. You might build a user dashboard for a SaaS application or develop a CRM system for a specific department in your organization. A single Laravel application can host multiple panels, each with its own distinct configuration for branding, navigation, and routing.
15+
Thousands of developers use Filament to add admin panels to their Laravel applications, but it goes far beyond that. You can use Filament to build custom dashboards, user portals, CRMs, or even full applications with multiple panels. It integrates seamlessly with any frontend stack and works especially well alongside tools like Inertia.js, Livewire, and Blade.
16+
17+
If you're already using Blade views in your Laravel app, Filament components can enhance them too. You can drop Livewire components powered by Filament into any Blade view or route, and use the same schema-based builders for forms, tables, and more, all without switching your entire stack.
1618

1719
## Packages
1820

Diff for: packages/schemas/docs/01-overview.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,11 @@ import AutoScreenshot from "@components/AutoScreenshot.astro"
66

77
## Introduction
88

9-
Schemas allow you to build UIs using an array of "component" PHP objects as configuration. They are used throughout Filament to render UI. Filament packages provide you with various components. You can find a full list in the [available components section](#available-components):
9+
Schemas form the foundation of Filament's Server-Driven UI approach. They allow you to build user interfaces declaratively using PHP configuration objects. These configuration objects represent components that define the structure and behavior of your UI, such as forms, tables, or lists. Rather than manually writing HTML or JavaScript, you create these schemas to control what gets rendered on the server, streamlining development and ensuring consistency across your app.
10+
11+
Schemas are used extensively across Filament to render UI elements dynamically. Whether you're defining a form field, the layout of your page, or an action button, the schema object defines both the component's configuration and how it interacts with your data. In essence, schemas are the building blocks of Filament UIs.
12+
13+
Filament packages provide you with various components. You can find a full list in the [available components section](#available-components):
1014

1115
- [Form fields](../forms) accept input from the user, for example, a text input, a select, or a checkbox. They come with integrated validation.
1216
- [Infolist entries](../infolists) are components for rendering "description lists." Entries are key-value UI elements that can present read-only information like text, icons, and images. The data for an infolist can be sourced from anywhere but commonly comes from an individual Eloquent record.

0 commit comments

Comments
 (0)