top of page

Starting with React

  • Writer: prashant sharma
    prashant sharma
  • May 30, 2020
  • 1 min read

React is a JavaScript library for building user interface.

React Advantages

Reusable code

component Based Approach

DOM updates are handled gracefully

Key Points:

  • We are using Es2015 which is a standard scripting language

  • JavaScript is developed using it.

  • JSX is an XML/HTML-like syntax used by React that extends ECMAScript

  • Instead of putting java-script in HTML it helps in putting HTML into JavaScript

  • Tools like Babel Does this

  • Babel does this help us to write jsx which it convert into a functional cal

Okay now Let’s start by creating a React-App reactalpha1:

  • npm install -g create-react-app

  • npx create-react-app reactalpha1

  • cd first-react-app

  • npm start

Note we are considering that nodejs is already installed on your machine if not first install node package

and make sure you have npm in your system.

Okay now we thought to add a React component:

Inside Reactalpha1 which is our project go to Src folder there you need to create a js file called Firstcomponent.js once you are done with it Add the Below code in it.

import React, {Component} from 'react' import ReactDOM from 'react-dom' class Myclass extends Component{ render(){ return<h1>Hello world bro</h1> } } export default Myclass

Once the component is made you need to add it to index.js So that it can be imported and can be displayed.

ReactDOM.render( <Myclass />, document.getElementById('root') );

ReactDOM is a package that provides DOM specific methods to manage Dom elements of a web-Page In short because of ReactDOM package I am able to display my component Myclass.

 
 
 

Comments


bottom of page