SurviveJS - Webpack and React 9781523910502, 1861901941, 152391050X

Table of contents :
Table of Contents......Page 3
What is React?......Page 8
How is This Book Organized?......Page 9
What is Kanban?......Page 10
How to Approach the Book?......Page 11
Book Versioning......Page 12
Getting Support......Page 13
Acknowledgments......Page 14
I Setting Up Webpack......Page 16
Task Runners and Bundlers......Page 17
Make......Page 18
Grunt......Page 19
Gulp......Page 20
Browserify......Page 22
Webpack......Page 23
JSPM......Page 24
Why Use Webpack?......Page 25
Module Formats Supported by Webpack......Page 26
Conclusion......Page 28
Setting Up the Project......Page 29
Installing Webpack......Page 30
Directory Structure......Page 31
Setting Up Assets......Page 32
Setting Up Webpack Configuration......Page 33
Adding a Build Shortcut......Page 34
Setting Up webpack-dev-server......Page 35
Refreshing CSS......Page 42
Setting Up Initial CSS......Page 43
Enabling Sourcemaps......Page 44
Avoiding npm install by Using npm-install-webpack-plugin......Page 45
Conclusion......Page 46
What is React?......Page 47
Babel......Page 50
Defining Your Own Babel Presets......Page 55
Alternative Loader Declarations......Page 56
Developing the First React View......Page 57
Activating Hot Loading for Development......Page 59
React Component Styles......Page 61
Conclusion......Page 62
II Developing a Kanban Application......Page 63
Initial Data Model......Page 64
Connecting Data with App......Page 65
Adding New Items to the List......Page 67
Improving Component Hierarchy......Page 71
Editing Notes......Page 74
Removing Notes......Page 79
Styling Application......Page 82
Understanding React Components......Page 87
React Component Conventions......Page 89
Conclusion......Page 90
Introduction to Flux......Page 91
Porting to Alt......Page 93
Defining a Store for Notes......Page 95
Gluing It All Together......Page 98
Implementing Persistency over localStorage......Page 102
Using the AltContainer......Page 105
Alternative Implementations......Page 107
Conclusion......Page 108
Extracting Lanes......Page 109
Modeling Lane......Page 112
Making Lanes Responsible of Notes......Page 115
Implementing Edit/Remove for Lane......Page 123
Styling Kanban Board......Page 133
On Namespacing Components......Page 135
Conclusion......Page 136
Setting Up React DnD......Page 138
Preparing Notes to Be Sorted......Page 139
Allowing Notes to Be Dragged......Page 140
Developing onMove API for Notes......Page 143
Adding Action and Store Method for Moving......Page 145
Implementing Note Drag and Drop Logic......Page 147
Dragging Notes to Empty Lanes......Page 150
Conclusion......Page 156
Optimizing Build Size......Page 157
Splitting app and vendor Bundles......Page 160
Generating index.html through html-webpack-plugin......Page 165
Cleaning the Build......Page 167
Separating CSS......Page 168
Deployment......Page 174
Conclusion......Page 175
III Advanced Techniques......Page 176
Levels of Testing......Page 177
Setting Up Webpack......Page 180
Testing Kanban Components......Page 187
Testing Kanban Stores......Page 194
Conclusion......Page 198
propTypes and defaultProps......Page 199
Typing Kanban......Page 201
Type Checking with Flow......Page 205
Converting propTypes to Flow Checks......Page 209
Babel Typecheck......Page 213
TypeScript......Page 214
Conclusion......Page 215
Webpack and JSHint......Page 216
Setting Up ESLint......Page 218
Customizing ESLint......Page 222
Linting CSS......Page 226
Checking JavaScript Style with JSCS......Page 227
Conclusion......Page 230
Anatomy of a npm Package......Page 231
Understanding package.json......Page 232
npm Workflow......Page 234
Library Formats......Page 239
npm Lifecycle Hooks......Page 241
Keeping Dependencies Up to Date......Page 242
Conclusion......Page 243
Old School Styling......Page 244
CSS Methodologies......Page 245
Less, Sass, Stylus, PostCSS, cssnext......Page 246
React Based Approaches......Page 252
CSS Modules......Page 257
Conclusion......Page 259
Appendices......Page 260
Directory per Concept......Page 261
Directory per Component......Page 262
Directory per View......Page 263
Conclusion......Page 264
Modules......Page 266
Classes......Page 268
Class Properties and Property Initializers......Page 270
Functions......Page 272
Destructuring......Page 275
Object Shorthands......Page 276
Conclusion......Page 277
Implementing a Logging Decorator......Page 278
Implementing @connect......Page 280
Decorator Ideas......Page 281
Conclusion......Page 282
EPEERINVALID......Page 283
Module parse failed......Page 284
Project Fails to Compile......Page 285