Initial template to start your awesome Laravel, Tailwind and Vue projects

Marc Garcia Torrent

Last update: Jul 19, 2022

Related tags

Overview

Features

Laravel 8.*
Tailwind 2.1 Ready and Loaded
- @tailwindcss/typography
- @tailwindcss/forms
- Dark mode ready
- All variants enabled by default
Vue 2, Vuex, Vue-Router, Vue-Axios - Ready
Scss / Sass ready

Usage

🌟 Give a repo Star :)

Just download the latest ZIP release of the repository and init the laravel project

npm install #install npm dependencies

npm run dev #compile assets

composer install #install php dependencies

Assets

resources/
┣ css/
┃ ┗ tailwind.css # Import tailwind classes
┣ js/
┃ ┣ components/
┃ ┃ ┗ App.vue # Default App.vue for initial Vue config
┃ ┣ app.js # Vue init & configuration
┣ scss/
┃ ┗ custom.scss # Custom scss file for your peoject

Webpack Mix configuration

mix
    .js('resources/js/app.js', 'public/js').vue({ version: 2 }) // Vue template
    .postCss('resources/css/tailwind.css', 'public/css', [ // Tailwind css loaded
        require("tailwindcss"),
    ])
    .sass('resources/scss/custom.scss', 'public/css'); // Custom Scss file

Libs Used

License

The Laravel framework is open-sourced software licensed under the MIT license.

Laravel backend Inertia and Vue starter template

Inertia.js - Vue.js ve Laravel Starter Template Yunus Emre Altanay If you want to make a single page application using laravel infrastructure. This re

3 Oct 21, 2021

Laravel 8 + Vue 2 + AdminLTE 3 based Curd Starter template

334 Dec 29, 2022

Textpattern-plugin-template - A template for building plugins for Textpattern CMS.

Plugin template for Textpattern CMS Developer documentation Refer to the Textpattern plugin development documentation, and notably the Plugin template

17 Apr 17, 2022

:computer: :octocat: A hackathon/MVP boilerplate for laravel web applications. Start your hackathons without hassle.

Laravel Hackathon Starter - SUSUMU 進 If you have attended any hackathons in the past, then you know how much time it takes to get a project started: d

1.6k Dec 17, 2022

⚡️ This package provides a wonderful PHP skeleton to start building your next package idea.

This package provides a wonderful PHP Skeleton to start building your next package idea. Requires PHP 8.0+ ⚡️ Create your package using Composer: comp

383 Dec 20, 2022

Start your application with Hamtaro.

Hamtaro framework About Technologies Controllers Components Commands Front-end development Getting Started About Hamtaro is the new web framework for

1 May 12, 2022

Laravel Quick-Start - a boilerplate for Laravel Application with typical packages preinstalled and configured

Laravel Quickstart is a boilerplate for Laravel Application with typical packages preinstalled and configured to extend a full-fledged application. We tried to make it as minimal as possible.

18 Sep 8, 2022

A simple and clean boilerplate to start a new SPA project with authentication and more features from fortify

A simple and clean boilerplate to start a new SPA project with authentication and more features from fortify. Its like the little sister of Jetstream, but as SPA.

11 Dec 30, 2022

Quick Start - Project With Laravel 8.x and AdminLTE 3

Quick Start - Project With Laravel 8.x and AdminLTE 3 (feat. Docker) Cursos de Laravel - PT-BR Step by step Clone this Repository git clone https://gi

3 May 24, 2022

Comments

TailwindCSS doesn't work on Vue pages
I tried to make vue page that integrated with blade. app.blade.php is my main php page then App.vue is my main vue page, Products.vue is my component. Everything works fine, but I can't use the TailwindCSS inside the vue page. Any idea why? I can still use it on the php page as your example.

Products.vue:

<template> <h1 class="pb-2 text-4xl font-extrabold text-left text-transparent sm:text-5xl md:text-7xl md:text-center bg-clip-text bg-gradient-to-r from-blue-500 to-indigo-600"> Laravel Tailwind Boilerplate Vue Ready </h1> </template> <script> export default { } </script> <style> </style>
opened by jerichosiahaya 1