Basic over view Flashcards
What are Components ?
Basically JavaScript classes with a state and a render
What does a class look like
Class Name { state: {}; render () {} }
What is the render( ) { }
Method to a react element
What is a react element
a plan Java script obj that maps to DOM element
How many DOM are there
Virtual DOM and real Dom, children must be kept in order
Where is the root container held
In the index.html file
What extends app.js ?
extends by Component at built in Java Script class
How to write app class
Class App extends Component {render() { returns JSX;
}}
What is babel
A modern java script compiler
how to make a bisc react element
const element = <> </>;
Import React from ‘react’; which is the module and obj
React obj ‘react’ is module
2 obj that must be imported
React
ReactDOM
What is hot module reloading, t
This is where react uses babbel to to compile JavaScript objects directly on the fly
What are the two arguments in react Dom
Element, document get Element by ID
Shortcut for import react component
I MRC
Shortcut for class components
CC
How to rap to html elements togeather
React.Fragment
State is an object and what does it hold ?
properties
What is an expression
Javascript the expression references the state or function object using this keyword
Example of object destructuring
const { count } = this.state;
How to write if for state count
return count === 0 ? “Zero” : count;
How to render a list of tags [ ]
this.state.tags.map(
(tag) => (<li key={tag}>{tag}</li>
What is setting attributes
className = / styles
If && operator is applied second True is printed out
True && “ hi”
When is undefined declared as an error ?
When “ this “ is outside of an object. this refers to the Method inside an object.
Why write an arrow function
Due to event handlers are out of scope
What does an arrow function look like
handleIncreament = () => {
console.log(“clicked”);
this.setState({ count: this.state.count + 1 });
};
How to use map function
[ ].map to each obj => ()
What does every react component have
props
Components can or cannot modify own state?
The component that owns a piece of the state should be the one modifying it
What is the difference between state and properties ?
state is local to that component, props are not.
how to make a button
button.btn.btn-danger.btn-sm.m-2
