React

by Manju06

HTML

<div id="app">


</div>

CSS

.display-linebreak {
  white-space: pre-line;
}

React

class TodoApp extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
    	items: [
      	{ text: "Learn JavaScript", done: false },
        { text: "Learn React", done: false },
        { text: "Play around in JSFiddle", done: true },
        { text: "Build something awesome", done: true }
      ]
    }
  }
  
  render() {
   const text = 'One \n Two \n Three';
   const text1 ='Here we can see list of Product \n created and we can create a New product. We have 3 types of product Managed, Unmanaged and Source. \n  Managed Product : Managed product is where by default all the environments are created      \n  i.e Evaluation, Development,\n   Test & Production.  '
    return (   
 
     <div className="display-linebreak"> 
        {text1} 
     </div>
 
    )
  }
}

ReactDOM.render(<TodoApp />, document.querySelector("#app"))