Configuração inicial do tema

1. Para começar, instale primeiro todos os pacotes necessários com npm install ou pnpm install e depois execute um build inicial para conferir se a configuração funciona, com npm run build ou pnpm build.
2. Copie o build do Pagefind (usado na busca do site) para que ele fique disponível no ambiente de desenvolvimento. Isso varia conforme o seu sistema operacional. Criei alguns comandos para ajudar.
   • No Windows, execute npm run winsearch
   • No OSX ou Linux, execute npm run osxsearch
3. Em seguida, configure o i18n do seu site (um idioma ou vários). Basta executar o comando npm run docs:config-i18n e seguir as instruções do script para deixar tudo pronto!
4. Agora é só ajustar o site do jeito que você quiser!

Introduções ao código

Criei alguns tours de código para apresentar a base de código a você. Você vai precisar da extensão Code Tour para visualizá-los no VSCode ou em outra IDE.

Estrutura do código

O código está organizado com a maior parte dos itens no diretório src/docs. Isso facilita copiar essa pasta inteira para um projeto existente e adicionar a funcionalidade de documentação em poucos minutos.

Opções de configuração

A configuração geral do site fica na pasta src/docs/config/. A maioria das definições fica dentro de pastas individuais por idioma, para facilitar o trabalho com traduções.

Configurações do site

O arquivo src/docs/config/siteSettings.json.ts é usado para configurar as definições do site. Entre elas estão coisas como ativar ou não as transições de visualização, ativar ou não as animações e mostrar ou não os botões de copiar link nos títulos da documentação.

Dados do site

O arquivo src/docs/config/[language]/siteData.json.ts é usado para configurar os dados do site. Isso inclui coisas como o título do site, a descrição, os links de redes sociais e a imagem padrão.

Dados de navegação

Configure os dados de navegação da barra superior no arquivo src/docs/config/[language]/navData.json.ts.

Layout da barra lateral

Configure a ordem das seções da sua documentação no arquivo src/docs/config/[language]/sidebarNavData.json.ts.

Robots

Para que robôs como o do Google enxerguem o sitemap correto, edite o arquivo public/robots.txt para usar o domínio do seu site.

Mais recursos

Informações gerais sobre o Astro

O Astro procura arquivos .astro ou .md no diretório src/pages/. Cada página é exposta como uma rota baseada no nome do arquivo.

Não há nada de especial em src/components/, mas é ali que gostamos de colocar qualquer componente Astro/React/Vue/Svelte/Preact.

Qualquer recurso estático, como imagens, pode ser colocado no diretório public/. Também uso com frequência src/assets para imagens quando trabalho com os assets do Astro para otimização de imagens.

Comandos

Todos os comandos são executados na raiz do projeto, a partir de um terminal:

Comando	Ação
npm install	Instala as dependências
npm run dev	Inicia o servidor de desenvolvimento local em localhost:4321
npm run build	Gera o site de produção em ./dist/
npm run preview	Visualiza seu build localmente, antes do deploy
npm run astro ...	Executa comandos de CLI como astro add, astro check
npm run astro -- --help	Obtém ajuda sobre o uso da CLI do Astro

Quer saber mais?

Fique à vontade para consultar a documentação ou entrar no servidor do Discord.