The road to React

Appearance

Requirements ​

To navigate through this book, it's essential to have a foundational understanding of web development, encompassing HTML, CSS, and JavaScript. Familiarity with APIs is beneficial, as they will be discussed later. Additionally, you'll require the following coding tools to follow along with the book, complementing these skills.

Editor and Terminal ​

For this learning experience, you will need an editor (e.g. Sublime Text) and a command line tool (e.g. iTerm). As an alternative, I recommend using an IDE, for example Visual Studio Code (also called VSCode), for beginners, as it's an all-in-one solution that provides an advanced editor with an integrated command line tool, and because it is the most popular choice among web developers. I have provided a setup guide to get you started with general web development. It comes with all the details and I keep it separate from the book, because it offers options for Windows and MacOS users.

If you don't want to set up the editor/terminal combination or IDE on your local machine, CodeSandbox, an online editor, is also a viable alternative. While CodeSandbox is a great tool for sharing code online, a local machine setup is a better tool for learning the different ways to create a web application. Also, if you want to develop applications professionally, a local setup will be required.

Throughout this learning experience, I will use the term command line, which will be used synonymously for the terms command line tool, terminal, and integrated terminal. The same applies to the terms editor, text editor, and IDE, depending on what you decided to use for your setup.

Optionally, I recommend managing projects on GitHub while we conduct the exercises in this book, and I've provided a short guide on how to use these tools. Github has excellent version control, so you can see what changes were made if you make a mistake or just want a more direct way to follow along. It's also a great way to share your code later with other people.

Node and NPM ​

Before we can begin, we'll need to have Node and NPM installed. Both are used to manage libraries (node packages) that you will need along the way. These node packages can be libraries or whole frameworks. We'll install external node packages via npm (node package manager).

You can verify node and npm versions on the command line using the node --version and npm --version commands. If you don't receive output in the terminal indicating which version is installed, you need to install node and npm:

Command Line

bash
node --version
*vXX.YY.ZZ
npm --version
*vXX.YY.ZZ

If you have already installed Node and npm, make sure that your installation is the most recent version. If you're new to npm or need a refresher, this npm crash course I created will get you up to speed.

Exercises: ​

  • Optional: Read more about yarn and pnpm. Both can be used as a replacement for npm. However, I do not recommend using them as a beginner. This exercise should only make sure that you know about the alternatives.