Writing React Application Without JSX or Webpack
We all might have started to try React either using Create React App or directly jumped into a React project where all the setup is already done. There are JSX, Webpack, Babel and lot of other tools in the project.
If you started web development before 2010 or in that range, you might think about React as little complex in the initial days. That is because there were no build step in frontend years ago. Life was all about including a jQuery script and ta da!
Now the question is, can we create a React component in a simple HTML file? Just like we used jQuery. Yes we can.
We need to first add React and React-DOM files from CDN, just like we do for other libraries like Bootstrap or jQuery.
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js" ></script> <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" ></script>
Keep the reference to the bottom of
Add a div block with any id, say
div block is going to be the container of our React component.
const MyComponent = React.createElement("h1", null, "Hello World!"); ReactDOM.render(MyComponent, document.getElementById("root"));
In the first line we created a React component. In the second line we placed it inside our div.
You will not do this in any of your projects. But it is still a good thing to know that it is possible.Click here for all React interview questions