Come join me in my journey to learn ReactJS. I'm not a professional web developer, but all the more I'm eager to demonstrate that it doesn't take a professional coder to master the fundamentals of ReactJS, or React for short. I hope to outline my journey in learning React, and may it be a learning resource for all who are keen. In this first article, I write generally about what React is all about, who should learn it, and why.
Before speaking about React, let's just harken back to the early 2000s. You see, in the past, the Internet was simple. Websites, webpages and web applications were all retrieved and rendered from the server. In those days, web interactions were all about the HTTP GET method. Let me explain.
You would be sitting in front of your computer, using a browser (in web dev speak, that's called a client). You would visit a URL, and what that means is that the browser would use the GET method to request for a HTML file and all of its associated CSS and JS files from a server (which is this crazy big computer backend that hosts all the files).
After waiting for a while, you would then see the HTML being rendered in your browser. The CSS file tells your browser how to design and style the page, and the JS file just has a bunch of coding statements that allows you to interact with the webpage (largely through IF and FOR loops, really).
For every single link you click on, or for every URL you visit, well, the above process continues. Ad infinitum, ad nausea. So everything meaningful to your experience is just done by the server. You, as the client, just plays the role of clicking through page by page, and requesting for each page. This was the age of JavaScript past - and most web developers dealt with libraries such as jQuery.
New age JavaScript focused on what we call "Single Page Applications (SPAs)". So you might have heard of things like Angular, React etc. Well, these are essentially SPA JavaScript frameworks that allow you to conceptualise web development in a way that shifts the focus from the server to the client.
Here's how the new web kind of works - you visit a webpage as before, but instead of requesting a comprehensive HTML file and all its associated CSS and JS files, you actually only request (in an ideal case), a very simple HTML file, and one JS file. The cool thing is that this JS file now works in your browser to render even more complicated HTML and CSS functions, and produces this really complex HTML to render in your browser.
A true SPA would then also make it such that whenever you move from page to page within the same website, you actually don't request for more files from the server! Your browser actually uses the initial JS file to render each new page.
You got it - it's as if entire web experience is being delivered through code. The server just dishes out JS files (well, and a bare bones HTML file of course), and these JS files are executed in your browser to generate the complex webpage you see.
So those SPAs I spoke about? Well, React's one of them! It makes whatever I mentioned above possible in the new age of JavaScript. That's why people speak of creating an "app" in React. An "app" is just a neatly (and tightly) organised collection of JS, delivered once over the Internet to your browser. Once this JS is sent to your browser, whatever SPA framework is responsible for creating the web experience just takes over the generation of web content.
Long and short: React is a JavaScript library that allows you to write SPAs, in JS, that delivers that experience I just wrote about. It is used to create user interfaces based on the idea of "reusabililty" and "composability".
This may sound like plain history, but it's one of the important reasons why people choose to learn React. You see, React was created by Jordan Walke, a software engineer at Facebook who open-sourced it in 2013. And, surprise surprise, while being open-source now, it's being maintained by Meta (formerly Facebook) and a community of individual developers and companies.
So React is naturally always kept up-to-date and relevant. In fact, React has a cousin called React Native, which allows you to create apps across android and iOS systems with React. The politics and entire community behind React is itself a good reason to pick up React - the community itself is a hotbed of innovation and discussion.
So why not just plain vanilla JS for creating your apps? Well, technically you could, and you should if the apps you're writing have such highly specialised UI requirements that require special handling through plain vanilla JS. But if I could sum it up, I think React provides the following for web developers:
Well, I'm no professional web developer, so anyone really with an interest really. But beyond coders, I think two groups of people might be interested in picking up React:
Well, let's hope I keep this learning up. Ta-ta for now, see you around.
I'm thinking an article on node and npm next would be useful. I did not know about these before I started.
Find more ReactJS stories on my blog. Have a suggestion? Contact me at [email protected].
