React

Question 1

What is a React element?

Answer 1

React element is an object that’s describes DOM node.

Question 2

What is Babel?

Answer 2

Babel is a tool(complier) to convert ECMAScript 2015 code into a backwards compatible version.

Question 3

What is a Plug-in?

Answer 3

Plug-in is a software that ads specific feature to an existing computer program

Question 4

What is a Webpack loader?

Answer 4

Webpack loader is a plugin which transforms source code of module.

Question 5

How can you make Babel and Webpack work together?

Answer 5

By using loader as plugin in webpack config.js (babel loader)

Question 6

What is JSX?

Answer 6

It’s XML style extension to JavaScript language

Question 7

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

Answer 7

It needs to be available so we can call method on it.
This refers to - import React from ‘react’

Question 8

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

Answer 8

To convert JSX into valid JavaScript we use plugin react jsx.

Question 9

How do you mount a component to the DOM?

Answer 9

Adding is as a first parameter into ReactDOM.render method, second is DOM element where to mount it.

Question 10

What are props in React?

Answer 10

Props in React are objects. Props are arguments pass to React components.

Question 11

How do you pass props to a component?

Answer 11

We pass props to a component as key:value -> name=”Max”

Question 12

How do you write JavaScript expressions in JSX?

Answer 12

Between curly bracers

Question 13

How do you create “class” component in React?

Answer 13

Using keyword class MyComponent extends React.Component{ return () { content }}

Question 14

How do you access props in a class component?

Answer 14

using this.props

Question 15

What is the purpose of state in React?

Answer 15

It’s like data model, when you update it react change website

Question 16

How you pass an event handler to a React element?

Answer 16

you pass event handler as a prop

Question 17

What are controlled components?

Answer 17

Input elements that are controlled by react

Question 18

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

Answer 18

value and onChange

Question 19

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

Answer 19

Map method

Question 20

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

Answer 20

Whatever is unique should be use as a key, (id)

Question 21

When does React call a component’s componentDidMount method?

Answer 21

Immediately after first render (inserted into DOM tree

Question 22

Name three React.Component lifecycle methods.

Answer 22

ComponentDidMount, ComponentDidUpdate, render, constructor

Question 23

How do you pass data to a child component?

Answer 23

As a props, from main component

Question 24

What are React Hooks?

Answer 24

React Hooks are functions. Let as use state and other features in the functional components.