Configuração do ambiente

Version: 1.0.0
  • Leia o guia em Comece agora para entender os conceitos base e a ferramenta de admin da deco

  • Importante, é possível acessar nosso Discord para reportar dúvidas ou problemas com a deco.cx. Participe também da nossa comunidade!

Tópicos

  1. Tecnologias utilizadas na deco
  2. Comece a desenvolver com a deco
  3. Desenvolvendo com a deco

Tecnologias utilizadas na deco

Ao criar um site ou loja online com a deco.cx, o usuário tem a flexibilidade de criar Sections e Loaders que atendem às suas necessidades exclusivas. Para ajudá-la a criar esses componentes com facilidade e rapidez, contamos com um conjunto de tecnologias poderosas e eficientes.

Nossa pilha de tecnologia é focada em simplicidade e desempenho, tornando-a acessível a desenvolvedores com experiência anterior em HTML, CSS, JavaScript e React. Estas são as principais ferramentas que usamos para alimentar os sites deco.cx:

Preact

Preact é uma alternativa rápida e leve ao React.js, usado para renderizar componentes de UI no servidor e no cliente. Ele usa JSX para criar componentes da web e geralmente é bem simples de aprender.

Tailwind

Tailwind é uma solução de estilos CSS baseada em classes utilitárias, o que o torna ideal para iniciantes. O Tailwind também é otimizado para performance.

Deno

O Deno é um ambiente de execução JavaScript e TypeScript. É usado para fazer Sites na deco, escritos em Typescript, executados por um servidor. Deno é semelhante a Node.js (curiosidade: eles foram criados pela mesma pessoa).

Fresh

O Fresh é um framework web fullstack (backend e frontend) para desenvolvedores JavaScript e TypeScript. Foi projetado para tornar fácil a criação de aplicações web de alta qualidade, alta performance e altamente personalizáveis.

Comece a desenvolver com a deco

Ferramentas necessárias

A única configuração necessária para codificar sites deco.cx é instalar o Deno em sua máquina. Para instalar o Deno, siga as instruções na página deno.land.

Certifique-se de manter o deno atualizado! Caso já tenha o deno instalado, rode o deno upgrade para atualizá-lo.

Recomendamos fortemente o uso do Visual Studio Code como IDE e do Git para controle de versão.

1. Crie um site deco.cx

Siga o tutorial de Criar um Site Deco.

2. Clone o repositório do seu site

Aceite o convite para se juntar ao repositório criado para o seu Site. Esse convite é enviado para o endereço de e-mail do seu perfil do Github.

Caso não tenha utilizado uma conta do github para entrar no admin ou caso não tenha recebido um convite, é possível adicionar uma conta do github como colaborador do Site na aba Configurações do site no Admin.

Adicionando colaborador no repositório

Use o comando git clone para baixar o código do site para o seu máquina. Recomendamos o uso de SSH. Abra o terminal e execute o comando:

git clone git@github.com:deco-sites/site-name.git

Lembre-se de alterar site-name para o nome do seu site.

Se preferir, é possível clonar o repositório usando outros métodos, como git https, por meio da ferramenta Github ou através de uma IDE. Na página do repositório no Github há detalhes sobre algumas diferentes maneiras para fazer o clone.

3. Executar servidor local

Para rodar seu site localmente, editar e ver as mudanças no Admin, você precisa ter um ambiente local (um ambiente com localhost como host). Para isso, você pode usar o ambiente localhost criado por padrão ou criar um novo.

3.1 Crie um novo ambiente

Abra a aba de Releases e clique no botão Novo ambiente no Admin.

Criar novo ambiente

3.2 Defina o nome e o host do seu ambiente

Escolha um nome para o seu ambiente e defina seu host como localhost.

Definindo nome e host do ambiente

3.3 Execute seu site localmente

Copie o comando mostrado depois da criação do ambiente e cole-o no seu terminal na pasta do site.

Comando de iniciar server

Iniciando server no terminal

Aguarde a inicialização do projeto. Na primeira execução, o deno irá baixar e realizar um cache das dependências do projeto, e a deco irá preparar detalhes do site.

O site estará acessível em https://{nome-do-ambiente}--{nome-do-site}.deco.site.

Caso o código de alguma seção em uso na página inicial do site seja alterado, isto será refletido no endereço acima.

3.4 Publicando alterações

Considerando que você escolheu o Deco Hosting para o deploy de seu site, o processo de deploy em development é muito simples: apenas fazer um git push das alterações na branch main.

Você também pode publicar seu ambiente no próprio Admin clicando no botão de Publicar agora, na página do seu ambiente.

Publicar mudanças

Agora você pode começar a criar sites cada vez mais do seu jeito! :)

Continue estando a deco para entender o potencial e como criar ou alterar sections, loaders e outros elementos da deco para criar sites e experiências cada vez ,mais personalizadas.

Certifique-se de se juntar ao nosso comunidade no Discord. Acompanhe as novidades e continue evoluindo junto com a gente!

Was this page helpful?
Can't find what you're looking for? Spot an error in the documentation? Get in touch with us on our Community Forum
Continue reading