Fatigue in React
React is a collection of a vast set of technologies and tools. So if your want to use React, you have to learn or deal with different package managers transpilers, module bundlers, and multiple packages for routing icons and other UI-related stuff as well. This is the most papular opinion about React which cause people to think that React/Javascript is Fatigue.
In this series, we will take a brief look at react
Well, all of these thoughts are true until you came to know what exactly React is. All of these thinkings are far from the truth. React is a pretty simple library that uses inside any page, even in the same way we use JQuery and other libraries by just including the CDN inside a script tag.
Yes, that is what we need to use react facilities inside any Web App. All other packages are for external support which we need to make our work easy and convenient. To import React inside the project, we need to add 2 CDNs to the header with different functionalities.
- React
- React DOM
React CDN
CDNs are pretty much handy and easy to configure as compared to other packages manager. They help you to get your work started in fewer lines. React CDN allows you to get all the core features of ReactJS inside your project. It implements the core features of React. Following are some features/advantages you will get after adding the react CDN inside your app.
- You get to use as little ReactJS as possible without setting up the boilerplate.
- React CDN is so simple that you even can use only a simple React Component for interactivity.
- Most websites nowadays are not Single Page Apps. You can easily include the flavor of SPA into your website using CDN ReactJs.
- You can also expand its usage into your website as the App’s complexity grows. CDN ReactJs makes this simple.
React DOM CDN:
This CDN is the entry point of the DOM-related rendering paths. It is intended to be paired with the isomorphic React, which is shipped as react CDN. If you want to use the JSX structure in your app you need to include the react-dom CDN as well.
Get M Adan Sarfraz’s stories in your inbox
Join Medium for free to get updates from this writer.
Boom! We are good to go to use React by including these CDN.
<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>At some point, we may want to load data from some API endpoints, or if the application keeps growing, we will reach a point where we need some data from external libraries to perform complex problems. Then we need to decide to move to the proper project structure that can be created using other package managers, such as create-react-app or vite as well. So most developers start thinking to create the whole boiler point from start.
Following the simple approach, we know that there is no fatigue in it. But Starting with the boiler point with multiple npm packages and proper structure we know that there is nothing to lose. It is simply amazing to see that as soon as specification is announced, someone in the community creates its library or plugin which helps others to simply add and help them to use that package rather than creating the whole package again. Apart from that ReactJS is created by Facebook so we don’t need to worry much because they focus on feedback from the community. Like, in the beginning, they realize that people need to learn hundreds of libraries or transpilers before React so they created a package create-react-app that came up with the initial boiler point. To install this cli tool all you need to install the node inside your system and simply run the following command:
npm install -g create-react-appthen you can create your new React boiler point Project by
create-react-app app_nameYou can also use typescript to create react app with
create-react-app app_name --template typescriptSo, by looking into the essence over hurdles, React is pretty fast and worth using.
Previous: Points to forget before React
Next: Typescript with React
