Skip to content

301-read_2.md

Latest commit

 

History

History
58 lines (32 loc) · 2.66 KB

301-read_2.md

File metadata and controls

58 lines (32 loc) · 2.66 KB

React Lifecycle

Based off the diagram, what happens first, the ‘render’ or the ‘componentDidMount’?

When an instance of a component is being created and inserted into the DOM it occurs during the mounting phase. Constructor, static getDerivedStateFromProps, render, componentDidMount, and UNSAFE_componentWillMount all occur in this order during mounting.

So 'render' happens first.

What is the very first thing to happen in the lifecycle of React?

The Constructor in the Mounting Phase.

Put the following things in the order that they happen: componentDidMount, render, constructor, componentWillUnmount, React Updates.

1. constructor.
2. render.
3. componentDidMount.
4. React Updates.
5. componentWillUnmount.

What does componentDidMount do?

This method is invoked immediately after a component is mounted. If you need to load anything using a network request or initialize the DOM, it should go here. This method is a good place to set up any subscriptions. If you do that, don’t forget to unsubscribe in componentWillUnmount().

React Bootsrap

- Why React-Bootstrap?

React-Bootstrap is a complete re-implementation of the Bootstrap components using React. It has no dependency on either bootstrap.js or jQuery. If you have React setup and React-Bootstrap installed, you have everything you need.

Methods and events using jQuery is done imperatively by directly manipulating the DOM. In contrast, React uses updates to the state to update the virtual DOM. In this way, React-Bootstrap provides a more reliable solution by incorporating Bootstrap functionality into React's virtual DOM. Below are a few examples of how React-Bootstrap components differ from Bootstrap.

- Installation

The best way to consume React-Bootstrap is via the npm package which you can install with npm (or yarn if you prefer).

If you plan on customizing the Bootstrap Sass files, or don't want to use a CDN for the stylesheet, it may be helpful to install vanilla Bootstrap as well.

npm install react-bootstrap@next bootstrap@5.0.2

React State Vs Props

What types of things can you pass in the props?

Whatever we want to render in the component. it's usually an initial value.

What is the big difference between props and state?

Props is passed into a Component.

State is handeled inside of the component.

When do we re-render our application?

Whene the state of a component changed.

What are some examples of things that we could store in state?

anything that interacts with something else like Forms(TextFild, PasswordField, Checkbox, List, ...) interacts with a user, and maybe a software interacts with another software.