React ?'s

Question 1

React uses virtual DOM, what is it?

Answer 1

it updates the dom faster, updates the jsx elements if needed, manipulation is very easy

Question 2

What is React?

Answer 2

front end javascript library

follows component based approach

Question 3

What are the features of React?

Answer 3

uses virtual dom, server side rendering

Question 4

advantages or React?

Answer 4

increases app performance, used on client and server side, JSX makes code easy to read

Question 5

disadvantages?

Answer 5

just a library, not a framework, library is very large

Question 6

what is JSX?

Answer 6

JavaScript XML, combination of JS and HTML template syntax

Question 7

What is the virtual dom?

Answer 7

a copy of the real dom. creates a node tree out of react components. It is re-rendered, and whatever has changes is what gets updated in the dom.

Question 8

Why can’t browsers read JSX?

Answer 8

Need to transform JSX into a jS object using something like babel, then pass into browser.

Question 9

ES5 v ES6?

Answer 9

var react = require('react')
import React from "react"

Question 10

What is a component?

Answer 10

Components split up entire react UI into smaller separate pieces. Update without affecting rest of UI.

Question 11

What is the purpose of Render?

Answer 11

Render is mandatory. Returns a single react component that is a representation of the native dom component.

Question 12

What are props?

Answer 12

Read only components that are passed down from parent to child. Help maintain uni-directional data flow and used to render dynamic data.

Question 13

What is state and how is it used?

Answer 13

source of data in react. Keep track of what changes in a component.

Question 14

difference between state and props?

Answer 14

props get passed to the component (similar to function parameters) whereas state is managed within the component (similar to variables declared within a function).

Question 15

how to update state?

Answer 15

this.setState or useState hook

Question 16

what are arrow functions?

Answer 16

Used to bind context of components, useful when working with higher order functions

Question 17

What is the intial rendering phase? (react component lifecycle?)

Answer 17

Phase when the component is about to start its journey and make its way up to the DOM

Question 18

What is the updating phase (react component lifecycle?)

Answer 18

Once the component is added to DOM, it can potentially re redner only when a prop/state change occurs.

Question 19

What is unmounting phase? (react component lifecycle?)

Answer 19

This is the final phase of a component’s life cycle in which the component is destroyed and removed from the DOM

Question 20

Explain lifecycle methods in detail

Answer 20

componentWillMount() – Executed just before rendering takes place both on the client as well as server-side.
componentDidMount() – Executed on the client side only after the first render.
componentWillReceiveProps() – Invoked as soon as the props are received from the parent class and before another render is called.
shouldComponentUpdate() – Returns true or false value based on certain conditions. If you want your component to update, return true else return false. By default, it returns false.
componentWillUpdate() – Called just before rendering takes place in the DOM.
componentDidUpdate() – Called immediately after rendering takes place.
componentWillUnmount() – Called after the component is unmounted from the DOM. It is used to clear up the memory spaces.

Question 21

What is an Event in react?

Answer 21

events are triggered with user action, like click or submit.

Question 22

What are synthetic events in React?

Answer 22

combine behavior of different browsers into one API so they behave the same on different browsers

Question 23

What are refs?

Answer 23

provide a way to access dom notes or react elements created in render method.

Question 24

When should you use refs?

Answer 24

Managing text selection, media playback. Triggering animations, or adding third-party dom libraries.

Question 25

How to modularize code?

Answer 25

Import and export statements

Question 26

How to create a form?

Answer 26

Similar to how to create one in HTML. But need functions that account for change in values and add to state. ex) handleChange

Question 27

Controlled v uncontrolled components?

Answer 27

controlled components do not maintain state, uncontrolled do. Controlled’s data is by parent component, while uncontrolled is by DOM.

Question 28

What are pure components?

Answer 28

Simplest components that can be written. Replace any component that has only a render, enhance simplicity of code.

Question 29

What are the significance of keys?

Answer 29

Keys are used to identify unique dom elements. used when sorting through an array.