Coursera
Topics: JavaScript, React Application, Software
Transcript Excerpt
To understand react, the user needs to understand how to react makes it easier to develop JavaScript applications, and how to create a React component and run the application or a React application. Front-end frameworks are for the client-side and are available through the open-source libraries which are used for the hypertext markup language (HTML). Some common front-end frameworks are React, Vue.js and AngularJS. AngularJs is an open source from google that is used in HTML when including the library. It is based on JavaScript and HTML and makes HTML dynamic use directives. VUE.JS is an open-source framework that uses a virtual DOM, and the HTML is an entire object. The attributes of the VUE.JS+- object and ANGULARJS are similar along with binding being available. React is a framework that builds client-side dynamic web applications. It uses a virtual object model (DOM) and dynamic data binding for extending the HTML syntax. In need to eliminate the code that keeps the user interface, UI elements are parallel with it. The HTML document model consists of the document, root element, and body element. Within the body element there is the <h1> element with text, <p> element with text and <form> element with two <input> elements. React uses the special language called JavaScript XML which is like HTML. It can be interpreted as JavaScript by Babel and JSX is embedded inside the special script tags where the content needed for Babel is specified. To build React applications there are three packages are ReactDOM package, React package, and Babel package. The React package keeps the components, their states, and properties. The ReactDOM package is the thing that holds between the DOM and React. The Babel is where the JSX Javascript is interpreted and compiled. A normal HTML page can change to give a React component. A lot of the modern browsers support Babel scripts. The thing that must be included is “react.production.min.js” “react-dom.production.min.js” and “babel.min.js” within the HTML. The React component is inside a script tag which is shown as type=” text/babel”. In the example, Mycomp is the defined component. To create a React application easily, Facebook provided with create react app utility. The application names need to be in lowercase. When running the npx create-react-app todoapp it will create a React app named todoapp which will be a directory. The files will be in that directory. The SRC folder is where the user can make the main changes. That folder has index.js and app.js. In Index.js the user adds the App component to the HTML and in the App.js it has an App that is the root React component that will be added to the HTML. The user will go to the application directory and click run npm start to run the app which will allow the server to start and when the app is connected from the browser the React component will be shown.
