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 describes what you want to see on the screen

Question 3

how do you mount a React element to the DOM?

Answer 3

ReactDOM.render(element, container[, callback])

Question 4

what is babel?

Answer 4

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

Question 5

what is a plug-in?

Answer 5

a software component that adds a specific feature to an existing computer program, enabling customization

Question 6

what is a webpack loader?

Answer 6

loaders are transformations that are applied to the source code of a module

Question 7

how can you make babel and webpack work together?

Answer 7

npm install babel loader

Question 8

what is JSX?

Answer 8

a syntax extension to JavaScript

Question 9

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

Answer 9

JSX pulls from React

Question 10

how can you make webpack and babel work together to convert JSX into valid JS?

Answer 10

npm install babel loader babel/plugin-transform-react-jsx react react-dom

Question 11

what is a React component?

Answer 11

function and/or class that returns React elements

conceptually are like JS functions. they accept arbitrary inputs (called “props”) and return React elements describing what should appear on the screen

Question 12

how do you define a function component in React?

Answer 12

capital first letter of function name

writes like a JS function

Question 13

how do you mount a component to the DOM?

Answer 13

ReactDOM.render(element, container)

Question 14

what are props in React?

Answer 14

Properties, are objects

Question 15

How do you pass props to a component?

Answer 15

use properties as a parameter and embed as expression

Question 16

how do you write JS expressions in JSX?

Answer 16

within { }

Question 17

how do you create “class” components in React?

Answer 17

Class declaration
capital first letter of class name
extends “React.Component”
render()

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 is a JS object that stores a component’s dynamic data and determines the component’s behavior

keep track of values of status of things at different points in time

Question 20

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

Answer 20

as a prop, the prop starts with “on”, and event name is in camelCase