O'Reilly logo

Bootstrap 4 Site Blueprints by Ian Whitley, David Cochran, Bass Jobsen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a static web server

Now that your tasks to compile your HTML, CSS, and JavaScript code are ready, it's time to show and inspect the result in your browser. Browsersync is a module that keeps your browser in sync when developing your code. Browsersync works by injecting an asynchronous script tag right after the <body> tag during initial request.

To use Browsersync with Gulp no special plugin is required; you can simply require() the module.

First install Browsersync by running the following command:

npm install browser-sync gulp --save-dev

Then create a task in your  Gulpfile.js file which may look like the following:

var browser = require('browser-sync'); var port = process.env.SERVER_PORT || 8080; // Starts a BrowerSync instance gulp.task('server', ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required