First React Application

Ben Brown
2 min readApr 9, 2020

--

This is an introduction to using React. The ultimate goal is to use React to code in Javascript so that a visual design application can be created. The editor used in this tutorial is VisualStudio. In order to move forward with this tutorial: a text editor is needed, Node.js installed, and node packet manager. This is an easy prerequisite.

When creating an app, there is a command that needs to be programmed into the terminal (or if in windows, command prompt; but for simplicity’s sake I will refer to it as terminal as I am operating on a mac):

sudo npm i -g react-create-app@1.5.2

i — install

g — global

Once the dependencies are installed, pull up Visual Studio and a couple of packages need to be installed for the application that is going to built with Javascript in this tutorial. The two packages are Prettier and Simple React Snippet.

Your First React App

$create-react-app react-app
$cd react-app
$npm start

The first portion of the code create-react-app is command specific for your OS and React to install React and the third party libraries you will need, and react-app is the actual name of your react application so this can be interchangeable to whatever you want.

Installing React with the above command allows for zero configuration and sets up:

  • development server
  • bundling files (Webpack)
  • compiling Javascript code and other tools (Babel)

--

--

Ben Brown