Organização dos arquivos

Como os arquivos da pasta do projeto estão organizados.

O desenvolvedor de loja Vnda customiza uma loja utilizando um dos Templates Vnda. Os arquivos desses templates estão na pasta do projeto. Essa pasta contém os arquivos que compõem o template da loja, e é importante que o time de desenvolvimento saiba como os esses arquivos são estruturados e organizados. Esse tutorial explica organização dos arquivos da pasta do projeto.

De maneira geral os arquivos do projeto estão divididos de acordo com as linguagens e componentizações adotadas. Essa divisão facilita a implementação da loja: reutilizando de trechos de código, padronização e legibilidade do código.

Para conferir os arquivos abra a pasta do projeto no seu editor de código. Na tabela abaixo está descrito as principais pastas e a função de cada uma.

Arquivo/SubpastaConteúdoFunção na vitrine
assetsPasta com os códigos em linguagem Sass (Syntactically Awesome Style Sheets), JavaScript e as imagens e fontes estáticas utilizadas no projeto.Possui os recursos externos que os templates de página podem utilizam (como imagens, folhas de estilo e JavaScripts).
liquidsPasta com os códigos em linguagem Liquid (linguagem criada pela Shopify e escrita em Ruby).Contém os arquivos que estruturam o layout da vitrine de loja.
package.jsonArquivo JSON (JavaScript Object Notation)É responsável por deixar disponíveis os comandos do ambiente de trabalho e gerenciar as dependências externas do projeto.

🚧

Atente-se para o termo "template"

  • Quando estamos citando o modelo padrão de template de Vnda utilizamos o termo Template; e quando utilizamos os termos _templates _de página ou _template _de página, estamos referindo aos arquivos de template de cada página.
  • Os arquivos de template de cada página (_templates _de página) são os códigos que estruturam o layout de cada página da sua vitrine, e estão armazenados no diretório liquids do seu projeto.

No vídeo abaixo, explicamos mais detalhadamente como funciona a organização base dos arquivos dos templates.