[Dúvida] Duvida export.

Olá bom diaa :) Sempre que criarmos um componente, para podermos utilizá-lo iremos precisar exportá-lo e fazer o import onde vamos precisar usar.

Podemos exportar um componente de duas formas: como export default ou export comum.

Vou mostrar dois exemplos:

const Titulo = () => { 
    return (
        <h1>Olá!</h1>
    )
}

export default Titulo;

Estamos exportando esse componente como padrão, default. Para importar num outro local, fazemos:

import Titulo from ".. caminho do arquivo aqui ";

Ao importar um export default, não precisa de chaves. Cada arquivo só pode ter um único export default.

Outra forma de fazer isso é:

export const Titulo = () => { 
    return (
        <h1>Olá!</h1>
    )
}

Estamos criando o componente e já adicionando o export. Podem ter vários desses num mesmo arquivo.

Ao importar você deve fazer: import { Titulo } from ".. caminho do arquivo aqui"

Precisa usar as chaves ao importar esse tipo de export.

Agora a questão do index é o seguinte: Se você criar uma pasta Header, por exemplo, e dentro um arquivo Header.jsx que é o componente em si, ao importar você vai precisar passar todo o caminho incluindo o Header.jsx do final. Algo assim:

"../componentes/Header/Header.jsx";

Ao invés disso, é um padrão criar uma pasta Header e o componente em si ser chamado index.jsx. Ao fazer isso, podemos reduzir o caminho da importação, mantendo apenas: "../componentes/Header"

Pois ele já compreende que o que estamos buscando é o index.jsx.

Agora, independente de você criar este componente chamando ele de Header.jsx ou index.jsx você precisará exportar (seja default ou padrão) e importar onde você for utilizar.

Espero que tenha dado para compreender!