React Hook e Styled-Components.

Boa noite!!

Eu fiquei com dúvidas nos "Para saber mais."

Tivemos o que falava sobre o React Hook e o do Styled-Components.

Eu gostaria de saber se há como visualiza-los funcionando em nossa aplicação para melhor entendimento e visualização!

Segue o código deles.

Obrigado!

Contador

import React, { useState } from 'react';

function ContaClicks() { //React Hook - Never used

    const [contador, setContador] = useState(0);
    return (
        <div>
            <p> Você clicou x vezes </p>
            <button onclick={() => setContador(contador + 1)}> clicar </button>
        </div>
    )
}

Styled-Component

const Button = styled.button`
  background: transparent;
  border-radius: 3px;
  border: 2px solid palevioletred;
  color: palevioletred;
  margin: 0.5em 1em;
  padding: 0.25em 1em;

  ${props => props.primary && css`
    background: palevioletred;
    color: white;
  `}
`;

const Container = styled.div`
  text-align: center;
`
  //MÉTODO RENDER

  render(
    <Container>
      <Button>Normal Button</Button>
      <Button primary>Primary Button</Button>
    </Container>
  );