Lista de verificação de práticas recomendadas pré-compilação e de ativação

Bem-vindo ao início da sua jornada do Storefront Composable! Esta lista de verificação resume os principais pontos que podem ter um grande impacto na linha do tempo do seu projeto. Ao se concentrar nessas quatro práticas recomendadas, você estará mais bem equipado para navegar pelas complexidades da criação, lançamento e monitoramento de um site bem-sucedido do Progressive Web App (PWA) Kit e evitar armadilhas comuns. Use esta lista de verificação para planejar uma implantação tranquila e bem-sucedida!

Salvo indicação em contrário, todos os pontos desta lista de verificação se aplicam a sites criados 100% no Storefront Composable ou em lançamento headless em fases.

Você está no banco do motorista quando se trata de personalização. Entenda o escopo da personalização necessária para atender às suas necessidades de negócios. Lembre-se, um site altamente personalizado requer mais esforço, como descrito nestes exemplos.

  • Familiarize-se com o design e as funcionalidades disponíveis em nosso Retail React App. Você precisa criar qualquer funcionalidade que não esteja disponível no Retail React App.
  • Use os componentes existentes do React tanto quanto possível. O PWA Kit usa o React, para que você tenha acesso ao ecossistema de componentes do React. Se você estiver fazendo algo personalizado, veja se há um componente de Chakra para isso. Se não houver, procure uma versão de código aberto. Se não houver uma versão de código aberto, compile o componente você mesmo.
  • Verifique se nossas APIs oferecem suporte à funcionalidade personalizada necessária e retorne os dados que precisa. Se nossas APIs não oferecerem, você poderá:
    • Criar uma API personalizada para retornar os dados; ou
    • Estender a resposta da API usando um gancho
  • Confirme se os cartridges e as integrações do seu site funcionam com uma implementação headless. Para usá-los em um site PWA Kit, você pode expor suas funcionalidades usando APIs personalizadas ou ganchos.

Estabeleça uma base sólida para um site estável e escalável seguindo estas etapas.

  • Decida quantos ambientes de Managed Runtime (MRT) de Production você terá. Ter mais ambientes lhe dá mais controle. Porém, quanto mais ambientes você tem, mais complicado operacionalmente é gerenciar todos eles. Por exemplo, se você tiver cinco marcas que são atendidas no mesmo ambiente MRT, sempre precisará atualizá-las juntas. Ter menos ambientes significa menos sobrecarga operacional. Consulte Visão geral do Managed Runtime.
  • Decida se deseja usar nossa rede de distribuição de conteúdo incorporada (eCDN) ou uma CDN de terceiros. Consulte Quando usar uma CDN de terceiros Se você decidir usar uma CDN de terceiros, consulte a documentação do fornecedor para obter detalhes.
  • Decida sua estratégia de URL. A maioria dos clientes opta por manter seus URLs existentes. Faça um plano para redirecionar qualquer um dos seus URLs atuais que não existirão no seu novo site. Inscreva-se nas ferramentas do Google Search Console ou em outras ferramentas de classificação para monitorar o efeito de sua implantação na classificação de SEO. Consulte Routing (Roteamento).
  • Decida sobre as metas, o escopo e o cronograma para sua implementação (headlesss em fases) híbrida. Lembre-se de que quanto mais tempo seu site estiver no modo híbrido, mais tempo você terá que gastar com a complexidade operacional envolvida. Defina uma data final para a transição para um site 100% Composable. Consulte Implementações headless em fases..

Aplique essas técnicas para otimizar a eficiência e a experiência do usuário do seu site.

  • Revise a renderização no lado do servidor de páginas de entrada (página inicial, páginas de listagem de categoria, páginas de listagem de produtos e páginas de detalhes do produto) anexando o parâmetro ?__server_only aos seus URLs. Confirme se as páginas renderizadas pelo servidor têm dados suficientes para rastreadores e se a mudança de layout entre servidor e cliente é pequena (idealmente inexistente). Isso pode ajudar a melhorar sua classificação de SEO, confirmar que suas páginas de entrada podem ser carregadas rapidamente em dispositivos móveis e melhorar a experiência do comprador.
  • Configure testes de desempenho usando o Lighthouse CI. Inicie o teste de desempenho na metade de sua implementação. Isso permite que você identifique e corrija quaisquer regressões de desempenho (em comparação com seu site atual) muito antes do lançamento do site PWA Kit.
  • Configure a implantação contínua de implantação de código em um ambiente MRT que não seja de produção. Desde o início do trabalho de desenvolvimento, comece a testar o código implantado no MRT para confirmar se a funcionalidade do site funciona conforme o esperado. Dessa forma, você pode evitar um retrabalho dispendioso mais tarde. Consulte Usuários de automação.

Planeje usar qualquer uma dessas ferramentas para monitorar consistentemente o desempenho do seu site. Verifique também se os dados gerados por essas ferramentas estão corretos com base nos resultados esperados.

  • Com Log Center, você pode revisar erros e métricas. Configure notificações para que você possa descobrir quando sua loja (virtual) está funcionando anormalmente e investigar.
  • Use o Active Data para monitorar as métricas do seu site. Isso pode lhe ajudar a analisar o comportamento do comprador para que você possa melhorar a experiência do comprador e otimizar as ofertas de produtos para impulsionar o crescimento das vendas.
  • Os Reports & Dashboards do B2C Commerce fornecem dados que você pode usar para identificar tendências ao longo do tempo e tomar decisões de negócios mais inteligentes com base em seus dados do B2C Commerce.

Analise o restante do fluxo de trabalho de desenvolvedor recomendado para criar um site no Composable Storefront. Consulte Como começar no Composable Storefront