React Speed Coding

Learning React is future proofing your investment more than any other framework or library with similar goals.


React Speed Coding book enables you to optimize your React development workflow and speed up the app design lifecycle.


Learn to build 3 single page apps including a Reddit-like news app, a blog, and a Bootstrap-like UI library. 


Read 15 chapters on ES6 React, Redux, Webpack, Flexbox, PostCSS, Enzyme, Mocha, Chai, Istanbul, and Firebase integration.  


Create and reuse a library of more than 30 custom React components. 


Speed-start your project with more than 3,000 lines of code available in our GitHub repository.


We sincerely hope React Speed Coding can contribute to your journey in mastering the React ecosystem of technologies. Here's to moving from Concept to Code to Cash, speedily!


Who is this book for


React ecosystem is constantly evolving and changing at a fast pace. Successfully navigating this growing ecosystem, making the right technology stack decisions along the way, will make the difference between an average programmer and a world class designer-developer of the future. React Speed Coding can help you get there.


The React Speed Coding book assumes basic knowledge of programming in JavaScript, HTML, and CSS. 


If you are a complete beginner, there is enough guidance available for you to make this your first programming primer with suggested additional reading.


Experienced web developers will master React component design workflow using latest ES6 language features.


If you already program in React, you can use this book to optimize your development, testing, and production workflow.


Why read React Speed Coding


Setup React Webpack development environment complete with Node and Babel including development, testing, and production workflows. Production optimize Webpack development toolchain for CSS, JS, HTML pre-processing, faster builds, more performant code.


Learn ES6 React features including arrow functions, template literals, variable scoping, immutability, pure functions, among others.


Create custom React Speed UI library using Flexbox and PostCSS, with goals including responsive design, single page app components, ease of customization, reusable code, and high performance.


Apply Behavior-Driven Development techniques to create a comprehensive testing strategy for your apps. This includes ESLint and StyleLint to provide in-editor coding guidance on industry best practices for JavaScript and CSS. Use Mocha to describe specs. Chai for writing assertions. Sinon to spy on methods and events. We also learn about Enzyme for simple yet powerful React component level testing.


Adopt a comprehensive component design workflow including five strategies for starting component design by creating React components from embeds, REST APIs, samples, and wireframes.


Create complete single page app using Redux store, actions, and reducers.


Integrate your apps with serverless architecture using Firebase hosting. Create REST API for component design workflow using Firebase visual tools. Compare with other database oriented web platforms including Meteor.


Why React is awesome


Writing the React Speed Coding book, companion code, and ReactSpeed.com demo website has been fun and fulfilling at the same time. Thanks to the amazing ecosystem that React and open source community have created in a relatively short span of time.


What we love about React and companion libraries like Redux is how they introduce constraints and flexibility at the same time. A very difficult goal to achieve when writing generic libraries and frameworks. React and Redux seem to have done so elegantly. Growing GitHub stars and cross-industry adoption is proof of this achievement.


To us React is about thinking in design and architectural patterns. It is more than making choices about which framework or library to use, or how to use these. We rapidly raise our thinking to design, requirements, solving real-world problems, that our apps are expected to address.


Thanks to flexibility of integrating with React, even some of the competing frameworks offer integration paths with the React ecosystem. These include Meteor-React integration, Redux use cases with Angular, and TypeScript-React playing well together, just to name a few.


Most awesome aspect of learning React is that it is an ecosystem. It has a life of its own above and beyond Facebook, the original authors of React core. No wonder you see companies like Netflix, Airbnb, Kadira, Khan Academy, and Flipboard contributing their React libraries and tools to the open source.