[How-to] Configure A New Laravel Project (With Tailwind CSS)
Tags: laravel5, laravel, tutorial, tailwindcss
Published: 2018-02-21 07:31:17

---
title: "[How-to] Configure A New Laravel Project (With Tailwind CSS)"
published: true
tags: laravel-5,laravel,tutorial,tailwind-css
canonical_url: 
---

Recently, I have been working on few laravel projects and every time I configure new project, I end up making a critical error by either missing/forgetting some important steps. No doubt, [Laravel documentation](https://laravel.com/docs/5.5/installation) is excellent and does a great a job in installing/setting up the laravel, but there still are several things that needs to be configured before we can really start working. So I came up with this checklist that serves as a ready reckoner to setup and configure a new laravel project.

Create a new laravel project using the [laravel installer](https://laravel.com/docs/5.5/installation#installing-laravel) by running the below command:

```
composer create-project --prefer-dist laravel/laravel <project-name> "5.5.*"
```

Create a MySQL database from command line:

```
mysql -u<mysql-username> -p create database <project-database-name>;
```

Out-of-the-box, Laravel provides us with an .env file to configure our project. Let's update that file with the above database credentials.

```
DB_DATABASE=<project-database-name>

DB_USERNAME=<mysql-username>

DB_PASSWORD=<mysql-password>
```

In 99% of my projects, I use out-of-the-box authentication. Make sure, you are in the projects root directory and execute the below command. If you don’t need out-of-the-box authentication, you can feel skip this step.

```
php artisan make:auth
```

Once the above step is performed, you can run the migration and create the authentication tables.

```
php artisan migrate
```

Install the JS packages by running the below command from the projects root directory

```
npm install
```

Install other dependencies that are required before starting the development. In my recent projects, I have been using [Tailwind CSS](https://tailwindcss.com/docs/what-is-tailwind) and hence would be adding that as an initial dependency.  
Install the tailwindcss package:

```
npm install tailwindcss --save-dev
```

Run below command to generate the config file

```
./node_modules/.bin/tailwind init
```

I prefer using sass, so update the app.sass file with below (in same order):

```
@tailwind preflight
@tailwind utilities
```

Add below line on top of webpack.mix.js

```
let tailwindcss = require('tailwindcss');
```

And lastly, replace the sass() code with below:

```
.sass('resources/assets/sass/app.sass', 'public/css').options({ 
    processCssUrls: false, postCss:[tailwindcss(‘./tailwind.js')], 
});
```

Yay! We are ready to start coding. Run the below command from the projects root directory to start the PHP’s built-in server and start development.

```
php artisan serve
```

**That’s it.** I hope this checklist helps to configure a new laravel project in minutes, and thereby avoid any obvious mistakes that takes away the productive time from actual development.

Happy Coding! :)

_Originally published at_ [_milanchheda.com_](https://milanchheda.com/how-to-configure-a-new-laravel-project) _on February 9, 2018._