For a brief history lesson for those who do not know, React was founded by Facebook software engineer Jordan Walke in 2013, and will continually have more recent and stable versions of React as long as time continues or until nobody cares about React anymore. Of course, I do strongly believe that React will stay strong within the development game for a long time, with Vue.JS gradually gaining traction and popularity right behind React. It recently got its updated version on November 19th of this year.
Let's proceed to the main topic of the day, what do I think of React so far? As I have been learning how to code throughout these past few months, I got a lot of people telling me I should learn React, Vue.JS, Angular, etc., so in essence, one answer too many that left me confused. So I referred to the course that I am taking, which is the Codingphase course, which has a timeline section, and it said to do React. If you haven't read my thoughts on the Codingphase course, I highly recommend that you do after reading this article. So the main thing with React is components, which you write within a JavaScript file. What ultimately threw me off at first is that you leave your HTML file empty, except linking your sources (CSS files, JS Files, Fonts, etc.), because you will be writing your HTML inside the JS files.
Here is an example of how you write your HTML inside the JS file whilst using react:
import React, { Component } from 'react'
import ReactDOM from 'react-dom'
render () {
<div className="hello">
<h1> Hi there! I am considered a component in React.JS!</h1>
</div>
<img src="kirbywave.jpg" />
const app = document.getElementbyId('app')
ReactDOM.render(<App />, app)
That is what an it looks like writing a component in React.JS. Just make sure that you import your React and ReactDOM files and on the bottom of the files, making a const where your Id tag would be in your HTML file and making sure that your DOM renders. The NICE thing is that you do not need to worry about writing your CSS/SCSS in a JS file, because that will stay in its original file. If you take a quick look at the div where className is written, you will not be writing class in your HTML. The reason for this is because class is already a thing in JavaScript and it would confuse the JS file if I recall correctly, if I am wrong about this, please comment and let me know. So instead, we use className and it works just like class in HTML. You can also use <div id="hello"> inside the JS file which is an extremely convenient thing because it won't act out when you set up the id and not give you errors.
I told you the basic history of React, I've shown you an example, and now for my thoughts on it so far. I think it's pretty cool. I was incredibly intimidated by it first because I thought that I was going to be bombarded with complications, but once I've learned how React works, I wasn't so scared any more. Let us also count the fact that it is a JavaScript Framework and if you have some understanding of the fundamentals of JavaScript, your understanding will evolve into a whole different level and you will start becoming better.
I would like to thank you, the reader, for your patience when it comes to me writing blogs and getting them out. My life is pretty hectic and I do the best that I can. If you enjoyed this blog, please share it. Thank you and have a wonderful day.