Learn Webpack and React

SurviveJS will take you from

apprentice to master

SurviveJS connects the dots and fills the gaps left by the latest JavaScript tools and their documentation. With its detailed step-by-step tutorial approach, SurviveJS gives practical examples of code and configuration while providing context for choosing one method over another.
Steve Piercy
Steve Piercy
Webpack is powerful but configuring it can be painful. Same goes with React. There are so many ways of configuring React with asset compilation, minification etc that it is easy to get lost. This book provides practical tips on how to get configure Webpack to make it work with React and other modern JavaScript tools like Babel.
Neeraj Singh
Neeraj Singh
Founder of BigBinary
Setting up a cutting-edge frontend development environment with React takes time. What sets SurviveJS apart is that it does not only show you exactly how to do it, it evolves, preventing JS fatigue, hence the name.
Omar van Galen
Omar van Galen
This is the most useful book I’ve read this year. Apart from React itself it gives you a headstart into Webpack which is gaining traction as the weapon of choice for deploying Javascript apps and Flux architecture pattern. Well-written, full of annotated code, what’s not to like? Yes, I would recommend it to a friend.
Nick Ostrovsky
Nick Ostrovsky
I originally got this book to learn React, but I found quickly that the instruction on Webpack alone was worth the price of admission. I have followed this book's iteration from very early on, and it gets better every time. It is very useful, and to this day I keep going back to it as a good way to get new projects up and running.
Phil Ledgerwood
Phil Ledgerwood
Integrity Inspired Solutions

What will I learn by reading this book?

React Facebook's React powers an increasing amount of sites. There is a good reason for this. It simplifies frontend development greatly. Combined with Webpack, a bundling tool, you have a powerful frontend development environment in your hands.

SurviveJS - Webpack and React shows you how to build a simple Kanban application based on these technologies as shown below:

Kanban animation

Psst. You can try out the application online.

By reading this book, you will learn to:

  1. Set up a Webpack based development and production environment. You will learn to get most out of babel-plugin-react-transform and Babel for development.
  2. Improve the quality of your code by using ESLint and friends to spot possible mistakes earlier.
  3. Get into the React mindset while learning the basics of Alt, an implementation of the Flux Application Architecture.
  4. Style your React application in various emerging ways.
  5. Implement drag and drop for your application using React DnD.

Leanpub/Amazon exclusives

In addition, if you buy the Leanpub or Amazon version you will get access to exclusive chapters that show you how to:

  1. Deal with typing in React.
  2. Test your React application in various ways.

By buying the book, you will support my efforts and allow me to develop more content.

The Leanpub version comes in pdf, epub, and mobi formats!

Get started with the online version

Please check out the online version of the book to get started! The book source is available through GitHub.

The book is freely available under CC BY-NC-ND license. You can support creation of new content by purchasing a digital copy of the book.

What are the prerequisites?

Kanban board Dennis Hamilton - Kanban (CC BY)

I expect you know the basics of JavaScript and Node.js. Some experience in ES6 won't hurt. Plenty of patience is needed as there's a lot to learn.

Fortunately, you don't have to be alone in your journey. Community support is available through gitter. You can also contact me directly.

Need help?