DEV Community

Cover image for Cómo desplegar una aplicación web Rust con DigitalOcean
Steadylearner
Steadylearner

Posted on

Cómo desplegar una aplicación web Rust con DigitalOcean

La mayoría de los usuarios de Rust terminan amando sus características, como el rendimiento, la fiabilidad y la productividad. No es fácil empezar a aprenderlo, pero hay buenas comunidades que te ayudarán a hacerlo.

Puedes contactarme por telegram si necesitas contratar a un desarrollador Blockchain Full Stack.

También puedes unirte a mi grupo de telegram, en el cual puedes encontrar otros desarrolladores blockchain, asi como reclutadores, jefes de proyecto, asi como hacer preguntas y hacer conexiones.

Además de eso, hay herramientas decentes de gestión como cargo, cargo-edit, etc. el lenguaje de programación asi como los paquetes (crates) estan madurando.

los desarrolladores de lenguaje también estan dedicando tiempo a mejorar la integracion de Webassembly para atraer mas desarrolladores frontend y hacer aplicaciones web mas rapido.

Sin embargo fue dificil encontrar ejemplos de casos reales para integrar el frontend a Rust y luego hacer el despliegue a la web.

No estaba seguro de que pudiese subir mi sitio web a la web con Rust, pero eventualmente lo logre y quize compartir el proceso con ustedes.

Si ya tienes experiencia haciendo despliegues en otro lenguajes te daras cuenta que el despliegue con Rust no es tan diferente de hacerlo con Node o Python.

  1. Compra un servicio VPS como el que puedes encontrar en DigitalOcean que te ofresca el mismo sistema operativo que usas en tu máquina local.

  2. Repite lo que has estado haciendo en tu entorno de desarrollo en la máquina virtual que ellos ofrecen.

  3. Configura Apache o Nginx y systemd service worker para que funcione como servidor proxy.

  4. Inicia tu proyecto dentro del servicio de host y inicia el servidor con tu dominio.

puedes seguir leyendo o solo aplica el priceso para Rust u otro framework que utilices.

[Pre requisitos]

  1. ¿Cómo instalar Rust?
  2. Sitio web de Rust
  3. DigitalOcean
  4. SSH
  5. ¿Cómo usar Vim?
  6. Desplegar Rocket con Nginx y LetsEncrypt
  7. Comandos Bash
  8. Linux

Espero que tengas instalado Rust en tu máquina y tengas la aplicación web lista.

Para este post, voy a usar DigitalOcean como ejemplo. Al empezar dudadaba de que fuese a funcionar con Rust, pero luego me di cuenta de lo fácil que era si ya tienes conocimientos de los comandos de la terminal de Linux. Porque lo que te proporcionan es simplemente una máquina virtual de Linux, y puedes repetir lo que hiciste en tu máquina local.

Puedes ver el resultado en Steadylearner.

Para el bajo costo que tiene funciona muy bien, y tiene dos meses gratis de prueba. No vas a necesitar tanto tiempo para empezar si sigues la instrucciones que te dejare en este post.

Se te hara mucho más fácil si ya estas familiarizado con Vim, CLI, Linux, etc.

A parte debes buscar información sobre Nginx. Funciona bien con la configuración predeterminada, pero espero que busques mas información al respecto para que puedas configurarlo segun tus necesidades.

En caso de todavia no tener SSH keys en tu máquina, por favor sigue la documentación de DigitalOcean que te di anteriormente.

Lo que debes hacer es escribir ssh-keygen y seguir las intrucciones en tu máquina.

Puedes repetir el proceso si tu hardware está roto o si necesitas empezar desde cero cuando quieras usarlo en otra máquina.

También espero que ya sepas lo que es un tld (top-level-domain).

Puedes seguir informandote al respecto después de realizar el despliegue de la app con este post.

Tabla de Contenido

  1. Configuración de DigitalOcean.
  2. Instalar dependencias para la máquina virtual.
  3. Configurar Nginx como servidor proxy inverso.
  4. Guardar el proyecto en tu máquina virtual.
  5. Crear el Systemd service para servir la aplicación web.
  6. HTTPS para el sitio web.
  7. Conclusión.

Puedes saltarte la parte de configurar DigitalOcean en caso de que no lo quieras usar.

No vas a necesitar Instalar las dependencias en la máquina virtual de Linux si ya sabes como configurar el entorno de desarrollo.

Solo repite lo que hiciste en tu máquina virtual despuñes de que compres el servicio VPS de [DigtialOcean] o el que hayas escogido.

Si tienes algun problema siguiente este post, por favor contactame a traves de Twitter o LinkedIn y podrea yudarte.

1. Configuración de DigitalOcean

DigitalOcean Website Screenshot by steadylearner

No escribiré detalles acerca de como usar DigitalOcean ya que hay mucha documentación documentations para princiantes.

Usa Ubuntu 16.04 o Ubuntu 18.04. o cualquier version que prefieras y el menor precio para seguir este articulo.

Puedes usar esto como ejemplo, espero que ya hayas creado una cuenta.

DigitalOcean Website Screenshot by steadylearner

Puedes usar cualquier opción que quieres, pero considero que ahorrar recursos es importante.

Usa la opción más barata, ya que será suficiente para hacer pruebas con tu proyecto.

DigitalOcean Website Screenshot by steadylearner

Usaremos Ubuntu 16.04 como nuestra elección.

DigitalOcean Website Screenshot by steadylearner

Tu máquina debe estar conectada con tu máquina virtual que provee el servicio con la SSH, asi como se muestra en la siguiente imagen, con el siguiente comando.

Con el comando $ssh yoursite@xxx.xxx.x.xx, se mostrará el siguiente mensae.

DigitalOcean Website Screenshot by steadylearner

Ahora verás username@project:~$ en tu Linux Kernel.

Estamos listos con DigitalOcean y ya podremos escribir el codigo para desplegar nuestra aplicación web hecha con Rust con Nginx.

Su máquina virtual de linux esta casi vacia, será fácil pensar que tendras empezar desde cero

Ya tiene Git instalado para descargar el proyecto de forma sencilla, Vim para editar los archivos Nginx y Rust. Mas adelante veremos como usarlos.

Si olvidaste el dominio de tu sitio, puedes usar este comando.

$host www.steadylearner.com
Enter fullscreen mode Exit fullscreen mode

Pruebalo con $host yourwebsite.

2. Instalar las dependencias para tu máquina virtual.

Este es una parte tediosa si tienes muchas dependencias.

Para nuestra máquina es solo una máquina virtual vacia, tienes que instalar Rust Compiler, Cargo, Node, Nginx, etc para preparar el despligue.

Si estas familiarizado con Docker, puedes usarlo para ahorrar tiempo.

lo que es importante es instalar Rust para compliar tu [App hecha con Rust] y Nginx para que trabaje como un servidor proxy inverso.

Para avanzar, se tiene que verificar que los requirimientos mínimos esten listos con el siguiente comando.

$sudo nginx -h

nginx with nginx -h command

$rustup

rustup after installation

$cargo

cargo command after installation

ahora estamos listos para escribir los verdaderos codigos para hacer el despliegue del sitio.

En este post usaremos Rust Rocket framework, pero puedes usar Actix o cualquier framework que desees.

Funcionaran porque lo que estas aprendiendo realmente con este post es como usar Nginx como server proxy para tu aplicación web en un sistema POSIX.

3. Configurar Nginx como servidor proxy inverso.

Nginx from its website

Ya estamos casi listos, puedes hacerlo funcionar con la documentación que deje mas arriba.

Pero creo que continuar leyendo el post te va a ahorrar tiempo, espero que no hayas modificado nada y que todo siga con sus valores predetermiandos.

Verás que es solo cuestion de hacer copiar y pegar para cuando tengas un ejemplo real.

Usa el siguiente snippet para Nginx y guardalo en /etc/nginx/sites-available/ como your-domain.tld.conf

your-domain.tld en mi caso sería steadylearner.com

Usa el tuyo en su lugar.

server {
    #listen 80; # Only if sysctl net.ipv6.bindv6only = 1
    listen 80;
    listen [::]:80;

    server_name yourdomain.tld www.yourdomain.tld; # 1.

    location / {
        # Forward requests to rocket v4.0 production port
        proxy_pass http://0.0.0.0:8000; # 2.
        proxy_buffering off; # Single Page App work faster with it
        proxy_set_header X-Real-IP $remote_addr;
    }
}
Enter fullscreen mode Exit fullscreen mode

El ejemplo es bastante simple, pero hay dos cosas que debes saber.

1. necesitas habilitar www en DigitalOcean como prefijo del nombre de tu sitio web.

Puedes leer how-to-manage-records, using-cname-for-www.

Puedes guiarte con la imagen de abajo.

Visit DigitalOcean to prefix www with http or https to redirect your domain

Aquí se Utiliza CNAME, pero puedes usar A o AAAA como registro www en su lugar si quieres habiltiar HTTPS mas adelante en este post.

2. El framework web de Rust que usaremos es Rocket y el puerto para producción es http://0.0.0.0:8000. tenemos que ayudar a nginx a "proxyar" la petición a tu aplicación web de Rust.

Podrías utilizar otro puerto y configuración si utilizas otro framework como Actix o de otros lenguajes.

Siempre que editemos los archivos principales de nginx, podemos probarlos con
$sudo nginx -t y nos mostrará unos mensajes similares a estos.

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
Enter fullscreen mode Exit fullscreen mode

Si paso la prueba con éxito, podemos usar make sym link para el archivo your-domain.tld.conf que creamos antes.

cd /etc/nginx/sites-enabled && sudo ln -s ../sites-available/your-domain.tld.conf
Enter fullscreen mode Exit fullscreen mode

Espero hayas logrado llegar bien hasta aquí.

Verás varios comandos de nginx después de que despliques el sitio web.

Copia y pegalos dentro del archivo ~/.bashrc con $vim ~/.bashrc y usa $source ~/.bashrc para usarlos si deseas.

No tienes que recordar los detalles si sabes lo que estas haciendo.

#nginx
alias startn="sudo systemctl start nginx"
alias stopn="sudo systemctl stop nginx"
alias restartn="sudo systemctl restart nginx"
alias reloadn="sudo systemctl reload nginx"
alias statusn="service nginx status"
alias testn="sudo nginx -t"
alias foldern="cd /etc/nginx"
Enter fullscreen mode Exit fullscreen mode

Hasta ahora no creo que hayan habido puntos difíciles, Ni fue necesario que edites el archivo nginx.conf

Si quieres servir el archivo gzip de tu Rust Rocket app o de cualquier aplicación web debes incluir el siguiente código y probarlos.

#inside nginx.conf(/etc/nginx/nginx.conf)

##
# Gzip Settings
##

gzip on;
gzip_disable "msie6";

gzip_vary on;
gzip_proxied any;
gzip_comp_level 5; # it is better not to be larger than 5
gzip_buffers 16 8k;
gzip_http_version 1.1;

# write what you want to be served as gzip compressed file when use requested it.

gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
Enter fullscreen mode Exit fullscreen mode

Verifiquemos que funciona con.

$curl http://yourdomain.com --silent --write-out "%{size_download}\n" --output /dev/null

$curl http://yourdomain.com --silent -H "Accept-Encoding: gzip, other things" --write-out "%{size_download}\n" --output /dev/null
Enter fullscreen mode Exit fullscreen mode

Y el resultado debe ser mucho mejor y mas fácil que hacerlo sin Nginx.

Si lograste servir los archivos gzip por tu cuenta con Rust o el lenguaje que hayas decidido usar, puedes usar

$find . | gzip *.ext
$find . | gzip -d *.gz
Enter fullscreen mode Exit fullscreen mode

Para comprimir y descromprimir archivos en una carpeta.

No necesitas usar el compresor de Webpack u otro para hacerlo.

4. Guardar el projecto en la máquina virtual

Tu máquina virtual esta casi vacia, pero podrias editar y guardar los archivos con Vim

También podrias usar git para descargar los archivos para que ya esten preinstalados.

Si quieres descargar los archivos de tu proyecto desde tu repositorio de Github puedes hacerlo con el siguiente comando.

$git clone https://github.com/steadylearner/Rust-Web-App.git.
Enter fullscreen mode Exit fullscreen mode

Puedes usar lo que quieras para guardar los archivos en tu máquina virtual.

Puede que quieras hacerlo en tu directorio personal. Para ello, vamos a utilizar $cd ~ && mkdir yourwebsite y guarda allí los archivos de tu proyecto.

Tú sabes mejor que nadie lo que estás haciendo. Es sólo repetir lo mismo que hiciste para hacer el proyecto. La única diferencia son las rutas para servir y enlazar los archivos y directorios.

Si estas usando Rust Rocket para este ejemplo,

  1. Descarga los archivos en tu máquina virtual.

  2. Primero usa $cargo check para verificar que todo funcione correctamente.

  3. para crear los archivos de production en la carpeta de destino dentro de tu máquina virtual usa $cargo run --release

  4. Luego usaremos systemd service para automizar el proceso en la siguiente parte

Quieres subir los archivos luego de desplegar el sitio?

  1. Tienes que repetir este comando $cargo run --release cada vez que modifiques los archivos Rust.

  2. Para sitios éstaticos como HTML, CSS, JS, imagenes u otros archivos simples, solo basta con sustituirlos para que funcione.

La diferencia es que Rust es un lenguaje compilado y los otros no lo son.

5. Crear systemd service para servir la aplicación web

Ya casi lo logramos. vamos a guiarnos del sitio de Rocket para entorno de desarrollo para poder usarlo en los archivos systemd.

Nos explican que hay entorno de desarrollo, "staging" y producción, y será similar que en otros frameworks.

Ya que estamos tratando con archivos de producción y estamos listos para desplegarlo en la web, sólo hay que preocuparse por la parte de producción.

Cuando usamos Rocket, ya viene con su propia configuración por defecto y no vamos a necesitar editar mucho.

Si lees su documentación encontrarás esas partes mejor detalladas en systemd service

Si quieres aprender mas sobre lo que significa service en este contexto, puedes leer esto

"Una unidad de servicio describe cómo gestionar un servicio o aplicación en el servidor. Esto incluirá cómo iniciar o detener el servicio, en qué circunstancias debe iniciarse automáticamente, y la información de dependencia y ordenamiento del software relacionado"

Desde aquí.

luego creamos /etc/systemd/system/your-domain.tld.service y escribimos un contenidos similar a este.

[Unit]
Description=Web Application Example from steadylearner

[Service]
User=www-data
Group=www-data
WorkingDirectory=/home/yourname/yourwebsite/yourproject/
Environment="ROCKET_ENV=prod"
Environment="ROCKET_ADDRESS=0.0.0.0"
Environment="ROCKET_PORT=8000"
Environment="ROCKET_LOG=critical"
ExecStart=/home/yourname/yourwebsite/yourproject/target/release/yourproject

[Install]
WantedBy=multi-user.target
Enter fullscreen mode Exit fullscreen mode

Deberias poder encontrar la ruta correcta para tu proeycto y ya está todo listo.

Ahora pruebaló en la consola de tu máquina virtual con

$sudo systemctl start your-domain.tld.service.
Enter fullscreen mode Exit fullscreen mode

Esto hasta que tu Rocket o cualquier framework que uses complile los archivos de producción y los sirva al port por ti.

Ahora visita tu sitio your-domain.tld

Si deseas puedes guardar un comando similar a este

alias verifywebsite="curl https://www.steadylearner.com"
Enter fullscreen mode Exit fullscreen mode

En tu archivo ~/.bashrc o en caso de que estes familiarizado con los comandos en Linux puedes usar $ping.

El resultado será la respuesta desde Nginx o tu sitio de prodicción en caso de que lo hayas hecho funcionar.

puedes revisar el ejemplo real en Steadylearner.

Espero que lo hayas logrado.

Puede que quieras escribir mas alias en tu archivo ~/.bashrc como estos

# ufw firewall(install ufw first)
alias allownginx="sudo ufw allow 'Nginx Full'"
alias reloadufw="sudo ufw reload"

# systemd service
alias start="sudo systemctl start yourdomain.tld.service"
alias stop="sudo systemctl stop yourdomain.tld.service"
alias status="sudo systemctl status yourdomain.tld.service"
alias reload="sudo systemctl daemon-reload"
# It works automatically for every reboot, use it just once.
alias autoreload="sudo systemctl enable yourdomain.tld.service"
Enter fullscreen mode Exit fullscreen mode

Eso sería todo para realizar el despliegue de la apliacion hecha con Rust a la web con Nginx y systemd service en una máquina virtual de Linux

Puede que quieras usar otro framework, solo necesitas editar las rutas y modificar la configuración.

Si deseas Habilitar HTTPS al sitio, sigue leyendo

6. HTTPS para el sitio web

Lo que necesitamos para habilitar https en el sitio son solo unas pocas linea de comandos.

$sudo certbot --nginx # 1.
$sudo certbot renew --dry-run # 2.
Enter fullscreen mode Exit fullscreen mode
  1. Puedes usar la documentación oficial cerbot.

  2. Leer the documentation de DigitalOcean sobre el comando renew --dry -run

Desde el primer proceso con $sudo certbot --nginx, verás los procesos similares a

https-cert

https-enable

Ya habra mostrado en un mensaje que el certificado expirará más tarde y que hay que hacer algún proceso para ello.

Solo necesitamos usar $sudo certbot renew --dry-run.

https-renew

Podras ver que solo esta simulando el proceso de renovacion en la descripción

Ahora puedes volver a visitar tu sitio con https habilitado

7. Conclusión

De antemano se que no ha sido un post fácil de seguir.

Lo hiciste bien si lo lograste, de lo contrario tu puedes lograr eventualmente lo que te propongas.

Puedes desplegar una aplicacin web heacha con Rust.

Siento que no es nada especial en usar Rust para desarrollo web con Nginx y Linux.

Solo los ports para servir los archivos van a variar de los demas, y el resto del proceso es bastante similar. Puedes hacer lo mismo para otros lenguajes de programación asi como para otros frameworks.

Lo que se aprendió fue a como usar Nginx y Systemd para cualquier framework be escrito en cualquier lenguaje de programación.

Este Fue el conjunto de los post que he escrito anteriormente.

Puede que quieras visitar uno de ellos Si tienes algun problema con este post, puedes buscar Como Desplegar con Rust.

Sigueme si quieres mas post de Rust, React, Node, Python, Haskell, Solidity, Polkadot, etc.
Follow me if you want more posts for Rust, React, Node, Python, Haskell, Solidity, Polkadot etc.

Si necesitas un desarrollador, contactame.

Gracias y por favor comparte es post con otros.

Discussion (0)