Start of JavaScript 411 Class

This week I started my 4th class with @AustinCodingAcademy. JS411 which pulls together items I have learned in my first 3 classes. We are learning React in JSnode. React was/is developed by Facebook and it was developed to help render webpages in a more efficient and quicker manner. React keeps a copy or “state” of your webpage and only updates the states that change. This is a very powerful tool to have scalable web apps.

Here are some questions we were asked this week.

1. Why/when would you use a class-based component vs a functional component? When using React go with functional if your component only takes in and renders some props. This will keep it simple. If the component needs more functionality, like keeping state, use classes instead.
2. What is create-react-app? Create React App is a comfortable environment for learning React, and is the best way to start building a new single-page application in React. It sets up your development environment so that you can use the latest JavaScript features, provides a nice developer experience, and optimizes your app for production.
3. What are the differences between a class component and a functional component? A functional component is just a plain JavaScript function that accepts props as an argument and returns a React element. A class component requires you to extend from React. Component and create a render function which returns a React element. There is no render method used in functional components.
4. What is JSX? JSX stands for JavaScript XML. JSX allows us to write HTML in React. JSX makes it easier to write and add HTML in React.
5. How does React work? React isa library for building user interfaces. It’s not a mega framework. It’s not a full-stack solution that’s going to handle everything from the database to real-time updates over web socket connections. React is divided into two major APIs. First, there’s the React DOM which is a virtual DOM. This is the API that’s used to perform the actual rendering on a web page. Second, there’s the React component API. These are the parts of the page that are actually rendered by React DOM.
6. How does the virtual DOM work in React? Like the actual DOM, the Virtual DOM is a node tree that lists elements and their attributes and content as objects and properties. React’s render() method creates a node tree from React components and updates this tree in response to mutations in the data model, caused by actions.
7. Which (if there is) node library method could you use to solve the algorithm problem you solved last night in your pre-homework? I am not sure which problem this question refers to, but programming problems are not that much different from mathematics or physics problems. There are usually an input and an output to which someone needs to arrive by providing an algorithm. This algorithm is typically a function or series of functions. A library that I have worked with to help solve different algorithms is algorithmia.js.
8. What’s the difference between an element and a component in React? A React Element is what gets returned from components. It’s an object that virtually describes the DOM nodes that a component represents. With a function component, this element is the object that the function returns.

Originally published at https://medium.com on November 11, 2020.