Closed github-learning-lab[bot] closed 4 years ago
:white_check_mark::white_check_mark::x::x::x:
:white_check_mark: Code compilation
:white_check_mark: Use a breadcrumb
:x: You didn't use a product-identifier.product
:x: You didn't use and define a flex-layout.row
in the right col with sku-selector
and product-quantity
:x: There isn't a shipping-simulator
on the right column
:white_check_mark::white_check_mark::x::x::white_check_mark:
:white_check_mark: Code compilation
:white_check_mark: Use a breadcrumb
:x: You didn't use a product-identifier.product
:x: You didn't use and define a flex-layout.row
in the right col with sku-selector
and product-quantity
:white_check_mark: Define a shipping simulator in the right column
:x::white_check_mark::white_check_mark::white_check_mark::white_check_mark:
:x: There's something wrong with your product.jsonc
file
:white_check_mark: Use a breadcrumb
:white_check_mark: Used a product identifier
:white_check_mark: Create a row inside the right col with quantity and sku selectors
:white_check_mark: Define a shipping simulator in the right column
:white_check_mark::white_check_mark::x::white_check_mark::white_check_mark:
:white_check_mark: Code compilation
:white_check_mark: Use a breadcrumb
:x: You didn't use a product-identifier.product
:white_check_mark: Create a row inside the right col with quantity and sku selectors
:white_check_mark: Define a shipping simulator in the right column
:white_check_mark::white_check_mark::x::white_check_mark::white_check_mark:
:white_check_mark: Code compilation
:white_check_mark: Use a breadcrumb
:x: You didn't use a product-identifier.product
:white_check_mark: Create a row inside the right col with quantity and sku selectors
:white_check_mark: Define a shipping simulator in the right column
:white_check_mark::white_check_mark::white_check_mark::white_check_mark::white_check_mark:
:white_check_mark: Code compilation :white_check_mark: Use a breadcrumb :white_check_mark: Used a product identifier :white_check_mark: Create a row inside the right col with quantity and sku selectors :white_check_mark: Define a shipping simulator in the right column
Evoluindo sua página de produto (pdp)
:sparkles: Branch: pdp2
Introdução
No último passo aprendemos como fazer uma página de produto simples com seus itens mínimos, mas sabemos que o que fizemos está longe de ser uma página de produto ideal, colocaremos outros elementos que vemos com frequência nas páginas de produto de várias lojas.
Mais de 30 blocos de produto
Na nossa documentação é possível encontrar mais 30 blocos relacionados a produto. No começo do curso falamos sobre Shelf e seus blocos relacionados, além de na última seção termos visto outros 4 blocos. Neste passo veremos mais 4:
É importante que ao fim do curso, você tome um tempo para explorar nossos componentes, bem como as possibilidades de customização que se tem com estes.
Atividade
Evolua a página de produto adicionando os outros 4 blocos listados acima da seguinte forma no arquivo
product.jsonc
:breadcrumb
logo no início antes da linha principal do produto;product-identifier.product
logo abaixo doproduct-name
;sku-selector
e oproduct-quantity
como children;shipping-simulator
logo abaixo da linha com o SKU Selector e o Product Quantity:information_source: Lembre-se de acessar a documentação do Breadcrumb, Product Identifier, Product Quantity e SKU Selector caso tenha alguma dúvida durante a atividade.
:no_entry_sign: Perdido?
Há algum problema com esse passo? Que tal nos enviar um feedback? :pray:
Criar feedback
Se ainda tiver dúvida sobre como enviar sua resposta, você pode rever aqui.