JSFoo 2017

In complex front-end web applications, module and dependency management is a challenge often faced during development.

Webpack is a build tool that aims to minimize hassles with automated dependency management.
It puts all of your static assets, including Javascript, images, fonts, and CSS, in a dependency graph
Thus, it provides the ability to create bundles of all modules that will be used in the app and serve them easily.

With features like Hot Module replacement (HMR), the development time can speed up drastically, as it updates individual modules when they are changed without refreshing the page

Configured correctly, the powers of Webpack can make your build process smoother than ever, and manage all your dependencies for you - no matter how large your app gets.

Thus, Webpack can add performance boost to your app by speeding up development time, and reducing efforts for project structure management.

In this session we will:

1. Take a look at various useful features offered by Webpack
2. See its benefits over other build tools like Grunt and Gulp
3. Pitfalls to watch out for
4. Learn how to setup a Webpack with hands-on code
5. Understand how it can impact the web development process

Outline

1. What are build tools?
2. Introduction to Webpack
3. Useful features of Webpack
4. Comparison with other build tools
5. Pitfalls to watch out for
6. Hands-on Code: Setup Webpack
7. Impact on project development process

Requirements

Knowledge of JavaScript
Laptop with Node.js and NPM

Speaker bio

Neha Nivedita is a software developer at NodeXperts, with a penchant for building real-time scalable web app solutions in JavaScript technologies like Node.js, Meteor, React, Angular, MongoDB etc.

When not coding or strategizing business opportunities for NodeXperts, Neha can usually be found slaying dragons, robots, villains etc. and running around doing side-quests in multifarious game universes.

Links

• Blog: http://nodexperts.com/blog/webpack-create-config-file/
• LinkedIn: http://www.linkedin.com/in/neha-nivedita-902392102/
• YouTube: http://www.youtube.com/watch?v=b1V57Sx2wBk (Become a NoSQL Ninja : Introduction to MongoDB)
• StackOverflow: http://stackoverflow.com/users/5002305/ryder
• GitHub: http://github.com/niveditn

Slides

https://docs.google.com/presentation/d/1qsoO5JG8AoYCocdOCezAlyGsyCG44S8TbPiCpek3KBw/edit?usp=sharing