BreeJax / ReactAssignmentsSDG

1 stars 0 forks source link

Assignment 8 - What do you know? What don't you know? #8

Open lizthrilla opened 5 years ago

lizthrilla commented 5 years ago

Your homework for this week is to look over the follow questions and answer them as best you can. Don't worry if you don't know something, you can look it up or leave it blank. We have gone over everything on this list, so nothing should be absolutely brand new.

  1. What is React?
  2. How would you set up a React app? (basic structure and boilerplate)
  3. What are the two types of components you can create in React?
  4. Why would you choose one over the other?
  5. What is the virtual DOM?
  6. What is JSX? Why can't the browser read JSX? How do you get it to read it?
  7. Explain props.
  8. Explain state.
  9. Compare and contrast a stateless component and a stateful component.
  10. Explain the component lifecycle.
  11. What is an event in React?
  12. What are hooks?

Next week we will go over React Router!

BreeJax commented 5 years ago

1. What is React? React is a front end JS framework (a way to make customizable HTML components)

2. How would you set up a React app? (basic structure and boilerplate) create-react-app, kill a lot of the boilerplate, create a components folder

3. What are the two types of components you can create in React? State Vs. Stateless Smart Vs. Dumb

Class Vs Functional is different but worth mentioning. Class is the original, whereas functional is where the calling state as const comes in.

4. Why would you choose one over the other?

depends on if you need changes or not. A good stateless component to talk about would typically be a nav bar.

5. What is the virtual DOM? a thing that is created every time you create a react app in order to only update a component and not the entire site/dom 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

6. What is JSX? Why can't the browser read JSX? How do you get it to read it? JSX is a preprocessor step that adds XML syntax to JavaScript. You can definitely use React without JSX but JSX makes React a lot more elegant Just like XML, JSX tags have a tag name, attributes, and children. If an attribute value is enclosed in quotes, the value is a string. Otherwise, wrap the value in braces and the value is the enclosed JavaScript expression.

The other option being typescript

7. Explain props. props === properties passed into the component they come from above refs and children are the props included. ref and children- references exactly where in the source tree it pops into the dom

Props are Read-Only props should not change

8. Explain state. State is an object that is owned by the component where it is declared. Its scope is limited to the current component. The state of the parent component usually ends up being props of the child components.

9. Compare and contrast a stateless component and a stateful component.

see answer to question three 10. Explain the component lifecycle. https://blog.bitsrc.io/react-16-lifecycle-methods-how-and-when-to-use-them-f4ad31fb2282

11. What is an event in React?

a get/post/a change made by the user

12. What are hooks? functions instead of classes. provide a more direct API to react concepts such as props, state, context, refs and lifecycle. means you don't need a constructor for state