To get the most out of this book
One of the goals of this book is for you to get hands-on experience using React and Hooks. Following are a couple of options that you can follow to get the most out of the content before you start.
Refresh your knowledge of React
If you haven't used React lately or are not familiar with its cutting-edge features, I recommended you jump to Chapter 10, Building a Website with React, to get an overview of the three building blocks that React relies upon to build a website: JavaScript, CSS, and HTML.
While reading the book, feel free to visit this chapter often if you run into new syntax that you are not familiar with, or you simply want to gain more insights into how each building block is utilized in React.
Use a browser without building the code
If you don't have a local environment to work with the code or you simply don't want to build the code, you can access the examples from an online server at https://codepen.io/windmaomao/pen/ExvYPEX. You should get Hello World
printed on your screen in no time. Each chapter comes with a couple of playground links that you can click to follow. They appear as follows in the book:
Playground – Hello World
Feel free to play with this online example at https://codepen.io/windmaomao/pen/ExvYPEX.
Build the code yourself
If you are a hands-on person and would like to follow the code step by step in each chapter, you need to have React installed in one of your projects. Instructions to set up a React project from scratch are as follows.
npm
Visit the Node.js website, https://nodejs.org, to grab the latest versions of Node.js
and npm
. Pick the right version for your operating system and install it. To find out if everything has been installed properly, open a terminal, and run the following command:
node -v
If you see a version number returned by the preceding command, Node.js has been installed.
Create React App
You can get your React project up and running quickly by using the following command:
npx create-react-app my-app
Replace my-app
with your desired application name. Once you have the projects ready, you can go into the my-app
folder and launch it:
cd my-app yarn start
That's it, you should see an application on your local computer. Now you can try the source code out by pasting our code over your project and compiling it locally.