CSS-in-JS no reemplaza los estilos CSS. Solo es una forma de trabajar comodamente CSS con componentes.

Formas de escribir CSS

• CSS normal

  Permite definir la apariencia de los elementos HTML con un archivo .css y linkeandolo al archivo HTML.

• Preprocesadores y postprocesadores de CSS

  Como Sass o PostCSS, permiten escribir código CSS de manera más eficiente y rápida, y agregar nuevas funcionalidades.

• Componentes y CSS-in-JS

  Nos permite escribir estilos en JavaScript y aplicarlos directamente a los componentes.

Ejemplo

• Este código es un ejemplo sencillo de un estilo CSS.

  h2 {
  	color: white;
  	font-size: 60px;
  }
  

• Y este sería usando CSS-in-JS en componentes.

  const Title = styled.h2`
  	color: white;
  `;
  

  const Title = styled.h2`
  	color: white;
  `;
  
  <Title> ¡Título! </Title>
  <Title> ¡Título 2! </Title>