// Tutorial //

Cómo configurar la plataforma de IDE en la nube code-server en Ubuntu 18.04 [guía rápida]

Published on January 30, 2020
Default avatar
By Savic
Developer and author at DigitalOcean.
Español
Cómo configurar la plataforma de IDE en la nube code-server en Ubuntu 18.04 [guía rápida]

Introducción

code-server es Microsoft Visual Studio Code en ejecución en un servidor remoto, y usted puede acceder a él de forma directa desde su navegador. Esto significa que puede usar varios dispositivos con diferentes sistemas operativos y tener siempre a mano un entorno de desarrollo uniforme.

A través de este tutorial, configurará la plataforma de IDE en la nube code-server en su equipo con Ubuntu 18.04 y la expondrá en su dominio, protegida con Let´s Encrypt. Para hallar una versión más detallada de este tutorial, consulte Cómo configurar la plataforma de IDE en la nube code-server en Ubuntu 18.04.

Requisitos previos

  • Un servidor con Ubuntu 18.04 con al menos 2 GB de RAM, acceso root y una cuenta sudo no root. Puede configurar esto siguiendo la Guía de configuración inicial para servidores de Ubuntu 18.04.

  • Nginx instalado en su servidor. En los pasos 1 a 4 de Cómo instalar Nginx en Ubuntu 18.04, encontrará indicaciones para hacer esto.

  • Un nombre de dominio registrado por completo para alojar code-server, orientado a su servidor. En este tutorial, se utilizará code-server.your-domain​​​ en todo momento. Puede adquirir un nombre de dominio en Namecheap, obtener uno gratuito en Freenom o utilizar un registrador de dominios que elija.

  • Los dos registros DNS que se indican a continuación se han configurado para su servidor. Puede utilizar esta introducción al DNS de DigitalOcean para obtener más información sobre cómo agregarlos.

    • Un registro A con your-domain orientado a la dirección IP pública de su servidor.
    • Un registro A con www.your-domain​​​1​​​ orientado a la dirección IP pública de su servidor.

Paso 1: Instalar code-server

Cree el directorio para almacenar todos los datos para code-server:

  1. mkdir ~/code-server

Diríjase a este:

  1. cd ~/code-server

Visite la página de versiones de Github de code-server y seleccione la última compilación de Linux. Descárguela usando lo siguiente:

  1. wget https://github.com/cdr/code-server/releases/download/2.1692-vsc1.39.2/code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

Desempaque el archivo:

  1. tar -xzvf code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

Diríjase al directorio que contiene el ejecutable de code-server:

  1. cd code-server2.1692-vsc1.39.2-linux-x86_64

Para acceder al ejecutable de code-server en su sistema, cópielo con lo siguiente:

  1. sudo cp code-server /usr/local/bin

Cree una carpeta para que code-server almacene los datos del usuario:

  1. sudo mkdir /var/lib/code-server

Cree un servicio systemd, code-server.service, en el directorio /lib/systemd/system:

  1. sudo nano /lib/systemd/system/code-server.service

Añada las siguientes líneas:

/lib/systemd/system/code-server.service
[Unit]
Description=code-server
After=nginx.service

[Service]
Type=simple
Environment=PASSWORD=your_password
ExecStart=/usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password
Restart=always

[Install]
WantedBy=multi-user.target
  • --host 127.0.0.1 lo vincula a localhost.
  • --user-data-dir /var/lib/code-server establece su directorio de datos de usuario.
  • --auth password especifica que debe autenticar a los visitantes con una contraseña.

Recuerde sustituir your_password por la contraseña que elija.

Guarde y cierre el archivo.

Inicie el servicio code-server:

  1. sudo systemctl start code-server

Compruebe que se haya iniciado correctamente:

  1. sudo systemctl status code-server

Verá un resultado similar al siguiente:

Output
● code-server.service - code-server Loaded: loaded (/lib/systemd/system/code-server.service; disabled; vendor preset: enabled) Active: active (running) since Mon 2019-12-09 20:07:28 UTC; 4s ago Main PID: 5216 (code-server) Tasks: 23 (limit: 2362) CGroup: /system.slice/code-server.service ├─5216 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password └─5240 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password ...

Habilite el servicio code-server para que se inicie automáticamente después de un reinicio del servidor:

  1. sudo systemctl enable code-server

Paso 2: Exponer code-server

Ahora, configurará Nginx como un proxy inverso para code-server.

Cree code-server.conf para almacenar la configuración para exponer code-server en su dominio:

  1. sudo nano /etc/nginx/sites-available/code-server.conf

Añada las siguientes líneas para configurar el bloque de su servidor con las directivas necesarias:

/etc/nginx/sites-available/code-server.conf
server {
	listen 80;
	listen [::]:80;

	server_name code-server.your_domain;

	location / {
		proxy_pass http://localhost:8080/;
		proxy_set_header Upgrade $http_upgrade;
		proxy_set_header Connection upgrade;
		proxy_set_header Accept-Encoding gzip;
	}
}

Sustituya code-server.your_domain por el dominio de su elección; luego guarde y cierre el archivo.

Para activar esta configuración del sitio, cree un enlace simbólico de la misma:

  1. sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

Pruebe la validez de la configuración:

  1. sudo nginx -t

Verá el siguiente resultado:

Output
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful

Para que la configuración se aplique, reinicie Nginx:

  1. sudo systemctl restart nginx

Paso 3: Proteger su dominio

Ahora, protegerá su dominio utilzando un certificado TLS de Let´s Encrypt.

Añada el repositorio de paquetes de Certbot a su servidor:

  1. sudo add-apt-repository ppa:certbot/certbot

Instale Certbot y su complemento de Nginx:

  1. sudo apt install python-certbot-nginx

Configure ufw para aceptar tráfico cifrado:

  1. sudo ufw allow https

El resultado será lo siguiente:

Output
Rule added Rule added (v6)

Realice la carga de nuevo para que la configuración se aplique:

  1. sudo ufw reload

El resultado será el siguiente:

Output
Firewall reloaded

Diríjase a su dominio de code-server.

Solicitud de inicio de sesión para code-server

Introduzca su contraseña de code-server. Verá la interfaz expuesta en su dominio.

GUI de code-server

Para protegerla, instale un certificado TLS de Let´s Encrypt usando Certbot.

Solicite un certificado para su dominio con lo siguiente:

  1. sudo certbot --nginx -d code-server.your_domain

Proporcione una dirección de correo electrónico para los avisos urgentes, acepte las Condiciones de servicio de la EFF y decida si todo el tráfico HTTP se redirecciona a HTTPS.

El resultado tendrá un aspecto similar a este:

Output
IMPORTANT NOTES: - Congratulations! Your certificate and chain have been saved at: /etc/letsencrypt/live/code-server.your_domain/fullchain.pem Your key file has been saved at: /etc/letsencrypt/live/code-server.your_domain/privkey.pem Your cert will expire on ... To obtain a new or tweaked version of this certificate in the future, simply run certbot again with the "certonly" option. To non-interactively renew *all* of your certificates, run "certbot renew" ...

Así, Certbot generó con éxito certificados TLS y los aplicó en la configuración de Nginx para su dominio.

Conclusión

Ahora dispone de code-server, un IDE en la nube versátil, instalado en su servidor de Ubuntu 18.04, expuesto en su dominio y protegido con certificados de Let´s Encrypt. Para obtener más información, consulte la documentación de Visual Studio Code sobre características adicionales e instrucciones detalladas relacionadas con otros componentes de code-server.


Want to learn more? Join the DigitalOcean Community!

Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in our Questions & Answers section, find tutorials and tools that will help you grow as a developer and scale your project or business, and subscribe to topics of interest.

Sign up
About the authors
Default avatar
Savic

author

Developer and author at DigitalOcean.

Default avatar
Developer and author at DigitalOcean.

Still looking for an answer?

Was this helpful?
Leave a comment

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!