Laravel Bootstrap Components

Easily use Bootstrap components as Laravel components

Olav van Schie
Appstract
2 min readJun 19, 2017

--

Bootstrap is a very popular front-end framework. A lot of developers use it to quickly create interfaces for their Laravel App, so do we at Appstract. While it makes a lot of tasks easier, it also requires a lot of HTML code to use the default components (like alerts and modals) which can make your template files look messy.

Luckily, things are getting better. Laravel 5.4 adds support for components and slots, the perfect solution to use in combination with Bootstrap components. So we went at it and wrapped up most of the components in a Laravel package.

Introducing Laravel Bootstrap Components

The package (Laravel 5.4+) makes it easy to use and reuse Bootstrap’s components in your blade files.

To give an example, this is what a Bootstrap 4 modal looks like in HTML:

This is the same modal with the included component:

I think the example speaks for itself :)

Installation

Head over to the repository on Github and follow the installation instructions.

Customization

You can modify the basic attributes of the components, like classes, id’s and custom options. For further customization, you can publish the components to your own views folder, and modify the HTML of each component to your desire.

We hope this package will be a joy to use. If you think there is something missing in the package, please help us by creating a pull request on Github!

← more stories in Appstract

--

--

Olav van Schie
Appstract

Web developer. OSS @TeamAppstract, creator of @ReleaseWork