Skip to main content

Explorar a arquitetura de referência da Storefront Reference Architecture do Commerce Cloud

Objetivos de aprendizagem

Após concluir esta unidade, você estará apto a:

  • Explicar as vantagens de usar a Storefront Reference Architecture (SFRA) do Commerce Cloud.
  • Explicar por que uma arquitetura de referência fornece um plano para design de sites.
  • Listar dois componentes técnicos e UX da SFRA.
  • Listar duas vantagens de priorizar dispositivos móveis.

O que é a SFRA?

Existe maneira melhor de mostrar como é um site de loja (virtual) do que construir um que você possa visualizar e usar como base de código? Foi exatamente o que fizemos com a SFRA. Mas essa arquitetura é mais do que apenas uma base de código. Ela fornece o plano para design de sites.

Usar uma arquitetura de referência tem tudo a ver com inovação rápida! Crie sites mais rapidamente com uma biblioteca completa de recursos essenciais do site desenvolvidos com as melhores práticas do setor. Centenas de recursos prontos para uso incluem carrinho, checkout, página inicial, páginas de detalhes do produto e muito mais. Além disso, adote rapidamente tecnologias como o Apple Pay de modo a proporcionar aos seus compradores uma experiência incrível.

O modelo de personalização da SFRA facilita a criação, manutenção e atualização da sua loja (virtual). Ele fica fora da camada de API da plataforma e usa uma arquitetura MVC (Modelo-Visão-Controlador) convencional. Falamos sobre APIs e a arquitetura MVC na unidade do ambiente de desenvolvimento do Salesforce B2C Commerce.

Os desenvolvedores têm liberdade para personalizar e estender a base de código da SFRA. As marcas são capacitadas a projetar sites perfeitos nos mínimos detalhes e desenvolver meticulosamente experiências exclusivas da Web. Os desenvolvedores trazem novos códigos, integram-se com provedores de terceiros e iteram em seus designs de site. Como resultado, os comerciantes são proprietários exclusivos da sua loja (virtual) e da base de código subjacente.

Pessoa usando um dispositivo móvel

Design que prioriza dispositivos móveis

Historicamente, a maioria dos web designers se concentrava no computador primeiro, deixando os dispositivos móveis para segundo plano. Mesmo com design responsivo, o foco começava no computador, com código adicional para dispositivos móveis.

O design responsivo adapta o que está na tela com base no tamanho da tela.

O dispositivo móvel não é uma tendência. É o presente. Cada vez mais pessoas usam dispositivos móveis para fazer todos o tipo de coisas, especialmente compras online. Segurar um computador na mão é uma coisa poderosa.

Os designs que priorizam dispositivos móveis começam pelas telas menores e depois vão subindo de nível. É uma das melhores estratégias para criar um design responsivo ou adaptativo.

O design adaptativo detecta o dispositivo e outros recursos e, em seguida, fornece o recurso e o layout adequados com base em um conjunto predefinido de tamanhos de visor e outras características.

Vamos falar de arquitetura

Uma arquitetura de referência serve como ponto de partida para o design online da loja (virtual) e combina as melhores práticas em design de sites e arquitetura de loja (virtual). Ela lhe fornece um plano para criar e personalizar suas lojas (virtuais) de comércio eletrônico.

Página de destino da Storefront Reference Architecture do Commerce Cloud

A Storefront Reference Architecture (SFRA) do Commerce Cloud usa controladores JavaScript. No B2C Commerce, os controladores são scripts do lado do servidor que lidam com solicitações de lojas (virtuais). Eles gerenciam o fluxo de controle no aplicativo e criam instâncias de modelos e visualizações para processar cada solicitação de loja (virtual) e gerar uma resposta adequada. Por exemplo, o comprador clica em um item do menu de categoria ou insere um termo de pesquisa, que aciona um controlador que renderiza uma página.

Nota

Os controladores são gravados no script do JavaScript e do B2C Commerce. Eles devem estar em conformidade com o padrão do módulo CommonJS.

A SFRA facilita a segmentação de códigos entregues pelo B2C Commerce, personalizações de comerciantes e código de integração de terceiros em cartridges discretos – facilitando a manutenção e atualização do conteúdo de cada cartridge.

No B2C Commerce, um cartridge contém códigos ou dados. Isso significa que os desenvolvedores podem criar novos componentes, por exemplo, recursos como lista de desejos, Apple Pay e integrações de pagamentos e conectá-los independentemente na loja (virtual). Esta arquitetura permite uma base de código leve e mais limpa para design de sites contínuo, iterativo e evolutivo. O código principal não está disponível para edição, mas os desenvolvedores são livres para desenvolver funcionalidade sobre ele.

Práticas recomendadas de desenvolvimento de interface do usuário

A SFRA usa a popular biblioteca de interface do usuário de componentes front-end Bootstrap. Bootstrap é um kit de ferramentas de código aberto para desenvolver com HTML, CSS e JS. Ele permite que você rapidamente crie um protótipo de suas ideias ou construa todo o seu aplicativo com suas variáveis e mixins Sass, sistema de grade responsiva, componentes extensos predefinidos e plug-ins poderosos criados no jQuery.

Outras informações importantes

Os comerciantes aproveitam a SFRA se estiverem iniciando novas implementações do site ou reprojetando uma loja (virtual) existente. Os comerciantes normalmente reprojetam sua loja (virtual) a cada 3 a 5 anos, e, como um novo design do site pode ser intensivo em recursos, os comerciantes devem pesar seu cronograma em relação às implicações orçamentárias, de escopo e de negócios. Para colocá-lo no caminho certo, a SFRA vem com delineados anotados. Há também grupos de usuários dos quais você pode tirar proveito.

A equipe de prática de varejo do B2C Commerce pode fornecer consultas de design de lojas (virtuais) para ajudar os comerciantes a otimizar sua loja (virtual) existente ou fazer a mudança para algo novo.

Próximas etapas

Exploramos os detalhes da SFRA do Commerce Cloud. Agora é hora de aprender sobre objetos comerciais do B2C Commerce.

Continue a aprender de graça!
Inscreva-se em uma conta para continuar.
O que você ganha com isso?
  • Receba recomendações personalizadas para suas metas de carreira
  • Pratique suas habilidades com desafios práticos e testes
  • Monitore e compartilhe seu progresso com os empregadores
  • Conecte-se a orientação e oportunidades de carreira