Kit inicial básico para sites estáticos baseado em Gatsby.js.
Comece a desenvolver.
Navegue até o diretório do seu novo site e inicie-o.
cd my-site/
gatsby developAbra o código-fonte e comece a editar!
Seu site agora está rodando em http://localhost:8000 !
Observação: você também verá um segundo link: http://localhost:8000/___graphql . Esta é uma ferramenta que você pode usar para experimentar a consulta de seus dados. Saiba mais sobre como usar esta ferramenta no tutorial Gatsby.
Abra o diretório my-site no editor de código de sua preferência e edite src/pages/index.js . Salve suas alterações e o navegador será atualizado em tempo real!
Uma rápida olhada nos arquivos e diretórios de nível superior que você verá em um projeto Gatsby.
.
├── node_modules
├── src
├── .gitignore
├── .prettierrc
├── gatsby-browser.js
├── gatsby-config.js
├── gatsby-node.js
├── gatsby-ssr.js
├── LICENSE
├── package-lock.json
├── package.json
├── README.md
└── yarn.lock
/node_modules : Este diretório contém todos os módulos de código dos quais seu projeto depende (pacotes npm) que são instalados automaticamente.
/src : Este diretório conterá todo o código relacionado ao que você verá no front-end do seu site (o que você vê no navegador), como o cabeçalho do seu site ou um modelo de página. src é uma convenção para “código fonte”.
.gitignore : Este arquivo informa ao git quais arquivos ele não deve rastrear/para os quais não deve manter um histórico de versão.
.prettierrc : Este é um arquivo de configuração do Prettier. Prettier é uma ferramenta para ajudar a manter a formatação do seu código consistente.
gatsby-browser.js : Este arquivo é onde Gatsby espera encontrar qualquer uso das APIs do navegador Gatsby (se houver). Eles permitem a personalização/extensão das configurações padrão do Gatsby que afetam o navegador.
gatsby-config.js : Este é o arquivo de configuração principal de um site Gatsby. É aqui que você pode especificar informações sobre o seu site (metadados), como o título e a descrição do site, quais plug-ins Gatsby você gostaria de incluir, etc.
gatsby-node.js : Este arquivo é onde Gatsby espera encontrar qualquer uso das APIs do Gatsby Node (se houver). Eles permitem a personalização/extensão das configurações padrão do Gatsby que afetam partes do processo de construção do site.
gatsby-ssr.js : Este arquivo é onde Gatsby espera encontrar qualquer uso das APIs de renderização do lado do servidor Gatsby (se houver). Eles permitem a personalização das configurações padrão do Gatsby que afetam a renderização do lado do servidor.
LICENSE : Gatsby é licenciado sob a licença do MIT.
package-lock.json (veja package.json abaixo, primeiro). Este é um arquivo gerado automaticamente com base nas versões exatas das dependências do npm que foram instaladas para o seu projeto. (Você não alterará este arquivo diretamente).
package.json : um arquivo de manifesto para projetos Node.js, que inclui itens como metadados (nome do projeto, autor, etc.). Este manifesto é como o npm sabe quais pacotes instalar para o seu projeto.
README.md : um arquivo de texto contendo informações de referência úteis sobre o seu projeto.
yarn.lock : Yarn é um gerenciador de pacotes alternativo ao npm. Você pode usar o fio ou o npm, embora todos os documentos do Gatsby façam referência ao npm. Este arquivo tem essencialmente a mesma finalidade que package-lock.json , apenas para um sistema de gerenciamento de pacotes diferente.
Para implantação, você pode usar o Gitlab CI. No projeto há dois arquivos - sample .gitlab-ci.yml e para S3 deploy .gitlab-ci-s3.yml .