Local Web Server | Usando o Chrome como servidor web local | Alternativa 1 | SW9

Olá a todos. Sejam bem-vindos ao Canal e Blog SW9 (http://blog.sw9.com.br).

#O que vimos na aula passada?

Nas duas AULAS anteriores, ensinei passo a passo como usar a ferramenta de debug do Google Chrome e também do Firefox – Developer Edition. Sabendo usar estas ferramentas de debug, em combinação com o workflow que apresentei, é possível simular, rastrear, identificar e corrigir erros de forma eficiente.

Você perdeu estas AULAS? Não se preocupe, segue a playlist que preparei para vocês [https://www.youtube.com/watch?v=aDFOsMZr-Ng&list=PLtluGZbI5ESjysHVp3dz6uBqUF0IjHvlk].

#O que veremos nesta aula?

O objetivo nesta AULA é explicar 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 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 as principais características do recurso nativo do Google Chrome 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, por isso preparei duas AULAS para avançarmos com este tema. Nesta primeira AULA vou explicar como configurar e usar o próprio recurso nativo do Google Chrome, ou seja, você não precisa instalar nada além do navegador. Já, na próxima AULA, vou apresentar a segunda forma de ativar um servidor web local usando Chrome.

Respondendo então a pergunta, eu conheço duas formas de usar o Google Chrome como um servidor web local.

1- Usando recurso nativo do navegador;

2- Instalando uma extensão disponível no Chrome Web Store.

#Quais as principais características do recurso nativo do Google Chrome?

Durante o uso do recurso nativo, eu identifiquei 3 características bem interessantes:

1- Você pode criar pastas nomeadas como se fossem domínios. Poderíamos, por exemplo, criar uma pasta do tipo blog.sw9.com.br e copiar todo o seu projeto para dentro dela. Cada pasta criada funciona como um documentRoot do projeto.

Após configurar e publicar o projeto usando o Google Chrome, você consegue carregar as suas páginas digitando a URL blog.sw9.com.br.

2- É possível simular o uso do protocolo HTTPS para qualquer projeto publicado. Sabendo disso, eu posso digitar a url do meu projeto no formato https://blog.sw9.com.br.

Se o projeto publicado em produção possui um certificado e já faz uso do protocolo HTTPS, esta característica vai ajudar bastante, já que será possível testar o projeto em nosso servidor web local usando a mesma url de produção (protocolo HTTPS + domínio);

3- Possibilidade de alterar a navegação entre o projeto local e o publicado em produção. Como estamos usando a mesma URL em produção e local, quando ativamos a opção [Enable Local Overrides], o navegador prioriza a url local e você poderá alterar as suas páginas e testar normalmente. Quando desmarcamos a opção [Enable Local Overrides], o navegador vai priorizar a url publicada em produção e você vai poder navegar nas suas páginas como qualquer outra pessoa que está usando a Internet.

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 seu recurso nativo. Usarei o projeto visto na AULA passada (projeto Javascript Debugging) para publicá-lo no servidor web local e apresentar as principais características deste recurso nativo.

[Conclusão]

Na aula de hoje [Local Web Server | Usando o Chrome como servidor web local | Alternativa 1 | SW9], você aprendeu a configurar e usar um servidor web local com um recurso nativo do navegador Google Chrome. 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/iNNJ97EaRUE

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