RemoteCode – Seu ambiente sempre com você!

Publicado em por _SDinfo

Seria tão simples e prático ter um ambiente virtual de trabalho, acessível de qualquer lugar e a qualquer hora! Melhor ainda se fosse possível acessar do notebook, tablet ou qualquer navegador web, não seria? Pois bem, o RemoteCode é a solução que vai te atender de forma objetiva e satisfatória!

Overview

Antes de apresentar a interface visual e as principais funcionalidades, vamos a algumas dúvidas comuns:

Como a plataforma funciona?

O RemoteCode é um ambiente remoto de desenvolvimento em cloud com acesso via web e desktop.

No seu workspace você encontrará as principais IDEs pré-configuradas e prontas para desenvolver, testar e realizar deploy sem consumir recursos da sua máquina local. É possível utilizar o seu workspace de qualquer máquina, a partir de notebook, desktop ou até mesmo tablet. As configurações da máquina são definidas por você ao escolher o plano, em apenas um clique, de acordo com a sua necessidade de potência e performance. Para empresas, oferecemos um dashboard de gestão e acompanhamento do time, que apresenta dados como visualização da carga horária de trabalho de cada colaborador, em qual branch e/ou linguagem estava trabalhando, entre outros.

De forma geral, o RemoteCode é muito mais performático do que uma máquina local, uma vez que todos os recursos são consumidos de uma infra em cloud.

Como começar a usar?

Para começar a usar como desenvolvedor individual, basta realizar o cadastro no nosso site e escolher um dos planos disponíveis. Para usar como empresa, é necessário realizar o contato com o time via comercial@remotecode.me.

Após o cadastro, você poderá utilizar o VS Code Web imediatamente ou poderá instalar a extensão do RemoteCode para uso do VS Code Desktop e seguir o passo a passo para configurar a chave SSH. Caso possua licença de uso de uma IDE da JetBrains, poderá também utilizar esta IDE em sua versão Web no RemoteCode. Por fim, pode também desenvolver com o Android Studio Web. Após acessar, você poderá clonar repositórios privados dentro do seu workspace cuja conta que você vinculou possui acesso.

Como é feita a cobrança?

Para este tópico, recomendamos que consulte os valores e especificações diretamente no site oficial: https://remotecode.me. De todo modo segue abaixo especificações e valores referente ao momento em que escrevo este material.

O RemoteCode possui duas modalidades de uso: individual e empresarial. Para desenvolvedores individuais, possuímos um plano Free e três planos pagos, que são cobrados no formato de mensalidade, sendo eles:

  • Basic, por R$ 69,90/mês, incluindo um workspace de 2 vCPU, 4 GB RAM, 15 GB SSD, e VS Code;
  • Professional, por R$ 169,90/mês, incluindo um workspace de 4 vCPU, 8 GB RAM, 30 GB SSD, com VS Code, JetBrains e Android Studio;
  • Advanced, por R$ 349,90/mês, incluindo um workspace de 8 vCPU, 16 GB RAM, 60 GB SSD, com VS Code, JetBrains e Android Studio.

Para empresas, a cobrança é feita por hora/uso de acordo com a configuração de máquina de cada usuário integrante da organização sendo os valores:

  • Basic, por R$ 0,50/hora;
  • Professional, por R$ 1,00/hora;
  • Advanced, por R$ 2,00/hora; Além disso, também é cobrado o armazenamento do workspace, sendo o valor de R$ 1,00/GB e consumo mínimo de 8 GB.

É possível configurar os recursos do hardware?

Sim, é possível escolher a configuração das máquinas de acordo com os planos disponíveis.

É seguro? Como os arquivos são salvos?

Os arquivos são salvos de forma segura em um disco virtual atrelado unicamente ao workspace do usuário. O acesso ao workspace acontece via HTTPS autenticado via OAuth2 ou via SSH com chave privada. Nenhum outro workspace é capaz de acessar esses dados já que existe o isolamento apropriado a nível de infraestrutura.

Existe um backup automático? Posso perder o que está no meu workspace?

Todos os dados dos usuários são replicados em 3 locais distintos continuamente de forma a proteger contra perda acidental de dados. Já tivemos casos de desenvolvedores que tiveram algum tipo de pane física em seus notebooks e puderam continuar a trabalhar de onde pararam em outro computador graças ao RemoteCode. Garantir a segurança e disponibilidades dos dados é a nossa responsabilidade.

Primeiro contato

Essa é a tela que você irá ver após escolher um dos planos disponíveis e efetuar login na plataforma:

Esse visual me agrada bastante: clean, objetivo e conta somente com o essencial! Pois bem, vejamos o que essa tela nos oferece:

  • No canto esquerdo:
    • Gerenciar arquivos: é simplesmente o gerenciador de arquivos do workspace, possibilitando obter informações sobre arquivos e diretórios, renomear, visualizar, mover e efetuar upload e download.
    • Acessar terminal: é nada mais e nada menos que um terminal Linux com privilegio de sudo, ou seja, você pode instalar o que quiser! Já adianto que Node (via NVM), PHP, Python, Go e mais algumas linguagens já estão pré-instaladas, ou seja, é só começar a usar. Há, quase esqueci: o Docker também já está instalado :)
    • Acessar sua aplicação: permite acessar pelo navegador aplicações que estão rodando dentro do workspace.
  • No canto direito:
    • No canto superior temos o nome do usuário, ao clicar neste é possível acessar o perfil do usuário e informações do plano atual.
    • Escolha seu editor de código: o plano básico possibilita utilizar somente o VSCode como editor, já os demais planos liberam o uso das renomadas IDEs da JetBrains, obviamente você precisa ter uma licença de uso
    • Mais abaixo você tem a opção de configurar uma instalação do VSCode Desktop para utilizar o seu workspace. Essa abordagem garante que todo o trabalho vai está salvo no workspace
    • Por fim você tem um botão para acessar o VSCode online. Aqui vale ressaltar que temos acesso a todas as funcionalidades do editor! Não fica nada de fora (interface, temas, plugins e afins).

Temos abaixo um exemplo da visão de consumo de recursos da minha instância:

Já aqui temos uma visão de como é a interface do recurso “Gerenciar arquivos”:

E por fim uma visão da tela de perfil do usuário:

Em resumo temos aqui aquele minimalismo que eu adoro! Tudo que precisamos para desempenhar nosso trabalho e nada mais.

Exemplo prático

Já apresentei a interface e deixei claro que o segredo do sucesso desta solução é sua abordagem simples e minimalista. Agora vamos a um exemplo prático para demonstrar a eficiência da solução.

Para essa demonstração eu irei instalar e por para rodar uma aplicação ReactJS + Vite.

Passo a passo

Você tem duas opções para criar o projeto, pode fazer uso da opção “Acessar terminal” em conjunto com o VSCode Web, porém, eu prefiro fazer tudo por dentro do VSCode, afinal de contas o mesmo tem integração com o terminal, o que facilita muito a vida. Sendo assim vamos lá:

  1. Na tela inicial do workspace clique em Acessar VSCode Web:

Ao fazer isso será aberta uma nova guia com a tela de boas vindas do VSCode, aquele padrão que já conhecemos. Como eu já passei por essa tela e abri o terminal integrado, o resultado é mais ou menos este:

Caso o terminal não esteja aberto, basta utilizar o menu superior-esquerdo (acima do ícone de duas folhas) para abrir o terminal.

2. Digite a instrução abaixo no terminal integrado e pressione ENTER:

npm create vite@latest

3. No questionário apresentado basta responder conforme abaixo:

Ao responder o questionário o instalador irá criar um esqueleto do projeto e prover algumas orientações.

4. Conforme as orientações retornadas na imagem acima, vamos acessar o diretório do nosso projeto, instalar as dependências e por o projeto para rodar:

cd vite-project
npm install
npm run dev -- --host 0.0.0.0

Observe que a última instrução é um pouco diferente daquela apresentada no output da imagem acima. Isso ocorre pois estamos rodando a app em uma máquina remota, ou seja, vamos acessar externamente. A instrução padrão supõe que nosso acesso é local host, como este não é o caso, precisamos modificar a instrução de modo que a app escute todas as interfaces de rede internas e externas. Veja o output:

Diante do output acima, bastaríamos acessar a url network e pronto, nossa app estaria rodando, contudo, como a solução RemoteCode implementa seus próprios mecanismos de segurança, dependemos de executar um step extra para acessar a app (descrito no passo seguinte).

5. Para acessar a app basta ir na aba do workspace e preencher o formulário Acesse sua aplicação conforme imagem abaixo e clicar em ACESSAR:

Bingo, olha nossa app rodando:

Clica ai no count is 0 (tá tudo funcionando). Inclusive temos suporte a hot reload, ou seja, se você for lá no VSCode, clicar no Menu > File > Open Folder… > clicar no seu projeto, neste caso vite-project e depois em ok o projeto será aberto no VSCode:

Posteriormente edite alguma coisa, no exemplo abaixo eu abri o arquivo App.tsx que está em src, alterei a linha 18 e salvei. Ao voltar na aba que mostra a página do projeto a alteração já vai está lá:

Resultado:

Conclusão

Ter um ambiente de desenvolvimento que pode ser acessado de qualquer lugar é sensacional. Outra vantagem é que você não corre o risco de perder seu trabalho caso o HD/SSD da sua máquina vá pro “espaço”, afinal de contas essa solução faz backup automático e redundante dos dados contidos no workspace.

Quer saber mais? Então acesse: https://remotecode.me