# Astro Nano stores

import DocButton from '~/components/webkit/DocButton.vue';
import SectionBasicContent from '~/components/SectionBasicContent/SectionBasicContent.vue';
import Container from '~/components/webkit/Container.vue';

<SectionBasicContent
  description="O template Astro com Nano Stores demonstra o suporte nativo do Astro a nanostores para fornecer um estado compartilhado entre componentes de qualquer framework. Ele mostra como implementar um gerenciamento de estado leve e agnóstico de framework, que funciona de forma integrada entre diferentes bibliotecas de UI sem comprometer a performance. Implantado na Azion, ele é servido por meio de uma arquitetura distribuída para uma entrega rápida e distribuída globalmente."
  buttons={[
    { label: "Deploy template", link: "https://console.azion.com/create/astro/astro-with-nanostores", outlined: false, icon: "ai ai-azion", iconPos: "left" },
    { label: "Ver demo", link: "https://tqxc7pjft3.map.azionedge.net/", severity: "secondary" }
  ]}
>
  <Fragment slot="content">
    <div style="flex: 1; min-width: 300px;">
      | Item | Detalhes |
      |:----------|:------|
      | Repositório | [Azion Samples](https://github.com/aziontech/azion-samples/tree/dev/templates/astro/astro-with-nanostores) |
      | Framework | [Astro](/pt-br/documentacao/produtos/devtools/azion-edge-runtime/compatibilidade-frameworks/astro/) |
      | Caso de uso | E-commerce|
    </div>
    <div style="display: flex; justify-content: center; align-items: center; flex: 1;">
      <img src="/assets/docs/images/uploads/template-showcase/astro/astro-nanostores.png" width="400" alt="Astro markdown with shiki" style="min-width: 100%; max-width: 100%; height: auto;" />
    </div>
  </Fragment>
</SectionBasicContent>

## Sobre este template

Este template é construído com [Astro](/pt-br/documentacao/produtos/devtools/azion-edge-runtime/compatibilidade-frameworks/astro/) e integra o Nano Stores, uma biblioteca minúscula de gerenciamento de estado que mantém os dados sincronizados entre componentes escritos em qualquer framework. É uma ótima opção para recursos interativos como carrinhos de compras, em que o mesmo estado precisa ser compartilhado entre ilhas distintas. Implantado na Azion, ele é servido por meio de uma arquitetura distribuída para uma entrega rápida e distribuída globalmente.

## Principais recursos

- Estado compartilhado e agnóstico de framework com o Nano Stores
- Footprint mínimo em runtime, mantendo os bundles do cliente reduzidos
- Stores reativas que permanecem sincronizadas entre ilhas independentes do Astro
- Entrega otimizada para o edge pela Azion, com baixa latência em todo o mundo