Aprenda a programar no seu navegador, da maneira certa

Aprenda a programar no seu navegador, da maneira certa

9 de June, 2020 0 By António César de Andrade
Click to rate this post!
[Total: 0 Average: 0]


O VS Codespaces permite que você experimente pilhas complexas de desenvolvimento de software diretamente no navegador da web. Nenhum software para instalar ou configurar. Sem estresse. Sem bagunça. Aprenda algo novo hoje! Assine a nossa newsletter e fique em contato!

Na recente conferência on-line do GitHub Satellite, um dos anúncios de produtos mais interessantes é o GitHub Codespaces. A idéia é ter um botão de código em cada repositório. Quando você clica nele, ele lança um IDE VSCode completo com todas as necessariamente dependências de software, incluindo bibliotecas no nível do sistema operacional, para criar e executar o projeto. Esse IDE VSCode é executado inteiramente no seu navegador e não instala nenhum software ou altera qualquer configuração para atrapalhar o seu computador. Parece bom demais para ser verdade? Bem, assista ao segmento de palestras do Github Satellite sobre os Codespaces!

Um clipe da palestra: https://youtube.com/watch?v=L618Pp0n7us

Um dos principais benefícios do Github Codespaces é a rápida integração de novos desenvolvedores em um projeto. Um novo desenvolvedor pode ser configurado em minutos, em vez de dias, e imediatamente começa a contribuir para o projeto. É uma ótima ferramenta de aprendizado para novos idiomas, estruturas e ferramentas de software.

Sob o capô, ele inicia um contêiner do Docker em um servidor remoto, instala toda a pilha de software exigida pelo projeto e executa tarefas como compilação e depuração no Docker remoto. O navegador da web atua como uma interface de usuário front-end para a instância do Docker. Essa abordagem não requer instalação de software na máquina do desenvolvedor, mas a desvantagem é que toda a instalação de software desde o sistema operacional até o aplicativo final acontece no servidor. O GitHub deve iniciar um servidor novo para cada instância de Codespaces. Isso requer muitos recursos do data center. De fato, o Página da web Codespaces do GitHub tem uma lista de espera a partir de hoje (junho de 2020).

Captura de tela 2020-05-20 at 2.38.11 AM.png

Pessoalmente, não posso esperar que os Codespaces do GitHub estejam disponíveis. Bem, a máquina do tempo existe. Você pode experimentar todos os recursos do GitHub Codespaces hoje, gratuitamente.

VS Codespaces

O software por trás do GitHub Codespaces é realmente baseado em um produto Microsoft VSCode chamado VS Codespaces. O Codespaces do VS está disponível hoje para todos os usuários do Microsoft Azure e, sim, permite abrir repositórios do GitHub no VSCode IDE diretamente de uma janela do navegador. Neste tutorial, mostrarei como usar Codespaces em seu próprio trabalho de desenvolvimento hoje.

Para disponibilizar Codespaces em seus repositórios do GitHub, você só precisa adicionar o seguinte botão HTML em qualquer lugar das suas páginas da web. Quando um usuário do Azure clica no botão, ele solicita que o usuário faça logon no VS Codespaces e orienta o usuário na abertura do repositório no IDE online. Você pode ver como isso funciona nos exemplos na próxima seção.

Exemplo de HTML para adicionar um botão de ativação do VS Codespaces para seu repositório do GitHub

O VS Codespaces é executado inteiramente no seu navegador e custa cerca de US $ 1 por dia útil. É mais barato que uma xícara de café no escritório.

Exemplos

Agora, vejamos vários exemplos de como você pode aprender novas habilidades de programação usando espaços de código do VS.

O Rust é uma das linguagens de programação que mais cresce atualmente. É votada como a linguagem de programação mais amada pelos usuários do Stackoverflow quatro anos seguidos. Porém, experimentar o Rust requer uma cadeia de ferramentas complexa de compilador, vinculador, gerenciador de pacotes, gerenciador de ferramentas etc. O VS Codespaces fornece uma maneira fácil de aprender o Rust. Basta clicar no botão VS Codespaces em este repositório e agora você tem um projeto Rust em funcionamento para experimentar!

https://github.com/second-state/learn-rust-with-github-actions

Como linguagem do sistema, o Rust está bem posicionado para criar aplicativos do lado do servidor de alto desempenho. A pilha mais promissora é compilar e executar funções Rust em um contêiner WebAssembly e acessar essas funções de alto desempenho a partir de uma estrutura de aplicativos da web existente, como o Node.js. No entanto, como você já pode ver, essa configuração de “melhores práticas” requer uma pilha complexa de software. Clicando no botão VS Codespaces em este repositório fornece um projeto Node.js. totalmente funcional que usa funções Rust no WebAssembly como módulos. Você pode começar a modificar imediatamente o código Rust e JavaScript e executar o aplicativo Node.js. dentro do IDE do navegador da web.

https://github.com/second-state/ssvm-nodejs-starter

Rust e WebAssembly do lado do servidor soam legais. Mas temos realmente um exemplo mais completo que demonstra o poder e o desempenho do Rust além de um simples olá mundo? Este repositório é um exemplo. Abra-o no VS Codespaces e você terá um projeto para um aplicativo Rust + JavaScript que utiliza o Tensorflow para executar o reconhecimento de imagem. Como o aplicativo é executado no Node.js, ele fornece um modelo para aplicativos da web AI como serviço.

https://github.com/second-state/rust-wasm-ai-demo

E se você quiser permanecer no limite e usar o Deno da web baseado em Rust em vez do Node.js baseado em C? Bem, há um VS Codespaces modelo para executar o Deno como uma função do Azure também!

Como funciona

Se você prestar atenção, cada um dos repositórios habilitados para VS Codespaces possui uma .devcontainer pasta. Dentro dessa pasta, o Dockerfile especifica como criar o contêiner Docker para o ambiente de desenvolvimento. Por exemplo, o contêiner Node.js Docker é baseado no Ubuntu Linux com Node.js e pacotes NPM selecionados pré-instalados. Confira um exemplo aqui.

o devcontainer.json O arquivo especifica a configuração para o VSCode IDE no Docker remoto. Por exemplo, ele configura as extensões VSCode para instalar, comandos de terminal e depurador a serem usados ​​e portas de host a serem encaminhadas para teste e depuração.

Microsoft fornece bastante .devcontainer modelos para você modificar e usar. Hoje, eles cobrem a maioria das pilhas comuns de desenvolvimento de software.

Você pode personalizar ainda mais a experiência do VSCode do usuário, fornecendo definições de inicialização e tarefas no .vscode pasta. Vê-los!

Conclusão

Com os VS Codespaces e GitHub Codespaces quando é lançado, a barreira e o atrito para o desenvolvimento de software são ainda mais reduzidos. Você pode começar com pilhas de software complexas sem sair do navegador. Experimente hoje!

Finalmente, assista à apresentação completa do GitHub Satellite nos espaços de código do GitHub.

Uma visualização dos Codespaces do GitHub

Feliz codificação!

Sobre o autor

Dr. Michael Yuan é o autor de 5 livros em engenharia de software. Seu último livro Criando aplicativos Blockchain foi publicado por Addison-Wesley em dezembro de 2019. Dr. Yuan é co-fundador da Segundo Estado, uma startup financiada por VC que traz as tecnologias WebAssembly e Rust para nuvem, blockchaine AI formulários. Permite que os desenvolvedores implantem rápido, seguro, portátil e sem servidor Funções de ferrugem no Node.js.

Antes do Segundo Estado, o Dr. Yuan trabalhou por muito tempo como colaborador de código aberto na Red Hat, JBoss e Mozilla. Fora do software, o Dr. Yuan é um pesquisador principal nos Institutos Nacionais de Saúde, com vários prêmios de pesquisa em pesquisas sobre câncer e saúde pública. Ele é PhD em astrofísica pela Universidade do Texas em Austin.



Fonte