I’ve Cracked the Code, Please Call Tech Support- Episode 24: The Forms Unleashed
React! It’s a lot. A lot a lot. But it’s coming together. I do wish there was more beginner documentation, but learning some languages comes down to putting it into practice over and over.
- Discuss in words something that you learned in class today or this week.
We learned about using setState within react in order to manipulate elements of the DOM, which is going to be handy moving forward. With state, we can tell the code “ok, these are the current conditions. If that changes, here’s what you do”.
2. Why/when would you use a class-based component vs a functional component.
This is where state comes in, again. With a class based component, you can set the state. With a functional component you cannot.
3. What is create-react-app?
When entering this in the terminal (after downloading the appropriate package, of course) this allows us to quickly create a default React application, that we can then edit.
4. What are the differences between a class component and a functional component?
We covered this a little earlier, so let’s go into more detail.
A functional component is just a JavaScript function that accepts properties as arguments and returns a React element. There is no render method, and they do not use a State.
A class component requires that we extend from React and create a function to render our element. These use a state (as we discussed above), and React lifestyle methods can be used inside these components.
5. What is JSX?
As per W3Schools, JSX stands for JavaScript XML. Basically, this allows us to write (or at least makes it easier to write) HTML within React.
6. How does React work?
Originally built by developers at Facebook, React is a JavaScript Library that uses a virtual DOM to update what the user sees on the front end far more quickly and efficiently than vanilla JavaScript and HTML alone.
7. How does the virtual DOM work in React?
As per GeeksForGeeks, the virtual DOM is a representation of the JavaScript DOM tree. So, after writing a quick object, the React DOM will automatically take care of updating the DOM to match your object.
8. Which (if there is) node library method could you use to solve the algorithm you solved last night in your pre-homework?
With the React library, setState is the best tool in the box, for my money. Since the pre-homework was a TicTacToe app, setState allows us to know what is going on with the various aspects of our game (such as which person’s turn it is).
9. What’s the difference between an element and a component in React?
A React element is an object that describes a DOM node, it’s attributes, and the properties that you give it. No methods can be applied to it.
A component, on the other hand is either a class or function that can accept an input and return a React element.
