FilaFluxKit

https://github.com/jeffersongoncalves/filafluxkitv5
Admin
FilaFluxKit is a starter kit built on Laravel and Filament that provides a multi-panel architecture...
Tokens:4,344
Snippets:52
Trust Score:9.8
License:MIT
Update:1 month ago
Show doc for...
Tokens:
Raw
### Install with FilaFluxKit CLI

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Simplified setup using the FilaFluxKit CLI. Requires the CLI to be installed globally via Composer.

```bash
filafluxkit new my-app --kit=jeffersongoncalves/filafluxkitv5
```

--------------------------------

### Run easy installation script

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Automates installation: installs Composer dependencies, sets up environment, generates app key, sets up database, runs migrations, installs Node dependencies, builds assets, and configures Herd if used.

```bash
php install.php
```

--------------------------------

### Set up environment file (Docker)

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Copies the example environment file to create the .env file.

```bash
cp .env.example .env
```

--------------------------------

### Set up environment and generate app key

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Sets up the environment file by copying the example and generates the application encryption key.

```bash
cp .env.example .env
php artisan key:generate
```

--------------------------------

### Run the development server

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Starts the Laravel development server.

```bash
php artisan serve
```

--------------------------------

### Install filament-flux on a new panel

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Installs filament-flux on a new panel and rebuilds assets. Replace {panel-id} with the actual panel ID.

```bash
php artisan filament-flux:install --panel={panel-id}
pnpm build
```

--------------------------------

### Install JavaScript dependencies

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Installs JavaScript dependencies for the project.

```bash
pnpm install
```

--------------------------------

### Install Composer dependencies

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Installs Composer (PHP) dependencies for the project.

```bash
composer install
```

--------------------------------

### Start Sail containers

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Starts the Laravel Sail containers in detached mode. The development server is handled automatically, so php artisan serve is not needed.

```bash
./vendor/bin/sail up -d
```

--------------------------------

### Register FilamentFluxPlugin with all layers

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Registers the filament-flux plugin on a Filament panel, enabling all three layers: form field replacement, navigation replacement, and atomic Blade component replacement. This is the default setup for the kit.

```php
FilamentFluxPlugin::make()
    ->useEverywhere()       // Form Fields (container bindings)
    ->useFluxNavigation()   // Sidebar + topbar items
    ->useFluxComponents();  // Atomic <x-filament::*> Blade components
```

--------------------------------

### Move into project directory

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Moves into the project directory.

```bash
cd my-app
```

--------------------------------

### Build frontend assets

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Builds frontend assets for production.

```bash
pnpm run build
```

--------------------------------

### Run database migrations

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Runs database migrations after configuring the database in the .env file.

```bash
php artisan migrate
```

--------------------------------

### Configure useFluxNavigation options

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Configures navigation replacement: enables sidebar and topbar, while shell and themeSwitcher are opt-in and disabled by default. The shell is invasive, so enable with caution.

```php
FilamentFluxPlugin::make()->useFluxNavigation([
    'sidebar' => true,
    'topbar' => true,
    'shell' => false,         // outer <flux:sidebar>/<flux:main> shell — invasive, opt-in
    'themeSwitcher' => false, // single <flux:dropdown> theme switcher — opt-in
]);
```

--------------------------------

### Run Development Server with composer dev or Individual Commands

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Commands to run the development server. The first command runs the server with logs, queues, and asset compilation. The second set runs each component separately: the Laravel server, the queue listener with one retry attempt, and the frontend asset compiler.

```bash
composer dev
```

```bash
php artisan serve
php artisan queue:listen --tries=1
pnpm run dev
```

--------------------------------

### Create Laravel app with FilaFluxKit v5

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Creates a new Laravel application using the FilaFluxKit v5 starter kit with MySQL as the database. Requires PHP 8.3 or higher, Composer, Node.js, and PNPM.

```bash
laravel new my-app --using=jeffersongoncalves/filafluxkitv5 --database=mysql
```

--------------------------------

### Import Flux and filament-flux CSS in panel theme

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Imports the required CSS for each panel theme: Filament's theme, Livewire Flux, and filament-flux. These imports are present in the panel provider files listed in the documentation.

```css
@import '../../../../vendor/filament/filament/resources/css/theme.css';
@import '../../../../vendor/livewire/flux/dist/flux.css';
@import '../../../../vendor/jeffersongoncalves/filament-flux/dist/filament-flux.css';
```

--------------------------------

### Configure custom ports for Docker

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Configures custom ports for the application, MySQL, Redis, and Mailpit to avoid conflicts with other services.

```bash
# Application Port (ex: 8080)
APP_PORT=8080

# MySQL Port (ex: 3306)
FORWARD_DB_PORT=3306

# Redis Port (ex: 6379)
FORWARD_REDIS_PORT=6379

# Mailpit Port (ex: 1025)
FORWARD_MAILPIT_PORT=1025
```

--------------------------------

### Configure filament-flux plugin options

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Configures plugin options: sets a CSS scope class (or null for Flux's native zinc palette), injects appearance and scripts. Use to customize styling and asset injection.

```php
FilamentFluxPlugin::make()
    ->scopeClass('filament-flux-scope')   // CSS scope wrapper; pass null to use Flux's native zinc palette
    ->injectAppearance(true)              // @fluxAppearance in <head> + theme bridge
    ->injectScripts(true);                // @fluxScripts before </body>
```

--------------------------------

### Attach to application container

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Attaches to the application container to run commands inside it.

```bash
./vendor/bin/sail shell
```

--------------------------------

### Generate application key (Docker)

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Generates the application encryption key inside the Sail container.

```bash
php artisan key:generate
```

--------------------------------

### Opt in to Flux Blade component replacement

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Opts in to Flux replacement for specific atomic Blade components. Omit or set false to keep Filament's original view for that component.

```php
FilamentFluxPlugin::make()->useFluxComponents([
    'badge' => true,
    'avatar' => true,
    'icon' => true,
    // omit/false → keep Filament's view
]);
```

--------------------------------

### Opt out of Flux form field replacement

Source: https://github.com/jeffersongoncalves/filafluxkitv5/blob/main/README.md

Opts out of Flux replacement for specific form fields (select and otp) while keeping the rest replaced. Use this to preserve native behavior for those fields.

```php
FilamentFluxPlugin::make()->useEverywhere([
    'select' => false,    // keep native <select>
    'otp' => false,
]);
```
Tokens:
Raw