React Flashcards

1
Q

What is a React element?

A
  • A React Component is a template. A blueprint. A global definition. This can be either a function or a class (with a render function).
  • 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. With a class component, the element is the object that the component’s render function returns.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is Babel?

A

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. Here are the main things Babel can do for you: Transform syntax.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What is a Plug-in?

A

In computing, a plug-in (or plugin, add-in, addin, add-on, or addon) is a software component that adds a specific feature to an existing computer program.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What is a Webpack loader?

A

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. Loaders can transform files from a different language (like TypeScript) to JavaScript or load inline images as data URLs.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

How do Babel and Webpack work together?

A

If Babel is a translator for JS, you can think of Webpack as a mega-multi-translator that works with all kinds of languages (or assets). For example, Webpack often runs Babel as one of its jobs. Another example, Webpack can collect all your inline CSS styles in your Javascript files and bundle them into one.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

How do you mount a React element to the DOM?

A

To render a React element, first pass the DOM element to ReactDOM.createRoot() , then pass the React element to root.render() : const root = ReactDOM.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is JSX?

A

JSX is a React extension to the JavaScript language syntax which provides a way to structure component rendering using syntax familiar to many developers. It is similar in appearance to HTML.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is a React component?

A

Components are independent and reusable bits of code. They serve the same purpose as JavaScript functions, but work in isolation and return HTML. Components come in two types, Class components and Function components, in this tutorial we will concentrate on Function components.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

How do you define a function component in React?

A

The simplest way to define a component is to write a JavaScript function

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What are props in React?

A

“Props” is a special keyword in React, which stands for properties and is being used for passing data from one component to another. But the important part here is that data with props are being passed in a uni-directional flow.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

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

A

map()

The map() method creates a new array populated with the results of calling a provided function on every element in the calling array.

const array1 = [1, 4, 9, 16];
const map1 = array1.map(x => x * 2);

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What are controlled components?

A

Controlled components in React are those in which form data is handled by the component’s state. Forms are used to store information in a document section. The information from this form is typically sent to a server to perform an action.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly