In the next video, we will try out React with JSX for production. And, we wrote the same React component as before, using the more concise JSX syntax. We loaded a stand-alone Babel compiler from a CDN, to compile JSX in the browser. We set up a basic HTML page, and loaded react and react-dom modules from a CDN, as we did in the previous video. We have successfully created a development-only setup for trying React with JSX, using a stand-alone Babel compiler that runs in the browser. Now, save the file and test it out in the browser. If you compare this React code to the code written without JSX in the previous video, you will see that the JSX code is simpler and terser. getElementById ( "like_button_container" ) ReactDOM. function LikeButton ( ) const element = const domContainer = document. Try React with JSX for Development My Website This could be a very simple website somewhere on the web. To deploy the application in the production environment, use below scripts. This is the development version of the React library with debugging option. 17 represent the version of the React library. Let’s load the Babel compiler from a CDN. unpkg is an open source, global content delivery network supporting npm packages. However, this is a relatively slow process, using a large development build of React, so this approach should only be used for development, and not in production. We can load a stand-alone Babel compiler from a CDN, and compile our code in the browser. We will use a compiler called “Babel” to convert JSX to JavaScript. Most React code nowadays is written using JSX.īrowsers, however, cannot read JSX, so the code we write using JSX must first be compiled to pure JavaScript. JSX makes React easier for developers to read and write. Now, we will be writing our React code with JSX, which is an HTML-like syntax extension to JavaScript. Try React without JSX My Website This could be a very simple website somewhere on the web.
0 Comments
Leave a Reply. |