Presentation with GitHub code example of ES6 modules, Webpack, Vue, Vuex, and Hot Module Replacement.

1. HOT MODULE REPLACEMENT
Anze Znidarsic, Flycom d.o.o.

2. WHAT DO WE DO?
more: http://www.flycom.si/software-solutions/

3. WHO USES MODULES?
ES6, COMMONJS,AMD

4. WHO USES WEBPACK?
http://webpack.github.io/

5. HOW DID WE GET HERE?
• Let’s useVueJS
• We have complex app, let’s bring inVuex - state management
• Why do we have Bower? Let’s kick it out and use only NPM
• We should use modules and not global objects. Let’s refactor to
modules
• Let’s replace Gulp with Webpack and NPM scripts only
• Finally we can have proper HMR :)

6. HOT MODULE REPLACEMENT
• HMR exchanges, adds, or removes modules
without a page reload

7. LET’S SEE IT IN PRACTICE
https://github.com/anzeznidarsic/es6-modules-webpack-hmr-
example

8. WHAT ABOUTVUE,VUEX…?

9. LET’S SEE IT IN PRACTICE
https://github.com/anzeznidarsic/es6-webpack-vue-vuex-hmr-
example

10. BUT WE USE LARAVEL, HTTPS,
VAGRANT, ETC.

11. READING
• https://webpack.github.io/docs/webpack-dev-
server.html#hot-module-replacement
• https://medium.com/@rajaraodv/webpack-hot-
module-replacement-hmr-e756a726a07
• http://vuejs.org/guide/
• http://vuex.vuejs.org/en/index.html

12. work related: anze@flycom.si
other: a@anze.com
Thank you
link to slides will be posted on: twitter.com/anzeznidarsic