ReactJS: Create your first react app.

React is one of the most in-demand and popular JavaScript library. And the reason is simple it gives you the ability to create complex User Interfaces with minimal and simplified code.

In this article we are going to go through the installation process and the process of creating your first react app.

Creating a react js app.

There are a few different ways of creating a react app. But the simplest way is using a CDN – link. This allows you to start using ReactJS instantly, without any installation setup.

Just include these two lines in your HTML file.

<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>

But this is not the best way of creating a react app. The best way to create a react app is Using react CLI, but for that, you need to have NodeJS installed.

Once NodeJS is installed in your system. Now there are two ways of creating react app.

The Quick way (npx):

Use the following command in your preffered terminal.

npx create-react-app <app-name>
cd <app-name>
npm start

The first line will create a react app and name it. And the third line will open the app in your default browser. Which looks something like this.

The productive way (NPm):

In this way first we will install NPM (Node package manager) then will create the react app.

That’s why i call this way as the productive way, because soon or late you would have to install NPM then why not now.

Follow these command below.

npm install -g
cd <app-name>
npm start

The first line installs npm globally. And you know what the next two line does.

Actually we can also create a react app via yarn. But we are just not gonna get into it in this post.

So, i hope this was helpful to you.

Thank You.

NodeJS: JavaScript powering the backend.

Node.js is an open-source, cross-platform JavaScript run-time environment that executes JavaScript code outside of a browser. NodeJS is a JavaScript engine that you can install in your own system.

Also, NodeJs makes it possible to use JavaScript in backend development as a backend programming language. (Cool! isn’t it.)

You need to know this.

Node isn’t a program that you simply launch like Word or Photoshop: you won’t find it pinned to the taskbar or in your list of Apps. To use Node you must type command-line instructions, so you need to be comfortable with (or at least know how to start) a command-line tool like the Windows Command Prompt, PowerShell, or the Git shell.

Installation Steps

  1. Download the Windows installer from the Nodes.js® web site.
  2. Run the installer (the .msi file you downloaded in the previous step.)
  3. Follow the prompts in the installer (Accept the license agreement, click the NEXT button a bunch of times and accept the default installation settings).

Now to be sure that everything is fine and to confirm node installation, You need to run the following code in your preferred terminal.

  • Check node version: node -v
  • Check npm version: npm -v
  • Confirm installation of node: node hello.js
Microsoft Windows [Version 10.0.15063]
(c) 2017 Microsoft Corporation. All rights reserved.

C:\Users\docs> node -v
v10.14.2

C:\Users\docs> npm -v
6.4.1

C:\Users\docs> node hello.js
Node is installed!

Here is an actual example from my very own system.

If you have any question in your mind, feel free to comment below.

Thank You.