Skip to content

Instantly share code, notes, and snippets.

@sentenza
Last active October 26, 2016 14:51
Show Gist options
  • Save sentenza/a1bc04c1a300ec2172bb582586b7eafe to your computer and use it in GitHub Desktop.
Save sentenza/a1bc04c1a300ec2172bb582586b7eafe to your computer and use it in GitHub Desktop.
All the information that really matters to learn and user ReactJS at glance

React logo

Fundamental concepts

  • JSX: Allows us to write HTML like syntax which gets transpiled to lightweight JavaScript objects, thus being much more concise than pure old JS
  • Virtual DOM: A JavaScript representation of the actual DOM
  • React.createClass(): The way in which you create a new component
  • render(): Each component has to have this method in order to be rendered
  • ReactDOM.render: Renders a React component to a DOM node.
  • state: The internal data store (object) of a component. Each component has the ability to manage its own state and pass its state down to child components if needed.
  • props: The data which is passed to the child component from the parent component
  • getInitialState(): The way in which you set the initial state of a component
  • setState(): A helper method for altering the state of a component
  • propTypes: Allows you to control the presence, or types of certain props passed to the child component.
  • getDefaultProps(): Allows you to set default props for your component.

Component LifeCycle

  • componentWillMount — Fired before the component will mount
  • componentDidMount — Fired after the component mounted
  • componentWillReceiveProps — Fired whenever there is a change to props
  • componentWillUnmount — Fired before the component will unmount

Events

  • onClick()
  • onSubmit()
  • onChange()

ReactJS tutorials

Start with ReactJS

Webpack

Useful resources

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment