React

Question 1

What is React?

Answer 1

a front end js framework

Question 2

What is a React element?

Answer 2

an html element created by react

Question 3

What is JSX?

Answer 3

Fundamentally, JSX just provides syntactic sugar for the React.createElement(component, props, …children) function. The JSX code:

Question 4

Why must the React object be imported when authoring JSX in a module?

Answer 4

Since JSX compiles into calls to React.createElement, the React library must also always be in scope from your JSX code.

For example, both of the imports are necessary in this code, even though React and CustomButton are not directly referenced from JavaScript:

Question 5

How can you make Webpack and Babel work together to convert JSX into valid JavaScript?

Answer 5

babel loader with jsx plugin

Question 6

What is a React component?

Answer 6

class that returns a react element

Question 7

How do you mount a component to the DOM?

Answer 7

ReactDOM.render()

Question 8

What are props in React?

Answer 8

“Props” is a special keyword in React, which stands for properties and is being used for passing data from one component to another. Furthermore, props data is read-only, which means that data coming from the parent should not be changed by child components.

object argument with data

Question 9

How do you pass props to a component?

Answer 9

When React sees an element representing a user-defined component, it passes JSX attributes and children to this component as a single object. We call this object “props”.

Question 10

How do you write JavaScript expressions in JSX?

Answer 10

wrap it in curly braces

Question 11

How do you create “class” component in React?

Answer 11

class keyword, name, render method

Question 12

How do you access props in a class component?

Answer 12

this keyword

Question 13

What Array method is commonly used to create a list of React elements?

Answer 13

map()

Question 14

What is the best value to use as a “key” prop when rendering lists?

Answer 14

an id value from the data model

Question 15

When does React call a component’s componentDidMount method?

Answer 15

componentDidMount() is invoked immediately after a component is mounted (inserted into the tree). Initialization that requires DOM nodes should go here. If you need to load data from a remote endpoint, this is a good place to instantiate the network request.

Question 16

Name three React.Component lifecycle methods.

Answer 16

These methods are called in the following order when an instance of a component is being created and inserted into the DOM:

constructor()
static getDerivedStateFromProps()
render()
componentDidMount()
componentDidUpdate()
componentDidUnmount()

Question 17

How do you pass data to a child component?

Answer 17

props