Laravel Preset

Theme by Tailwindcomponents

|

Updated: 18 Jan 2021

|

51 Stars

Laravel preset starter UI for laravel with Tailwind CSS.

Categories

Overview

This Laravel preset for TailwindCSS is a front-end scaffolding tool that allows for rapid UI development using the popular Utility-First CSS Framework. It provides two options for preset installation, one with authentication and one without, and includes basic user tables. The package is compatible with Laravel 7.0 or higher.

Features

• Laravel and Tailwind CSS Integration: Integrates the Tailwind CSS framework seamlessly with Laravel for efficient UI development.
• Two Preset Options: Allows users to choose between a preset with authentication and one without, providing flexibility for different project requirements.
• Database Configuration: Supports various databases (e.g., mysql, sqlite) and provides options to easily configure the desired database.
• Screenshots: Provides screenshots of the preset’s dashboard, login, register, reset password, and verify pages for reference.

Installation

To install this Laravel preset for TailwindCSS, follow these steps:

1. Freshly install Laravel and navigate to your app’s directory.

2. Install the package using composer: composer require tailwindcomponents/laravel-preset --dev.

3. Preset WITHOUT Authentication

   • To install the basic Tailwind CSS preset, run the command: php artisan ui tailwindcss.
   • Install the necessary npm packages: npm install && npm run dev.
   • Run the Laravel server: php artisan serve (or equivalent) to test the preset.

4. Preset WITH Authentication

   • To install the basic preset with authentication, run the command: php artisan ui tailwindcss --auth.
   • Install the necessary npm packages: npm install && npm run dev.
   • Configure your preferred database (e.g., mysql, sqlite).
   • Migrate the basic user tables: php artisan migrate.
   • Run the Laravel server: php artisan serve (or equivalent) to test the preset.
   • Note: If you run the authentication command multiple times, clean up duplicate Auth entries in routes/web.php.

5. Configuration

   • The package includes a default tailwind.config.js file that uses the config from the Tailwind vendor files.
   • To make changes to the configuration, remove the existing file and run node_modules/.bin/tailwind init to generate a fresh configuration file.
   • Modify the configuration file according to your requirements.

Summary

This Laravel preset for TailwindCSS offers seamless integration of the Utility-First CSS Framework with Laravel, facilitating rapid UI development. With options for preset installation with or without authentication, and support for various databases, it provides flexibility for different project needs. Additionally, the included screenshots provide a visual reference for the preset’s pages.