js react code example

Example 1: what is react

This is a formatted version of Komadori's answer 
(https://tinyurl.com/Komadori)
React is a JavaScript library for building user interfaces. 
It is maintained by Facebook and a community of 
individual developers and companies. 
React can be used as a base in the development of single-page 
or mobile applications.

Example 2: react js documentation

//With node and npm already installed for basic start

npx create-react-app my-app-name

// if you want to use npm 

npx create-react-app my-app-name --npm

//if you want to use typescript 

npx create-react-app my-app-name --template typescript

yarn start // app will be hosted on localhost:3000

/* start making changes at ./my-app-name/src/App.js
	React documentation: https://reactjs.org/docs/hello-world.html
*/

Example 3: what is react

React is a JavaScript library for building user interfaces.

It is maintained by Facebook and a community of individual developers and
companies.

React can be used as a base in the development of single-page or mobile
applications.

Example 4: reactjs

npx create-react-app my-app

Example 5: javascript react

class TodoApp extends React.Component {
  constructor(props) {
    super(props);
    this.state = { items: [], text: '' };
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  render() {
    return (
      

        
TODO
        
        

          
            What needs to be done?
          
          
          
            Add #{this.state.items.length + 1}
          
        
      
    );
  }

  handleChange(e) {
    this.setState({ text: e.target.value });
  }

  handleSubmit(e) {
    e.preventDefault();
    if (this.state.text.length === 0) {
      return;
    }
    const newItem = {
      text: this.state.text,
      id: Date.now()
    };
    this.setState(state => ({
      items: state.items.concat(newItem),
      text: ''
    }));
  }
}

class TodoList extends React.Component {
  render() {
    return (
      

        {this.props.items.map(item => (
          
{item.text}
        ))}
      
    );
  }
}

ReactDOM.render(
  ,
  document.getElementById('todos-example')
);

Example 6: react.js

class ShoppingList extends React.Component {
  render() {
    return (
      

        
Shopping List for {this.props.name}
        

          
Instagram
          
WhatsApp
          
Oculus
        
      
    );
  }
}

// Example usage: