SurviveJS - Webpack and React - v1.7.5

Onwards we go. v1.7.5 can be characterized as a refinement release. I went through "React and Flux" and "From Notes to Kanban" with my editor (thanks Jesús!). As a result we should have something that's a notch better together. I took some decompression time during this iteration and negotiated a lot towards a better future I hope.

Book Improvements - v1.7.5#

In total 116 commits went to v1.7.5. To make it easier to follow what happened and where, I've split up the changes below.

You can see GitHub for all changes.

General Fixes#

• I learned something curious about a and an (no, we don't have these things in Finnish). It is important to remember to take in count what the words sound like.
• Use nicer formatting for npm i bits. Now -- shouldn't get mangled.

Introduction#

• The introduction of the book has been expanded somewhat. There's only one chance to make a first impression so might as well try to do a good one.

Webpack Compared#

• Added an expanded explanation for make.
• Added JSPM. You should watch Glen Maddern's awesome demo about it. It wouldn't surprise me a lot if JSPM had a bright future.

Developing with Webpack#

• Highlighted the importance of a proper .gitignore. I've seen some people to neglect this so I felt it's good to cover. It's just one of those things that saves your nerves. :)
• Dropped colors: true setting from devServer configuration. Reading from source I learned that webpack-dev-server actually detects for terminal colors automatically. As a result this bit of configuration can be dropped.

Implementing a Basic Note Application#

• Pushed notes definition outside of the App component. This cleans up the implementation a little.
• Added screenshots to show what you should see after each visual step.
• Expanded the explanation of super(). Remember that it refers to the method of the parent class.
• Improved the visual outlook of the add button.
• Made sure note tasks get assigned display: inline-block; to force a minimum height to them even if there's no content at all. This way they can be edited even then.

React and Flux#

• Clarified Gluing It All Together section a lot.
• Pushed Dispatching in Alt to the end. I've settled for a convention where the main content should be about getting ahead with the application whereas these sort of good to know things have been pushed to the end.
• Dropped redundant this.notes = this.notes || []; check. This won't be needed so it can be safely dropped. The same goes for bootstrapped data in general. It just works.
• Clarified and expanded What Are Decorators? and added an example showing how to implement @log for logging how methods are called.
• Reworked Using AltContainer Instead of a Decorator for clarity.

From Notes to Kanban#

• Added screenshots to illustrate progress.
• Reworked Modeling Lane for clarity.
• Reworked Making Lanes Responsible of Notes for clarity.
• Push addNote and deleteNote binds to constructor level. Logically Lane id remains the same during its lifecycle so this seemed like a safe change to make.
• Highlighted important code changes using bullet points.
• Added a section known as On Namespacing Components. This is a small technique you may find handy. It allows you to model cleaner component APIs so it's worth knowing.
• Added missing get to NoteStore. While at it I bummed a couple of lines of code from it. Now it's as compact as it can get.

Implementing Drag and Drop#

• Reworked introduction.
• Reworked Preparing Notes to Be Sorted.
• Pushed ItemTypes to '../libs/item_types' as it's not a component.

We will be doing more work on this chapter to make it clearer still.

Building Kanban#

• Added more context to the code examples to make them clearer.

Authoring Libraries#

• Made sure preversion hook git commit takes --allow-empty to allow empty distribution commits to be made.
• Dropped redundant version related tip as preversion hook does everything we need now.

Styling React#

• Expanded on CSS Modules and linked to gajus/react-css-modules as that makes it more convenient to work with them in React.

What Next?#

I'll continue going through the content with my editor while listening to your feedback. I'm particularly interested in highlighting updated lines as that would make it easier to follow what lines of code changed during the tutorial. I believe resolving this could help to push the book quality a notch further.

Now that the content is getting solid this means I can spend more time on producing new content. I'll be focusing on typing next. Also some other plans have been put to motion but more on those later.

Conclusion#

I think this was yet another good step towards a quality release at Amazon. Thanks for everyone involved! You make it worthwhile. :)

I hope you enjoy this release. As usual feedback and pull requests are welcome.

Remember that you can support my work by purchasing the book at Leanpub. Every little bit counts and allows me to keep it up.