Introduction to Webpack-Dev-Server
🚀View more development courses and content at https://chriscourses.com/
Webpack-dev-server is a webpack add-on that provides a few useful features such as live reloading. Essentially each time a change to a file is made, webpack-dev-server will refresh your browser automatically. Not only that, but webpack-dev-server also provides for page updates without a page refresh, a feature called Hot Module Replacement.
Learn how to implement this add-on within your frontend and backend apps to save you time and supercharge your development workflow.
Video Git Repo:
-----------------------------
https://github.com/christopher4lis/ca...
Snippet for Reloading External Stylesheets / CSS:
---------------------------------------------------------------
https://gist.github.com/christopher4l...
Video Timeline:
-----------------------------
00:00 - What is webpack-dev-server and why should we use it?
04:43 - Initial project setup
09:53 - Starting up webpack-dev-server
11:07 - Configuring webpack-dev-server's base directory
12:08 - Adding hot module replacement
15:20 - Hot module replacement for CSS, SCSS, and extracted stylesheets
The Platform:
-------------------------
http://chriscourses.com is a platform in progress whose goal is to educate aspiring and seasoned web developers via story driven learning.
Each course tells a different story, and each milestone reveals a different scene. With an expansive universe to explore, you can track your progress, and gain the necessary skills needed to build your dreams.
For updates on the progress of chriscourses.com and future videos, join the Chris Courses mailing list at http://chriscourses.com.
Chris Courses Social:
-------------------------------------
Twitter: / chriscourses
Facebook: / chriscourses
Christopher Lis Social:
---------------------------------------
Twitter: / christopher4lis
CodePen: http://codepen.io/christopher4lis