React Flashcards
What are props in React?
props are arguments that are passed into react components
How do you pass props to a component?
…
How do you write JavaScript expressions in JSX?
by using {}
How can you make Webpack and Babel work together to convert JSX into valid JavaScript?
By adding the @babel/plugin-transform-react-jsx to babel loader.
Why must the React object be imported when authoring JSX in a module?
because JSX is an extension of React. JSX compiles into react. Specifically React.createElement();
What is JSX?
JSX is a syntax extension for describing what a UI should look like in React.
How can you make Babel and Webpack work together?
By installing the babel loader and add it as a plugin to Webpack in a webpack config file.
What is a Webpack loader?
Loaders are transformations that are applied to the source code of a module.
What is a Plug-in?
A software component that adds a specific feature to an already existing program
What is Babel?
Babel is a toolchain that is mainly used for converting ECMAScript 2015+ code into a backwards compatible version of JavaScript
How do you mount a React element to the DOM?
By calling render method the the ReactDom object and passing it two arguments, the elements and the root DOM node.
What is a React element?
A React element is a plain object that the ReactDOM translates into a DOM object
What is React?
React is a JavaScript framework for building user interfaces
What kind of modules can Webpack support?
ECMAScript, CommonJS, and AMD modules
How do you execute Webpack with npm run?
by running the npm run build command. build is an npm script that bundles the modules into a main.js file.
What is an NPM script?
A script in the package .json file that is used to automate repetitive tasks.
How do you add a devDependency to a package?
By including the –save-dev command when installing an npm package.
What is Webpack?
webpack is a static module bundler for modern JavaScript applications.
How do you create “class” component in React?
class keyword, class name, extend keyword, React.components, and then declaration block.
How do you access props in a class component?
this.props
What is the purpose of state in React?
State is like our data model for react elements. It sets an initial value and that value cane be changed at a later time, and react will then render the element based on its current condition
How to you pass an event handler to a React element?
By adding it as a prop
What Array method is commonly used to create a list of React elements?
map method
What is the best value to use as a “key” prop when rendering lists?
A string that uniquely identifies a list item among its siblings.
What are controlled components?
A controlled component is a form component who’s state is managed by react.
What two props must you pass to an input for it to be “controlled”?
onChange and onSubmit
When does React call a component’s componentDidMount method?
After it runs the render() method
Name three React.Component lifecycle methods.
componentDidMount, componentDidUpdate, componentWillUnwmount
How do you pass data to a child component?
via props
