REACT

Question 1

What is React?

Answer 1

A JavaScript library for building user interfaces

Question 2

What is a React element?

Answer 2

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.

Question 3

How do you mount a React element to the DOM?

Answer 3

by rendering it / ReactDOM.render(var you want to render , where you want to render it)

Question 4

What is Babel?

Answer 4

Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments.

Question 5

What is a Plug-in?

Answer 5

is a software component that adds a specific feature to an existing computer program. When a program supports plug-ins, it enables customization.[1]

Question 6

What is a Webpack loader?

Answer 6

Loaders are transformations that are applied to the source code of a module. They allow you to pre-process files as you import or “load” them. Thus, loaders are kind of like “tasks” in other build tools and provide a powerful way to handle front-end build steps.

Question 7

How can you make Babel and Webpack work together?

Answer 7

you’ll need to add the babel-loader to the list of modules

Question 8

What is JSX?

Answer 8

syntax extension for JS and it makes React elements / implementing react components in JS that look like HTML

Question 9

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

Answer 9

JSX is just sugar for createElement without react you cant use createElement

Question 10

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

Answer 10

in a webpack config file add a module rule to load jsx files by using the babel loader and give the babel loader the plugin to transform react

Question 11

What is a React component?

Answer 11

Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. Conceptually, components are like JavaScript functions.

Question 12

How do you define a function component in React?

Answer 12

This function is a valid React component because it accepts a single “props” (which stands for properties) object argument with data and returns a React element. We call such components “function components” because they are literally JavaScript functions.

Question 13

How do you mount a component to the DOM?

Answer 13

ReactDOM.render(what,where)

Question 14

What are props in React?

Answer 14

they are properties / arbitrary inputs /arguments passed into react components

Question 15

How do you pass props to a component?

Answer 15

by having the prop name = to

Question 16

How do you create “class” component in React?

Answer 16

class name of class extends React.Component then have a method with what you want to return

Question 17

How do you access props in a class component?

Answer 17

by using this.props

Question 18

What is the purpose of state in React?

Answer 18

to represent info about a components current situation

Question 19

How to you pass an event handler to a React element?

Answer 19

by passing a function

Question 20

What are controlled components?

Answer 20

An input form element whose value is controlled by React / React component that renders a form also controls what happens in that form on subsequent user input.

Question 21

What two props must you pass to an input for it to be “controlled”?

Answer 21

this.state.value and onChange(callback to handle input)

Question 22

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

Answer 22

map

Question 23

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

Answer 23

use a string that uniquely identifies a list item among its siblings OR an ID

Question 24

When does React call a component’s componentDidMount method?

Answer 24

immediately after a component is mounted (inserted into the tree)

Question 25

Name three React.Component lifecycle methods.

Answer 25

componentDidUpdate, componentDidMount(), componentDidUnmount

Question 26

How do you pass data to a child component?

Answer 26

through props