Local Web Server | Usando o Chrome como servidor web local | Alternativa 2 | SW9
Olá a todos. Sejam bem-vindos ao Canal e Blog SW9 (http://blog.sw9.com.br).
#O que vimos na aula passada?
Na AULA passada, eu expliquei passo a passo como podemos configurar e usar um recurso nativo do navegador Google Chrome para transformá-lo em um poderoso servidor web local (Local Web Server), com a proposta de hospedar nossos projetos desenvolvidos em HTML, CSS e JS.
As perguntas a seguir foram respondidas nesta AULA: É possível criar um servidor web local de forma simples e rápida? Quais as formas de ativar um servidor web local usando o Google Chrome? Quais as principais características do recurso nativo do Google Chrome possui?
Você perdeu esta AULA? Não se preocupe, segue o link a seguir: [http://blog.sw9.com.br/2019/04/23/local-web-server-usando-o-chrome-como-servidor-web-local-1-sw9].
#O que veremos nesta aula?
O objetivo nesta AULA é explicar passo a passo como podemos configurar e usar uma extensão disponível para o navegador Google Chrome, que tem como função transformá-lo em um poderoso servidor web local (Local Web Server). Com este servidor web local instalado e configurado, será possível hospedar e publicar nossos projetos desenvolvidos em HTML, CSS e JS.
As perguntas a seguir serão respondidas nesta AULA: É possível criar um servidor web local de forma simples e rápida? Quais as formas de ativar um servidor web local usando o Google Chrome? Quais os principais recursos que esta extensão possui?
#É possível criar um servidor web local de forma simples e rápida?
A resposta é sim. É possível criar um servidor web local de forma simples e rápida, que nos permita hospedar páginas que usam a stack [HTML, CSS e JS].
Eu sei que vocês vão me dizer: Paulo, mas já existem várias soluções para isso, desde pacotes disponíveis no npm, recursos nativos incorporados a frameworks, etc. Sim, vocês estão corretos, mas o que quero compartilhar com vocês, é uma forma que conheci recentemente, e só precisamos do navegador Google Chrome para isso.
Usando apenas o navegador, será possível publicar suas páginas com o objetivo de testar, apresentar o projeto para alguém, etc.
Se você está gostando da AULA de hoje, não deixe de compartilhar com seus amigos usando as redes sociais de sua preferência.
#Quais as formas de ativar um servidor web local usando o Google Chrome?
Eu aprendi duas formas de usar o navegador Google Chrome como um servidor web local. Na primeira AULA, eu apresentei o recurso nativo incorporado do Chrome, e nesta AULA eu explico a segunda alternativa: usar uma extensão disponível no Chrome Web Store, que com poucas configurações, vai transformar seu navegador em um Local Web Server.
#Localizando e instalando a extensão
Para localizar a extensão, basta você entrar no Chrome Web Store e digitar [Web Server for Chrome]. Para facilitar as coisas, eu compartilho com vocês o link direto para instalar a extensão:
Com a página da extensão aberta, chegou a hora de instalá-la no seu navegador. O processo é bem simples e rápido, basta clicar no botão azul [Usar no Chrome], localizado no canto superior direito da página, aguardar alguns segundos e pronto 😀
Aguardem, que no vídeo explicarei passo a passo este procedimento e, na sequência, a configuração e recursos disponíveis nesta extensão.
#Quais os principais recursos disponíveis nesta extensão do Google Chrome?
Diferente do que vimos no recurso nativo, a extensão [Web Server for Chrome] abre uma página onde é possível configurar uma série de recursos, selecionar o diretório [DocumentoRoot] e um botão para iniciar/parar o servidor.
Seguem alguns recursos disponíveis nesta extensão:
1- Configuração de porta: por padrão, a extensão usa a url [http://localhost:porta] ao iniciar o servidor web local. Na opção de configuração de porta, é possível definir uma porta de sua preferência;
2- Opção [Accessible on local Network]: ativando esta opção, qualquer computador de sua rede pode acessar a url e o projeto publicado. Também existe a opção [Also on Internet], que vai exigir uma configuração adicional na rede para expor a nossa URL na internet;
3- Parar e iniciar o servidor web local: existe um botão do tipo toggle, que possibilita a ativação/desativação do servidor web local;
4- Exibir automaticamente a página index.html: ativando esta opção, o navegador vai tentar localizar a página index.html dentro do projeto publicado e renderizá-la automaticamente. Caso esta opção esteja desmarcada, ao digitar a url publicada, o navegador vai listar todos os arquivos e pastas existentes no [DocumentRoot];
5- Rodar em background: é possível configurar o servidor web local para permanecer rodando em background.
Também vale a pena vocês experimentarem algumas opções avançadas disponibilizadas por esta extensão, como por exemplo: [Allow File Upload], [Enable Mod-Rewrite], etc.
Legal né 😀
#O que veremos no vídeo de Hoje
Agora é o momento de aplicarmos, na prática, o que vimos na teoria.
Eu vou explicar todo o procedimento para tornar o Google Chrome um Servidor Web Local usando a extensão [Web Server for Chrome]. Usarei o mesmo projeto da AULA anterior (projeto Javascript Debugging) para publicá-lo no servidor web local e apresentar as principais características disponíveis nesta extensão.
[Conclusão]
Na aula de hoje [Local Web Server | Usando o Chrome como servidor web local | Alternativa 2 | SW9], você aprendeu a configurar e usar um servidor web local, com uma extensão baixada do Chrome Web Store. Com este servidor web local, você terá condições de publicar seus projetos (HTML, CSS e JS) com o objetivo de testar, apresentar o projeto para outras pessoas, etc.
Está disponível na minha área de downloads o projeto que usamos nesta AULA. Para acessá-lo basta clicar no link a seguir http://blog.sw9.com.br/acesso-area-de-downloads/, informar um e-mail válido e automaticamente receberá as instruções para acesso.
Dentro da minha área de Downloads, procure pela pasta JAVASCRIPT/DEBUG. O resto é com vocês 
Bom, por hoje é só. Aproveitem o vídeo e bons estudos. Fiquem antenados, que em breve teremos mais novidades.
Espero que gostem deste vídeo. Aproveito para pedir a participação de vocês no canal e blog, curtindo, compartilhando, dando sua opinião e se inscrevendo no canal e blog para receber as novidades em primeira mão.
Fiquem com Deus e até o próximo vídeo.
[Links úteis]
Curso Relacionado: [Aprenda HTML 5 e CSS 3 e Comece a Criar Seus Próprios Sites] – https://goo.gl/QsLPph
Link do vídeo: https://youtu.be/C_hY_Bibbws
PlayList Cloud 9: https://goo.gl/7aQbD6
PlayList Mega Série HTML5: https://www.youtube.com/watch?v=D-XN-miEwP0&list=PLtluGZbI5ESj8XWTJcJmrVW6Q_tCi7uR8
Área de Downloads: http://blog.sw9.com.br/acesso-area-de-downloads/
Meu Blog: http://blog.sw9.com.br
Meu GitHub: https://sw9brl.github.io/MyGitHubPage
Canal youtube: https://youtube.com/+sw9brl
✔ Clique em gostei ✔ Compartilhe ✔ Inscreva-se
Que tal me pagar um café :-)
Uma pequena quantidade de café foi consumida durante a produção de um post + vídeo. Se puder, contribua adicionando mais combustível para que eu tenha condições de seguir em frente.
Brincadeiras à parte, o valor selecionado é multiplicado por 2 (x2) que representa a multiplicação de minha dedicação a cada contribuição que recebo.
Deixe um comentário