React

React is a JavaScript library that can be used to render HTML.
React is a component based JavaScript library.
codecademy.com/articles/react-setup-1


Components

Think of a component as a simple function
A JavaScript function takes input arguments and can return a value.
A React component takes properties and state and returns a user interface description


A component can have a private state that can change over time
A component can either be a function component or a class component
Properties are called props.


Function Component

const MyComponent = function(props) { 
   return (
      < elementOrComponent ../>
   );
};

This is equivalent to

const MyComponent = (props) => { } 


Class Component

class MyComponent extends React.Component { 
   render() {
      return (
         < elementOrComponent ../>
      );
   }
}

//https://github.com/OfficeDev/office-js-docs/blob/master/docs/design/using-office-ui-fabric-react.md


Constructors

class Button extends React.Component { 
   constructor(props) {
      super(props);
      this.state = { counter : 4 };
   render() {
   }
}

This is equivalent to

class Button extends React.Component { 
   state = {counter : 4 };
   render() {
   }
}




© 2018 Better Solutions Limited. All Rights Reserved. © 2018 Better Solutions Limited TopNext