hnrchrdl

const App = () => {
  const [counter, setCounter] = useState(0);
  const [aboveFive, setAboveFive] = useState(false);

  const increment = useCallback(() => {
    setCounter(n => n + 1);
  }, []);

  useEffect(() => {
    if (counter > 5) {

hnrchrdl

const App = () => {
  const [counter, setCounter] = useState(0);
  const [aboveFive, setAboveFive] = useState(false);

  const increment = () => {
    setCounter(n => n + 1);
  };

  useEffect(() => {
    if (counter > 5) {

hnrchrdl

const Child = React.memo(
  ({ isAboveFive, children }) => {
    console.log("child renders");
    return (
      <>
        <h2>Child: {!isAboveFive ? "<= 5" : "> 5"}</h2>
        {children}
      </>
    );
  },

hnrchrdl

const App = () => {
  const [counter, setCounter] = useState(0);
  const [aboveFive, setAboveFive] = useState(false);

  const increment = () => {
    setCounter(n => n + 1);
  };

  useEffect(() => {
    if (counter > 5) {

hnrchrdl

const App = () => {
  const [counter, setCounter] = useState(0);
  const [aboveFive, setAboveFive] = useState(false);

  const increment = () => {
    setCounter(n => n + 1);
  };

  useEffect(() => {
    if (counter > 5) {

hnrchrdl

const Child = React.memo(({ isAboveFive, children }) => {
  console.log("child renders");
  return (
    <>
      <h2>Child: {!isAboveFive ? "<= 5" : "> 5"}</h2>
      {children}
    </>
  );
});

hnrchrdl

shouldComponentUpdate(prevProps) {
  return prevProps.isAboveFive !== this.props.isAboveFive;
}

hnrchrdl

const App = () => {
  const [counter, setCounter] = useState(0);
  const [aboveFive, setAboveFive] = useState(false);

  const increment = () => {
    setCounter(n => n + 1);
  };

  useEffect(() => {
    if (counter > 5) {

hnrchrdl

=== install deps ===
sudo apt update
sudo apt install zsh fonts-powerline wget git

=== change default shell ===
chsh -s /bin/zsh

=== (optional) verify installation ===
which zsh -> 'usr/bin/zsh'
echo $SHELL -> 'usr/bin/zsh'

hnrchrdl

1. Install enzyme and enzyme react adapter

yarn add -D enzyme enzyme-react-adapter-react-16

2. Create a file for test setup

Create a file src/setupTests.js. It will automatically get picked up by create-react-app. In this file, put code to run before Tests. for example, to configure enzyme, put this in: