I bought a new laptop, so I need to install everything. In this video I’m taking you along the installation of Laravel Valet.
Tired of the localhost setup like MAMP, WAMP or XAMP?
Tired of the configuration, ‘etc/hosts’, and stuff like that.
We’ve been experimenting with Laravel Valet for the last months now and decided not to go back.
Its super easy, fast and reliable.
Before you start, make sure no other service is using port 80.
We’ll get started with installing Homebrew, the latest version of PHP (7.4 at this moment) and Composer
– You can update your Homebrew with “brew update”
– Installing the latest version of PHP using Homebrew : “brew install php”
We’re going to install Valet globally to our machine so we’ll use the following command.
composer global require laravel/valet
Once installed we can run valet install…
We need to attach Valet to an directory where we’ll keep our projects.
When navigated to the directory of your choice we can initiate this directory as the Valet directory by using the Park Command.
valet park
Once run, we can create new application projects in this directory.
The directory name of the project will also be the url for Valet. So for example is I have a directory called “pizzawebsite” I can use the URL http://pizzawebsite.test it’s as easy as that…
It’s even possible to share a project with your team of client.
Thanks to the valet share command a publicly accessible url will be created using Ngrok.
For those of thought Laravel Valet is only for Laravel projects… Nope !
It can be used for Laravel, Lumen, October CMS, Drupal, Craft CMS, Magento, WordPress and many more.
Here’s an overview of what you could use while developing a project with Laravel.
In order to create controllers, models, migrations, … we can use artisan.
php artisan make:controller MyController
When we want artisan to provide a controller with the “resource functions” (index, create, store, show, edit, update, destroy) predefined for us, we can simply add “–resource” to our command to provide these functions out of the box.
php artisan make:controller MyController --resource
php artisan make:model
If you want artisan to provide a migration file related to our newly created model, you can just add “-m” to the command. Which gives us something like this:
php artisan make:model -m
We’re also able to create our own migration file, for example is we want to add field to an existing table or create a pivot table, or …
php artisan make:migration the_name_of_your_migration
Just like the migration file that artisan provided for us when we used -m on the creation of a model, the migration file will be added to the /database/migrations folder.
In order to get our migration file(s) migrated into the database, we need to tell artisan to migrate them. Like so:
php artisan migrate
Be aware that once a migration file has been migrated to the database, all changes to the file afterwards will be discarded. We’ll need to create a new migration file in order to add additional changes / migrations. In the database you can see the hierarchy of the migrations in the table “migrations”.
This year I’ve started working with some new tools, two of them are Grunt and Sass. Grunt is a commandline JavaScript Task Runner, and Sass is a Css preprocessor allowing you to write more powerful css, with the use of variables, mixins/functions and nesting!
First of all you’ll need to install a few things. Ruby to get Sass, and NodeJs to get npm, so we can work with Grunt.
Step one: installing Grunt. If you have NodeJs installed properly you simply run:
npm install -g grunt-cli
This will install Grunt globally. So you can use it wherever you want.
Now we need to create the “package.json” file there are several ways to do this. But I prefer to create a new file and input this.
{ "name": "Project Name", "version": "0.0.1", "devDependencies": { //installed packages } }
And then save it as “package.json” in the root of my project.
After that we need to install our Dependencies. This can be done by running the following command. npm install <package> --save-dev
I want to use Grunt to compile my Sass when I save my project. To do this I need to install 2 dependencies.
grunt-contrib-sass: It is used to actually compile your scss files to css.
grunt-contrib-watch: It watches our folders for file changes.
Example npm install grunt-contrib-sass --save-dev
Now my “package.json” looks like this:
"devDependencies": { "grunt": "~0.4.1", "grunt-contrib-sass": "~0.3.0", "grunt-contrib-watch": "~0.4.4" }
Next is our “Gruntfile.js”. This file contains the tasks that grunt needs to do for you.
This is how my Gruntfile looks like:
module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), sass: { dist: { files: { 'style/style.css' : 'sass/style.scss' } } }, watch: { css: { files: '**/*.scss', tasks: ['sass'] } } }); grunt.loadNpmTasks('grunt-contrib-sass'); grunt.loadNpmTasks('grunt-contrib-watch'); grunt.registerTask('default',['watch']); }
This file starts with a wrapper function and we pass in grunt
so that we can access it..
Adding tasks with : grunt.loadNpmTasks('*Name of the task*')
.
Register Tasks with : grunt.registerTask('default',['*tasks to run*']);
, the 'default'
task is what gets running when you type grunt
in the commandline.
When working on your project, just run the grunt
command in your commandline in your project folder.
Hit ctrl+c to quit grunt when you’re done.