Implementar una aplicación web en AWS Elastic Beanstalk

GUÍA DE INTRODUCCIÓN

Módulo 1: Crear una aplicación web

En este módulo, crearemos una aplicación web de NodeJS y la ejecutaremos de forma local.

Introducción

Crearemos una aplicación no incluida en contenedores que implementaremos en la nube. Para este ejemplo, utilizaremos NodeJS para crear una aplicación web.

La aplicación web consistirá en un servidor de aplicación web sencillo que servirá archivos HTML estáticos y contará con un punto de enlace de API de REST. El propósito de esta guía no es enseñarle cómo crear aplicaciones web, así que siéntase libre para utilizar la aplicación de ejemplo o crear la suya propia. Aunque esta guía se centra en el uso de NodeJS, también puede crear una aplicación web con otros lenguajes de programación compatibles con Elastic Beanstalk, como Java, .NET, NodeJS, PHP, Ruby, Python, Go y Docker.

Puede implementarlo en su ordenador local o en un entorno de AWS Cloud9.

Lo que aprenderá

  • Desarrollar una aplicación web de NodeJS sencilla que sirve un archivo HTML y tiene una API de REST simple
  • Ejecutar la aplicación de forma local

 Tiempo de realización

10 minutos

 Requisitos previos del módulo

  • Una cuenta de AWS con acceso de nivel de administrador**
  • Navegador recomendado: la última versión de Chrome o Firefox

[**] Es posible que las cuentas creadas en las últimas 24 horas aún no tengan acceso a los servicios necesarios para este tutorial.

Implementación

Crea la aplicación cliente

El primer paso es crear un nuevo directorio para nuestra aplicación.

mkdir my_webapp
cd my_webapp

A continuación, puede inicializar el proyecto de NodeJS. Así, se creará el archivo package.json que contendrá todas las definiciones de su aplicación de NodeJS.

npm init -y

Crear aplicación de Express

Utilizaremos Express como el marco de nuestra aplicación web. Para utilizarlo, necesitamos instalar Express como una dependencia en nuestro proyecto de NodeJS.

npm install express

Después de ejecutar este comando, verá que la dependencia aparece en el archivo package.json. De manera adicional, se crea el directorio node_modules y los archivos package-lock.json.

Ahora puede crear un nuevo archivo llamado app.js. Este archivo contendrá la lógica empresarial para que resida el servidor de Express de NodeJS.

Ya estamos listos para comenzar a agregar código. Lo primero que necesitamos agregar son las dependencias para la aplicación; en este caso, Express para poder utilizar el módulo que hemos instalado previamente, y a continuación agregar el código para iniciar el servidor web. Especificaremos al servidor web el uso del puerto 8080, puesto que es el que utiliza Elastic Beanstalk de manera predeterminada.

var express = require('express');
var app = express();
var fs = require('fs');
var port = 8080;

app.listen(port, function() {
  console.log('Server running at http://127.0.0.1:', port);
});

Ya podemos iniciar nuestra aplicación, aunque aún no hará nada ya que no se ha definido ningún código para procesar solicitudes.

Crear una API de REST

Ahora agregaremos código para servir una respuesta para una llamada a la API de REST de HTTP. Para crear nuestra primera llamada a la API, agregue el siguiente código entre la definición de puerto y donde iniciamos el servidor.

var express = require('express');
var app = express();
var fs = require('fs');
var port = 8080;

// New code
app.get('/test', function (req, res) {
    res.send('the REST endpoint test run!');
});


app.listen(port, function() {
  console.log('Server running at http://127.0.0.1:%s', port);
});

Esto sirve para ilustrar cómo conectar el punto de enlace /test a nuestro código; puede agregar una respuesta diferente o un código que haga algo específico, pero está fuera del ámbito de esta guía.

Servir contenido HTML

Nuestra aplicación de NodeJS de Express también puede servir una página web estática. Necesitamos crear una página HTML para utilizarla como ejemplo: vamos a crear un archivo llamado index.html.

Dentro de este archivo, agregue el siguiente código HTML con un enlace al punto de enlace REST que creamos antes para mostrar cómo conectarlo al backend.

<html>
    <head>
        <title>Elastic Beanstalk App</title>
    </head>

    <body>
        <h1>Welcome to the demo for ElasticBeanstalk</h1>
        <a href="/test">Call the test API</a>
    </body>
</html>

Para servir esta página HTML desde nuestro servidor de Express, necesitamos agregar más código para renderizar la ruta / cuando se realice la llamada. Para ello, agregue el siguiente código sobre la llamada /test:

app.get('/', function (req, res) {
    html = fs.readFileSync('index.html');
    res.writeHead(200);
    res.write(html);
    res.end();
});

Este código servirá el archivo index.html siempre que se realice una solicitud para la raíz de la aplicación (/).

Ejecutar el código de manera local

Ya estamos preparados para ejecutar nuestra aplicación y comprobar si está funcionando de manera local. Para ello, vamos a actualizar package.json con un script para que se ejecute con más facilidad. En el archivo package.json, sustituya la sección de scripts por:

"scripts": {
    "start": "node app.js"
  },

Ahora puede ir a su terminal y ejecutar:

npm start

Esto hará que se inicie un servidor local con la URL http://127.0.0.1:8080 o http://localhost:8080.

Cuando pegue esta URL en su navegador, debería ver lo siguiente:

gsg_build_elb_1

Para detener el servidor, utilice CTRL + C para detener el proceso en su terminal cuando haya ejecutado npm start

Conclusión

En este primer módulo, creamos una aplicación de NodeJS muy básica y la ejecutamos a nivel local para asegurarnos de que funciona. En el siguiente módulo, aprenderemos a crear la infraestructura mediante AWS CDK para ejecutarla en AWS Elastic Beanstalk.

A continuación: Crear infraestructura

Háganos saber su opinión.

Agradecemos sus comentarios
Nos alegra que esta página le haya ayudado. ¿Le gustaría compartir detalles adicionales para ayudarnos a seguir mejorando?
Cerrar
Agradecemos sus comentarios
Lamentamos que esta página no le haya ayudado. ¿Le gustaría compartir detalles adicionales para ayudarnos a seguir mejorando?
Cerrar