React

Question 1

What is React?

Answer 1

a JavaScript library for building user interfaces

Question 2

What is a React element?

Answer 2

it’s an Object

Question 3

How do you mount a React element to the DOM?

Answer 3

with the render method of the ReactDOM object

Question 4

What is Babel?

Answer 4

Babel is a JavaScript compiler that rewrites 2015+ JavaScript to earlier versions

Question 5

What is a plug-in?

Answer 5

a plug-in is a piece of software that adds a specific feature to an existing computer program. enabling plug-ins enables customization

Question 6

What is a Webpack loader?

Answer 6

transformations that are applied to the source code of a module. allows you to pre-process files as you import or load them such as converting TypeScript to JavaScript

Question 7

How can you make Babel and Webpack work together?

Answer 7

babel-loader

Question 8

What is JSX?

Answer 8

JSX is a syntax extension for JavaScript. Syntactic sugar for React

Question 9

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

Answer 9

because JSX produces React objects

Question 10

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

Answer 10

babel loader

Question 11

What is a React component?

Answer 11

A React component is a function in React

Question 12

How do you define a function component in React?

Answer 12

function keyword
Component name (CAPITALIZED)
option (props) parameter
return React elements

Question 13

How do you mount a component to the DOM?

Answer 13

you assign the return to a variable and then call the render method of the root object. passing the variable as an argument

Question 14

What are props in React?

Answer 14

props are Objects and serve as parameters that we can pass to Components

Question 15

How do you pass props to a component?

Answer 15

you would “call” your component followed by your prop with a value assigned to it

Question 16

How do you write JavaScript expressions in JSX?

Answer 16

use {curly braces}

Question 17

How do you create “class” component in React?

Answer 17

class ClassName extends React.Component
a mandatory render() method

Question 18

How do you access props in a class component?

Answer 18

this

Question 19

What is the purpose of state in React?

Answer 19

state gives some control to Class Components. it allows us to do things based off of what the current state is. like view swapping

state is a data model
keeping track of variables that change over time

Question 20

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

Answer 20

you pass it as a props to a React element

and pass a callback

Question 21

What are controlled components?

Answer 21

a React component that renders a form and also controls what happens in that form on user input

Question 22

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

Answer 22

a prop for that input’s value

an onChange event

Question 23

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

Answer 23

the map() method

Question 24

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

Answer 24

a string that uniquely identifies a list item among its siblings or an ID from data keys