Componentes do Cliente no Framework NextJS

Agora vamos converter nosso componente de servidor em um componente do cliente. Para isso, escreva a diretiva 'use client' no início do arquivo do componente:

src/app/test/page.jsx'use client';

export default function Test() {
  return <h1>Olá, usuário!</h1>;
}

Agora teremos acesso aos estados, criados via useState. Vamos criar um estado como exemplo e exibir seu conteúdo no markup:

src/app/test/page.jsx'use client';

import { useState } from 'react';

export default function Test() {
  let [name, setName] = useState('usuário');
  return <h1>Olá, {name}!</h1>;
}