Show Menu
Cheatography
  1. Home >
  2. Programming >

React Cheat Sheet Cheat Sheet (DRAFT) by

A React v16 cheat sheet that list out the common and frequent usage

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Basic Usage

// Import React and ReactDOM
import React from 'react'
import ReactDOM from 'react-dom'

ReactDOM.render(
   <h1>Hello, world</h1>,
   document.getElementById('root')
);

Functional Component

// Functional Component
// Component should be capatialise
const Welcome = () => { 
  return <h1>Welcome to the React World!!!</h1>
}

// Component that receives props
const SayHello = (props) => {
  return <p>Hello {props.name}</p>
}

const Display = () => {
  <div>
    <Welcome />
    <SayHello name="John" />
  </div>
}

ReactDOM.render(
  <Display />,
  document.getElementById('root')
);