The smallest building blocks of React applications are the elements. Example of an element is −const message = Welcome, Steve;React DOM updates the actual DOM with the converted react elements. React components are made up of elements.Rendering element on DOMWe will have a parent div element in the main html file . This div can be called as root. ReactDOM manages everything which is inside the app div. We can add multiple such an isolated div in applications if required.To render the element it will be passed to the ReactDOM render method −const message = Welcome, Steve; ReactDOM.render(message, document.getElementById('app'));This will ... Read More
JSX is like a template language with Power of JavaScript. It helps in creating the react elements. It’s an extension of JavaScript to include UI elements.Examplelet message = Hello World ;h1 tag is known html tag but with jsx we have created a variable containing the h1 tag with a hello world message.Usefulness of jsxThough it’s not mandatory to use jsx to create react elements. But its visibly appealing and helps in understanding the code in easy way. React embraces the concept of keeping UI logic and rendering logic together.We can build different loosely coupled components for separation of concernsExpression ... Read More
create-react-app is a command to create a React.js project with default configuration. Create-react-app will help in running react applications. Command will be executed on npm or yarnIf npm and node.js is installed on computer, install create-react-app globally with command −npm install –g create-react-appCreation of project − to create a project once above commands are executed, run below command −npx create-react-app hello-world-examplenpx comes with npm version 5.2+ , npm version can be checked on terminal using npm –versionIf npm version is 5.2+, then react.js project can be directly created with command −npx create-react-app hello-world-exampleIf npm version is 6+, npm init react-app ... Read More
The new line character, we denote as . This is used to make a line break. ASCII code for is 10 and it is also called Line Feed (LF). Now, let's see how to find a new line character using RegExp. A RegExp is an object that specifies the pattern used to do search and replace operations on the string or for input validation. RegExp was introduced in ES1 and it is fully supported by all browsers The RegExp meta character finds an index value of the first occurrence of a newline character in a given text. Syntax ... Read More