Skip to content
Português
Voltar ao diretório

gatsbyjs.com

200 OK

Gatsby conecta sites React a conteúdo estruturado e renderização flexível

Developer ToolsGoogle Analytics

Tecnologia detectada

A detecção informa sinais públicos visíveis e não consegue listar serviços privados.

Google Analytics

A detecção informa sinais públicos visíveis e não consegue listar serviços privados.

A detecção informa sinais públicos visíveis e não consegue listar serviços privados.

A arquitetura pública documentada do Gatsby

Gatsby é desenvolvido em torno de React e ferramentas Node.js. Desenvolvedores escrevem componentes React, enquanto Gatsby coordena obtenção de dados, consultas GraphQL, criação de páginas, processamento de recursos, empacotamento e o comportamento de renderização selecionado.

Isso descreve a arquitetura do framework documentada para projetos Gatsby. Não infere os sistemas privados de hospedagem, serviços internos ou topologia operacional por trás de gatsbyjs.com.

Blocos fundamentais

Camada Função documentada publicamente
React Fornece componentes, JSX, estado e interação no lado do navegador.
APIs do Gatsby Conectam configuração, obtenção de dados, criação de nós, criação de páginas e trabalho do ciclo de vida de renderização.
Camada de dados Normaliza registros obtidos como nós e os expõe por meio de um esquema GraphQL.
Plugins de origem Importam conteúdo de arquivos, sistemas de conteúdo, APIs e serviços.
GraphQL Seleciona campos obtidos para páginas e componentes no fluxo de dados do Gatsby.
Renderização Oferece suporte a SSG, DSG, SSR por meio de getServerData e rotas no lado do cliente.
Ecossistema de plugins Adiciona fontes, transformações, tratamento de imagens, estilos, análises e outras integrações.

Do conteúdo à página

  1. Um plugin de origem recupera ou lê o conteúdo.
  2. Gatsby cria nós e constrói seu esquema de dados.
  3. Uma consulta de página solicita os campos necessários.
  4. Um modelo React renderiza o conteúdo consultado.
  5. Gatsby produz ou fornece a página de acordo com seu modo de renderização.

Páginas estáticas são geradas durante o build. Páginas adiadas são postergadas até sua primeira solicitação em uma infraestrutura compatível. Páginas SSR executam lógica no momento da solicitação por meio de getServerData. Rotas no lado do cliente reservam caminhos selecionados para o comportamento da aplicação no navegador.

A arquitetura não garante um tempo de build, velocidade de página ou resultado de busca específico. Esses resultados dependem da latência das fontes, da quantidade de nós e páginas, do design das consultas, das imagens, do JavaScript, do cache, da hospedagem e da própria implementação.

Continue exploring

More published records in Developer Tools.

View all alternatives

Como o Astro transforma conteúdo em HTML e adiciona interação de forma seletiva

Developer ToolsTailwind CSS

O Next.js traz roteamento, renderização e recursos de servidor ao React

Developer ToolsGoogle AnalyticsNext.js

nuxt.com

200 OK

Crie sites e aplicações Vue com roteamento, lógica de servidor e renderização flexível

Developer ToolsNuxtVercel