How to Refresh Your Pages Automatically with Webpack and Browsersync | Part 1 (Static Sites)

March 11th 2017 | 7.0k views

Learn how to utilize webpack and Browsersync to automatically refresh your browser whenever a change is made to one of your files. This episode shows you how to do this for static sites: sites whose content is not generated by a backend language like PHP, Ruby, or Node.js.

For dynamic sites, stay tuned for Part II of the series where we use a proxy server to ensure our backend code is processed, and a Browsersync server to ensure our pages are being refreshed automatically.

Git Repo to Follow Along (make sure you install initial node packages after cloning with `npm install` or `yarn`):

https://github.com/christopher4lis/cc-webpack-browsersync-part-1

BrowserSync plugin for Webpack URL:

https://www.npmjs.com/package/browser-sync-webpack-plugin