In this article I’ll show you how to develop locally a new Laravel app using Laragon.
In the far 2017 I wrote an article about how to setup Laravel Homestead: the process is not as quick and easy as you can wish but following each step you can end up with a working development environment for Laravel. At that time, Laragon was already 2 years old but I never heard anything about it. And other 2 years should go by before I see the Laragon light.
As you can read in Laragon repo,
Laragon is a portable, isolated, fast & powerful universal development environment for PHP, Node.js, Python, Java, Go, Ruby.
In just a few clicks it will install in your Windows* machine everything you need to develop web applications in your local environment: Apache, Nginx, MySql and more (for a full detailed list refer to Laragon page, please). In other words, just forget WAMP, XAMPP or any other tool you’ve used till now: Laragon is incredibly fast and offers a range of tools and features that let you focus on develop your apps, doing all the dirty work for you. And you’ll can access it using a pretty url like your-app-name.test not the horrible localhost/your-app-name.
Unfortunately, Laragon is available only on Windows. if you use a Linux box and you wish to take a look at this wonderful tool, you can use one of these packages to run Windows software on Linux
One of the features I love more is the Quick app command: with just a click you can get your new application up and running, ready to be developed by you. Today, I want to show how easy it can be start a new Laravel application using Laragon, and how to add Bootstrap to it.
Step 1: install Laragon
Go to Laragon download page, download the last version then just run the installer: Next, Next, Next…
Laragon starts instantly and I recommend to set it up to run when Windows starts.
Step 2: create a Laravel application
Just a right click on the Laragon window or on the Laragon tray icon to open a rich menu: just click on Quick app->Laravel, type the name of your new application (in this article I’ll use “laraone”) and let Laragon work for you.
A command prompt will be open and you’ll see the process going on. If you have installed Laragon with the defaults, a new folder with your app name will be created in C:\laragon\www directory and everything will be installed there.
When the process is completed you should see something like this in your command prompt:
***** NOTE: Now, you can use pretty url for your awesome project :) *****
(Laragon) Project path: C:/laragon/www/test
(Laragon) Pretty url: http://test.test
Sometimes, in Windows the command prompt seems to stuck, with a blinking cursor in a black desert: if this is the case click on the Laravel tray icon and this should just fix the issue. Otherwise reload Laragon.
If you go to C:\laragon\etc\apache2\sites-enabled folder, you will see that Laragon has created a new configuration file called auto.laraone.test.conf. In this file is defined the Virtual Host for your new application. You can take a look just to see how Laragon works.
Step 2: install node_modules
Now Laravel is already installed and ready to start but I want to use Bootstrap and to install it I need to install npm first.
The Windows command prompt should already be in your new application directory: if this is not the case, move there manually or just open a new command prompt in C:\laragon\www\laraone directory and type
npm install --no-bin-links
This installs node_modules in your application
Step 3: fix package.json
Now we have to correctly set the path to cross-env.js in package.json file.
Open the file package.json and replace the constant “cross-env” with the actual path to cross-env.js: in my last installation cross-env.js was located in node_modules/cross-enc/src/bin.
The final result should look like:
"dev": "npm run development",
"development": "node node_modules/cross-env/src/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "node node_modules/cross-env/src/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "node node_modules/cross-env/src/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
Step 4: installing Bootstrap
To install Bootstrap we just need to type some more commands in the command prompt:
a) composer require laravel/ui : it can takes some time
b) php artisan ui bootstrap : this will actually install bootstrap
c) as required, run npm install && npm run dev
That’s all! Now Bootstrap is installed and all its stuff is in C:\laragon\www\laraone\resources\sass\app.scss and in C:\laragon\www\laraone\public\css\app.css.
Reload Laragon once ore time and type laraone.test in your browser.
Ready to go to write your code!
More about Laragon and its magic in a next article. Because this is important to notice: Laragon is not only Laravel: WordPress, Joomla, Drupal, PrestaSHop, CakePhp… And it’s not only about Php, not only about MySql, not only about… Okay, in a next article 🙂