What are the steps to set up Jetstream with Svelte

Step 1: Install Jetstream

1. Run the following command in your terminal to install Jetstream:

bash
   composer require laravel/jetstream
   

bash
   php artisan jetstream:install inertia
   

Step 2: Configure Jetstream

1. Configure Jetstream by setting the `JETSTREAM_FRONTEND` environment variable to `svelte` in your `.env` file:

makefile
   JETSTREAM_FRONTEND=svelte
   

Step 3: Set Up Svelte

1. Install Svelte using npm:

bash
   npm install svelte
   

javascript
   import { createInertiaApp } from '@inertiajs/inertia';
   import { resolvePageComponent } from '@inertiajs/view';

   createInertiaApp({
     title: 'My App',
     resolve: (name) => resolvePageComponent(`./Pages/${name}.svelte`, import.meta),
   });
   

Step 4: Create Svelte Pages

1. Create a new directory named `Pages` in the `resources/js` directory.
2. Create a new file named `Dashboard.svelte` in the `Pages` directory:

svelte
   <h1>Welcome to your dashboard!</h1>
   

Step 5: Configure Vite

1. Install Vite using npm:

bash
   npm install vite
   

javascript
   import { defineConfig } from 'vite';
   import { resolve } from 'path';

   export default defineConfig({
     build: {
       outDir: resolve(__dirname, 'public'),
     },
   });
   

Step 6: Run the Application

1. Run the following command to start the development server:

bash
   npm run dev
   

Step 7: Access the Application

1. Open your web browser and navigate to `https://localhost:3000` to access your application.

By following these steps, you can set up Laravel Jetstream with Svelte and create a robust and secure web application.