By having a declarative style, the developer does not have to worry so much about the fine details of what is going on in the background in React. For example, to have a button turn blue when a user clicks on it in React is almost as easy as saying you want the button to be blue when it is clicked. You declare what you want to have happen and trust React to take care of details. This eliminates a lot of the surface area where bugs could occur if you were using a framework with an imperative style where you may have more finite control but also more room for error.
React is different from other multi-platform frameworks like Cordova that claim you can "write once, run anywhere", instead taking a "learn once, write anywhere" approach. You can imagine that platforms such as iOS and Android have unique differences that would be a challenge for a multi-platform framework to embrace properly. By not making any assumptions about these platforms and instead being more of an idea of how to code, React can embrace these differences well. Simply swap out the Virtual DOM with Objective-C APIs on iOS or Java APIs on Android, and React renders natively on each platform.
React components are a bit like Lego pieces where multiple components make up a single application and each component has a specific purpose that it was designed for. If you were building a weather app you might have one component that takes the users location, another that shows the temperature and another that shows precipitation. What's great about this is that if the temperature isn't showing up how you want, you know the problem must be with the temperature display component. Just fix that component and your app is working with no need to wonder where the bug could be coming from. And what if you want to show the temperature in another part of your app? Just bring in that temperature component and now you have full use of it.
In React you have something called the virtual DOM. When changes are made to a page (like the temperature increasing by 1 degree in a weather app) only that specific piece of the DOM is updated and nothing else. No reason to refresh the entire page, giving the UI a "reactive" feel and at them same time reducing how much data is sent between the backend and the client.
As you browse the web (with the React developer tools installed) you begin to see just how many websites are written in React. here are a few examples:
As you can see, React gives you the power to develop beautifully interactive web apps not possible before. Check out our getting started with React tutorial to learn React hands on and stay tuned to Simplecode for more great React tutorials.
© Cloud Giant 2023. All rights reserved