I heard the best way to learn anything is to teach it and you get to master it. I just began learning React and I feel so late to the party. The only comfort I have is as I share my thoughts, others coming into the React world can navigate easily. Let's shoot!
Like super fast. It gives users mobile app experience on the web. Click on a button that leads to another page, it just goes to said page in split seconds. It runs on the browser and has nothing to do with a server where you would need to wait for a response except in the cases of API calls.
Now picture this, you're building a food directory website with just HTML and you wrote about 50,000 lines of code for just this one website. You run the code on the browser and boom! You see something shifted. Remember this webpage is made up of 50,000 lines of code. Now, you have to locate that bug. React makes this super easy. It is all about creating custom HTML elements.
Look at it this way, every webpage is made up of components or parts. A simple webpage is made up of a header, sidebar and article sections. Since React is component based, you can easily create a header component that only contains header HTML. Sidebar component that contains only sidebar HTML and article component that contains article HTML.
Now, when all these web pages have been put into components, it becomes easy to locate that bug if it is in any of these components and not have to scroll to find it. We'll learn about custom HTML elements as we go.
There is so much more React actually does. Take these for now and go do further research.
Let me use this simple illustration. Imagine a painter who of course paints. He paints a beautiful sky on his canvas for a very annoying client who keeps coming back to add new colors to the sky and for each new change, the painting is stressed except he would have to start all over again! I can only imagine.
Let's bring it home, imagine a developer working for a client who comes back every two days to request an update on his webpage, if it's not color, it's the font or just simply add a new button to the sidebar. Now, just so you know, with each update you make to the DOM, the page load time gets slower. Not everyone has the patience for a slow website.
Now enter React, it was created for an issue such as this. React presents to us what we know as a SHADOW DOM or VIRTUAL DOM. With each update to the web page, the DOM gets re-rendered and this makes what it spits to the page you see come slow. React becomes the middleman here. What React does, when you make an update, it renders what you have done on the VIRTUAL DOM (this is React's DOM) and only spits out the change to the main DOM hereby saving the DOM from re-rendering and what you get back is a faster page load. Cool right?
I will leave this here for now for you to brood. Hope it inspires you to take a step to trying React out.
Next time. Ciao.