Using React in Visual Studio Code

 

                                         +

React is a popular JavaScript library developed by Facebook for building web application user interfaces. The Visual Studio Code editor supports React.js IntelliSense and code navigation out of the box.

Welcome to React JS

We'll be using the create-react-app generator for this tutorial. To use the generator as well as run the React application server, you'll need Node.js JavaScript runtime and npm(Node.js package manager) installed. npm is included with Node.js which you can download and install from Node.js downloads.

Tips-to test the version of NPM and node than open CMD terminal and use below command.

1-To know the version of node.js use node --version

2-To know the version of npm use npm --version

After checking the version now you can create your react app by using below command

where myapp is the name of the folder for your application. This may take a few minutes to create the React application and install its dependencies. 

Note: If you've previously installed create-react-app globally via npm install -g create-react-app, we recommend you uninstall the package using npm uninstall -g create-react-app to ensure that npx always uses the latest version.

Let's quickly run our React application by navigating to the new folder and typing npm start to start the web server and open the application in a browser:

use cd my-app (your folder name)

than use npm start

You should see the React logo and a link to "Learn React" on http://localhost:3000 in your browser. We'll leave the web server running while we look at the application with VS Code.

To open your React application in VS Code, open another terminal or command prompt window, navigate to the my-app folder and type code .:

Now expand the src folder and select the index.js file. You'll notice that VS Code has syntax highlighting for the various source code elements and, if you put the cursor on a parenthesis, the matching bracket is also selected.

Now we all set go  - Happy Coding

Thank you.