Laravel: Up and Running

Chapter 5. Frontend Components

Laravel is primarily a PHP framework, but it also has a series of components focused on generating frontend code. Some of these, like pagination and message bags, are PHP helpers that target the frontend, but Laravel also provides a Gulp-based build system called Elixir and some conventions around non-PHP assets.

Since Elixir is at the core of the non-PHP frontend components, let’s start there.

Elixir

Elixir (not to be confused with the functional programming language) is a build tool that provides a simple user interface and a series of conventions on top of Gulp. Elixir’s core feature is simplifying the most common Gulp tasks by means of a cleaner API and a series of naming and application structure conventions.

A Quick Introduction to Gulp

Gulp is a JavaScript tool designed for compiling static assets and coordinating other steps of your build process.

Gulp is similar to Grunt, Rake, or make—it allows you to define an action (called a “task” in Gulp) or series of actions to take every time you build your application. This will commonly include running a CSS preprocessor like Sass or LESS, copying files, concatenating and minifying JavaScript, and much more.

Gulp, and therefore Elixir, is based on the idea of streams. Most tasks will begin by loading some files into the stream buffer, and then the task will apply transformations to the content—preprocess it, minify it, and then maybe save the content to a new file.

At its core, Elixir is just ...