MKs Notebook

codepen is an online code editor and in this article we setup codepen for React JS, so that we can test our React code online on multiple devices. Follow the steps given bellow to Setup codepen for React JS. 1. Create A new Pen. 2. Click on Setting and than click on JavaScript tab. 3. For "JavaScript Preprocessor" choose "Babel". 4. In the "Add External Scripts/Pens" search bar type "react" and from the list choose "react", search again and this time choose "react-dom". or use these links https://cdnjs.cloudflare.com/ajax/libs/react/16.8.6/umd/react.production.min.js https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.6/umd/react-dom.production.min.js respectively 5. Click on "Save and Close" and you are ready

001 Hello World To render/create a react app you need to add these files into your index.html file <script src="https://unpkg.com/react@16/umd/react.development.js"></script> <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script> React Methods: ReactDOM.render(What to print, Where to print); React.createElement('html element', Attributes, child);                                                                Example (001 Hello World) var h1 = React.createElement('h1', null, 'Hello World'); var content = document.getElementById("content"); ReactDOM.render(h1, content); See the Pen 001 Hello ...