SPA with i18n @ Laravel, Filament, Vue, Vite, Pinia.

Laravel backend:

• Full data migrations with seeders and factoriy example (pages, categories, projects, users)
• Filament admin panel with Serenity theme
• Internationalization (i18n) with Spatie Translatable
• Spatie Media
• Spatie Settings
• Spatie Health page
• Imagick instead of GD
• TinyEditor with custom colors

Vue frontend:

• TypeScript
• Vue 3
• Vite for assets build
• Pinia for data store
• ky for fetching data
• Simple SPA with basic routes as example
• Cache/expiration system for api requests

SPA screenshots

About page: Italian locale: Category page: In case you don't like cookies:

Filament screenshots

List: Form: Same about cookies: Global settings page:

Prerequisites

Required requisites:

1. Git
2. Node
3. Any kind of serving app (valet, wamp, xamp, sail, artisan serve)

Installation

1. Clone the project:

git clone https://github.com/volkar/laravel-filament-spa-i18n-vite-vue.git

2. Go to the project's folder

cd laravel-filament-spa-i18n-vite-vue

3. Update and install composer packages

composer update

4. Copy .env.example to .env

cp .env.example .env

5. Generate keys

php artisan key:generate

6. Edit your .env file to setup database connection and site address APP_URL
7. Create database schema & seed it

php artisan migrate:refresh --seed

8. Install all node.js dependencies

npm install

9. Run Vite dev server

npm run dev

10. Serve your Laravel app (valet in example, wamp, xamp, sail or whatever)

valet link mysite

11. Open served address in your browser.

http://mysite.test

Filament's admin account created by seeding:

• login: [email protected]
• pass: admin

Contact me

You always welcome to write me

• E-mail: [email protected]
• Telegram: @sergeyvolkar