Hacking with React
Hacking with React
Get started with React, React Router, Jest, Webpack, ES6 and more with this hands-on guide.
About the Book
It's impossible to work on the web without having heard about React. Facebook developed it, but Airbnb are using it, as are Netflix, Uber and many more. And with good reason: React is a whole new way of developing complex web applications in a way that allows you to spend more time writing great code and less time fighting with the DOM.
I wrote Hacking with React with one goal in mind: to teach React coding in the fastest, most efficient way possible. After setting up your computer so that it's ready for development, you start coding with React immediately – there's no boring "History of web" chapter that rants on about how the internet was created. Instead, it's all code, all the time.
"What code is it?" I hear you ask. Well, let me tell you: it's React 0.14, the incredible new user interface toolkit. It's React Router, the smartest way to load and unload components as users change URL. It's JSX, the incredible new JavaScript syntax extension that lets you write inline XML. It's ES6, Webpack and Babel so you get to use powerful new features like string interpolation and classes along with hot reloading for faster development. It's Jest and ESLint, so you can write tests that prove your code works and has consistent syntax.
In short, it uses the very latest technology the web has to offer so that you learn quickly and easily.
Here are just some of the topics covered:
- How to install Webpack, Babel and React for development with ES6.
- How to create a React component and import it into an application.
- How to write JSX to render content.
- How to use props to give a component values.
- How to handle events such as onClick.
- How to use React state, and how it differs from props.
- How to fetch data from GitHub using SuperAgent and Ajax.
- How to use string interpolation and computed property names.
- How to create routes using React Router.
- How to create links between pages using <Link>.
- How to render default content using <IndexRoute>.
- How to use Jest to test React component rendering.
- How to use Jest to simulate user interface with controls.
- How to create asynchronous tests using waitFor() and runs().
- How to lint your React code using ESLint and Babel.
In short, this book is the fastest way to get up to speed with React development, and is guaranteed to jump start your learning. Even better, your purchase includes any future updates free of charge!
You can download the complete source code for the book from GitHub at https://github.com/twostraws/HackingWithReact.
Table of Contents
- Welcome!
- Begin at the Beginning: Chapter One
- The Importance of using Webpack with React
- Introduction to JSX
- Importing React Components using ES6
- What are React Props?
- Generating Random Values for Our Page
- How to Write if/else Conditional Statements in JSX
- Using JSX to Render Several Elements at Once
- Handling Events with JSX: onClick
- State vs Props in React
- Changing a React Component’s State with setState()
- State and the Single Source of Truth
- Rendering an Array of Data with map() and JSX
- Cleaning up and Preparing for a Real Project
- Fetching Ajax Data from GitHub using SuperAgent
- Converting GitHub’s JSON into Meaningful JSX
- Time for a Task: Reading from Three Feeds
- How to Upgrade Our App to Read Three Feeds
- Refactoring our Ajax Code: Don’t Repeat Yourself
- Refactoring our State Code: Passing Parameters in onClick
- Introducing React Router
- How to Add a New Route to React Router
- Creating a Link Between Pages in React Router
- Making Custom URLs with React Router Params
- Adding a Root Route Using React Router and IndexRoute
- Cleaning up Our Routes and Preparing for the Next Step
- Time for a Test: Clickable Usernames
- Making Usernames Clickable: My Solution
- Time for some Basic User Interface Polish
- Adding React Router Breadcrumbs with Link and IndexLink
- The First 80% is Done: Now What?
- How to Configure Jest to Test React and ES6
- Creating our First React Test with Jest
- Using Jest to Test Our React Components
- Using Jest to Simulate User Interaction on a React Component
- Time for Ajax: Using Jest with Asynchronous Tests
- Mocking Ajax with Jest: Making an Asynchronous Test Become Synchronous
- Cleaning up Our Tests: Last Tweaks
- Linting React using ESLint and Babel
- Linting React using Airbnb’s ESLint Rules
- How to Add React Component Prop Validation in Minutes
- Bringing it all Together: Project Complete!
Authors have earned$9,912,880writing, publishing and selling on Leanpub, earning 80% royalties while saving up to 25 million pounds of CO2 and up to 46,000 trees.
Learn more about writing on Leanpub
The Leanpub 45-day 100% Happiness Guarantee
Within 45 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
See full terms
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers), EPUB (for phones and tablets) and MOBI (for Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them
Top Books
C++ Best Practices
Jason TurnerLevel up your C++, get the tools working for you, eliminate common problems, and move on to more exciting things!
Continuous Delivery Pipelines
Dave FarleyThis practical handbook provides a step-by-step guide for you to get the best continuous delivery pipeline for your software.
OpenIntro Statistics
David Diez, Christopher Barr, Mine Cetinkaya-Rundel, and OpenIntroA complete foundation for Statistics, also serving as a foundation for Data Science.
Leanpub revenue supports OpenIntro (US-based nonprofit) so we can provide free desk copies to teachers interested in using OpenIntro Statistics in the classroom and expand the project to support free textbooks in other subjects.
More resources: openintro.org.
C++20
Rainer GrimmC++20 is the next big C++ standard after C++11. As C++11 did it, C++20 changes the way we program modern C++. This change is, in particular, due to the big four of C++20: ranges, coroutines, concepts, and modules.
The book is almost daily updated. These incremental updates ease my interaction with the proofreaders.
Atomic Kotlin
Bruce Eckel and Svetlana IsakovaFor both beginning and experienced programmers! From the author of the multi-award-winning Thinking in C++ and Thinking in Java together with a member of the Kotlin language team comes a book that breaks the concepts into small, easy-to-digest "atoms," along with exercises supported by hints and solutions directly inside IntelliJ IDEA!
Introductory Statistics with Randomization and Simulation
Mine Cetinkaya-Rundel, Christopher Barr, OpenIntro, and David DiezA complete foundation for Statistics, also serving as a foundation for Data Science, that introduces inference using randomization and simulation while covering traditional methods.
Leanpub revenue supports OpenIntro, so we can provide free desk copies to teachers interested in using our books in the classroom.
More resources: openintro.org.
Ansible for DevOps
Jeff GeerlingAnsible is a simple, but powerful, server and configuration management tool. Learn to use Ansible effectively, whether you manage one server—or thousands.
Java OOP Done Right
Alan MellorObject Oriented Programming is still a great way to create clean, maintainable code. But only if you use it right.
This book gives you 25 years of OO best practice, ready to use.
You'll learn to design objects behaviour-first, use TDD to help, then confidently apply Design Patterns, SOLID principles and Refactoring to make clean, crafted code.
Introducing EventStorming
Alberto BrandoliniThe deepest tutorial and explanation about EventStorming, straight from the inventor.
Discrete Mathematics for Computer Science
Alexander Shen, Alexander S. Kulikov, Vladimir Podolskii, and Aleksandr GolovnevThis book supplements the DM for CS Specialization at Coursera and contains many interactive puzzles, autograded quizzes, and code snippets. They are intended to help you to discover important ideas in discrete mathematics on your own. By purchasing the book, you will get all updates of the book free of charge when they are released.
Top Bundles
- #1
Software Architecture for Developers: Volumes 1 & 2 - Technical leadership and communication
2 Books
"Software Architecture for Developers" is a practical and pragmatic guide to modern, lightweight software architecture, specifically aimed at developers. You'll learn:The essence of software architecture.Why the software architecture role should include coding, coaching and collaboration.The things that you really need to think about before... - #2
CCIE Service Provider Ultimate Study Bundle
2 Books
Piotr Jablonski, Lukasz Bromirski, and Nick Russo have joined forces to deliver the only CCIE Service Provider training resource you'll ever need. This bundle contains a detailed and challenging collection of workbook labs, plus an extensively detailed technical reference guide. All of us have earned the CCIE Service Provider certification... - #3
Cisco CCNA 200-301 Complet
4 Books
Ce lot comprend les quatre volumes du guide préparation à l'examen de certification Cisco CCNA 200-301. - #4
Modern C++ by Nicolai Josuttis
2 Books
- #5
CCDE Practical Studies (All labs)
3 Books
CCDE lab - #6
"The C++ Standard Library" and "Concurrency with Modern C++"
2 Books
Get my books "The C++ Standard Library" and "Concurrency with Modern C++" in a bundle. The first book gives you the details you should know about the C++ standard library; the second one dives deeper into concurrency with modern C++. In sum, you get more than 600 pages full of modern C++ and about 250 source files presenting the standard library... - #7
Mastering Containers
2 Books
Docker and Kubernetes are taking the world by storm! These books will get you up-to-speed fast! Docker Deep Dive is over 400 pages long, and covers all objectives on the Docker Certified Associate exam.The Kubernetes Book includes everything you need to get up and running with Kubernetes! - #8
Modern Management Made Easy
3 Books
Read all three Modern Management Made Easy books. Learn to manage yourself, lead and serve others, and lead the organization. - #9
The Future of Digital Health
6 Books
We put together the most popular books from The Medical Futurist to provide a clear picture about the major trends shaping the future of medicine and healthcare. Digital health technologies, artificial intelligence, the future of 20 medical specialties, big pharma, data privacy and how technology giants such as Amazon or Google want to conquer... - #10
Django for Beginners/APIs/Professionals
3 Books