Como visualizar alterações em um site ou projeto em tempo real usando o Visual Studio Code e o Live Server

Essa dica irá aumentar muito a sua produtividade no momento em que estiver desenvolvendo o seu site/projeto e quiser ver as alterações em tempo real

Como visualizar alterações em um site ou projeto em tempo real usando o Visual Studio Code e o Live Server

Essa dica irá aumentar muito a sua produtividade no momento em que estiver desenvolvendo o seu site/projeto e quiser ver as alterações em tempo real, sem a necessidade de ficar atualizando a página do navegador o tempo todo.

Então sem mais enrolações, vamos lá…

Instalação

  • Abra o gerenciador de Extensões do Visual Studio Code;
  • Pesquise por: Live Server;
  • Clique em: Install;
  • Aguarde o processo de instalação e se necessário for reinicie o VSCode;

Execução

  • Abra a pasta do seu projeto;
  • Na barra inferior do software selecione a opção: Go Live

Pronto!

O seu navegador padrão será executado automaticamente e qualquer alteração no seu projeto será visualizada em tempo real.

Foto de Matheus Costa
Escrito por

Matheus Costa

UX/UI Designer & Dev Front-end

Especialista em UX/UI Design e Desenvolvimento Front-end em São José do Rio Preto/SP. Criação de sites de alta conversão, soluções digitais orientadas a SEO e performance.