This is a boilerplate project for creating web applications with Svelte and Flowbite. It provides a starting point with the basic setup for integrating Svelte and Flowbite, allowing you to quickly start building beautiful and responsive web interfaces.
- Integration of Svelte with Flowbite for easy and responsive UI development.
- Basic project structure and configuration.
- Development server with hot-reloading for a smooth development experience.
- Production build script for optimizing and bundling your application.
- SvelteKit
- TypeScript
- Flowbite
- Tailwind CSS
- Turso (SQLite)
- Drizzle Kit
Follow these steps to get started with the Svelte Flowbite boilerplate:
- Node.js
- npm
- Drizzle Kit
- Turso (optional)
-
Clone the repository
git clone https://github.com/sky3742/svelte-flowbite-boilerplate.git
-
Navigate into the project directory
cd svelte-flowbite-boilerplate
-
Install the dependencies
npm install
-
Copy the
.env.example
to.env
cp .env.example .env
-
Update the
.env
file with your db connection detailsUpdate the following values in the
.env
file with your db connection details:TURSO_URL=your_turso_url TURSO_AUTH_TOKEN=your_turso_auth_token
-
Start the development server
npm run dev
-
Open your browser and navigate to
http://localhost:5173
to see the application running.
To migrate your database, follow these steps:
-
Generate SQL Migration Files
Run the following command to compare and generate the differences in the model schema into SQL files in the
drizzle
folder:npm run db-generate
-
Run Migration
Once the SQL migration files are generated, run the following command to utilize the built-in
migrate
function fromlibsql/migrator
to migrate the database using the SQL files in thedrizzle
folder:npm run db-migrate
-
Open Database Viewer
To open the database viewer provided by Drizzle Kit, run the following command:
npm run db-studio
-
Verify Migration
After the migration is complete, verify that the migration was successful by checking your database schema and ensuring that your data is intact.
To build the application for production, use the following command:
npm run build
This will create an optimized version of your application in the .svelte-kit/output
directory, ready to be deployed to a web server.
https://svelte-flowbite-boilerplate.pages.dev/
Contributions are welcome! If you have any ideas, suggestions, or improvements, feel free to open an issue or create a pull request.
This project is licensed under the MIT License - see the LICENSE file for details.