Tutorial de TypeScript para AWS Cloud9

En este tutorial se indica cómo trabajar con TypeScript en un entorno de desarrollo de AWS Cloud9.

El uso de este tutorial y la creación de esta muestra pueden generar cargos en su cuenta de AWS. Entre estos se incluyen posibles cargos por servicios como Amazon EC2 y Amazon S3. Para obtener más información, consulte Precios de Amazon EC2 y Precios de Amazon S3.

Requisitos previos

Antes de utilizar este ejemplo, asegúrese de que su configuración cumpla los siguientes requisitos:

• Debe tener un entorno de desarrollo de AWS Cloud9 EC2. En este ejemplo, se da por hecho que ya tiene un entorno de EC2 que está conectado a una instancia de Amazon EC2 que ejecuta Amazon Linux o Ubuntu Server. Si tiene otro tipo de entorno o sistema operativo, es posible que tenga que adaptar las instrucciones de este ejemplo para configurar herramientas relacionadas. Para obtener más información, consulte Crear un entorno en AWS Cloud9.

• Ya tiene abierto el IDE de AWS Cloud9 para el entorno existente. Al abrir un entorno, AWS Cloud9 abre el IDE de ese entorno en el navegador web. Para obtener más información, consulte Apertura de un entorno en AWS Cloud9.

Paso 1: Instalar las herramientas necesarias

En este paso, instale TypeScript mediante Node Version Manager (npm). Para instalar npm, use Node Version Manager (nvm). Si no tiene nvm, instálelo primero en este paso.

1. En una sesión del terminal en el IDE de AWS Cloud9, confirme que TypeScript ya esté instalado. Para ello, ejecute el compilador TypeScript de la línea de comandos con la opción --version . (Para iniciar una nueva sesión del terminal, en la barra de menús, seleccione Window [Ventana], New Terminal [Nuevo terminal]). Si es así, la salida contendrá el número de versión de TypeScript. Si TypeScript está instalado, continúe en Paso 2: Agregar el código.

   tsc --version

2. Confirme si npm ya está instalado mediante la ejecución de npm con la opción --version. Si es así, el resultado contendrá el número de versión de npm. Si npm está instalado, vaya al paso 10 de este procedimiento para utilizar npm para instalar TypeScript.

   npm --version

3. Ejecute el comando yum update (para Amazon Linux) o apt update (para Ubuntu Server) para garantizar que las últimas actualizaciones de seguridad y correcciones de errores están instaladas.

   Para Amazon Linux:

   sudo yum -y update

   Para Ubuntu Server:

   sudo apt update

4. Para instalar npm, comience por ejecutar el siguiente comando para descargar Node Version Manager (nvm). (nvm es un sencillo script de shell Bash que resulta útil para instalar y administrar versiones de Node.js. Para obtener más información, consulte Node Version Manager en el sitio web de GitHub).

   curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.0/install.sh | bash

5. Para comenzar a utilizar nvm, cierre la sesión del terminal e iníciela de nuevo, o cargue el archivo ~/.bashrc que contiene los comandos para cargar nvm.

   . ~/.bashrc

6. Confirme que nvm está instalado mediante la ejecución de nvm con la opción --version.

   nvm --version

7. Instale la versión 16 más reciente de Node.js ejecutando nvm. (npm se incluye en Node.js).

   nvm install v16

8. Confirme que Node.js está instalado ejecutando la versión de la línea de comandos de Node.js con la opción --version.

   node --version

9. Confirme que npm está instalado mediante la ejecución de npm con la opción --version.

   npm --version

10. Instale TypeScript ejecutando npm con la opción -g. De este modo se instala TypeScript como un paquete global en el entorno.

    npm install -g typescript

11. Confirme que TypeScript está instalado ejecutando el compilador de TypeScript de la línea de comandos con la opción --version.

    tsc --version

Paso 2: Agregar el código

1. En el IDE de AWS Cloud9, cree un archivo llamado hello.ts. (Para crear un archivo, en la barra de menús, elija File [Archivo], New File [Archivo nuevo]. Para guardar el archivo, elija File [Archivo], Save [Guardar]).

2. En un terminal del IDE, desde el mismo directorio que el archivo hello.ts, ejecute npm para instalar la biblioteca @types/node.

   npm install @types/node

   De este modo se añade una carpeta node_modules/@types/node en el mismo directorio que el archivo hello.ts. Esta nueva carpeta contiene las definiciones de tipo de Node.js que TypeScript necesitará más adelante en este procedimiento para las propiedades console.log y process.argv que añadirá al archivo hello.ts.

3. Añada el siguiente código al archivo hello.ts:

   console.log('Hello, World!');
   
   console.log('The sum of 2 and 3 is 5.');
   
   const sum: number = parseInt(process.argv[2], 10) + parseInt(process.argv[3], 10);
   
   console.log('The sum of ' + process.argv[2] + ' and ' +
     process.argv[3] + ' is ' + sum + '.');

Paso 3: Ejecutar el código

1. En el terminal, desde el mismo directorio que el archivo hello.ts, ejecute el compilador TypeScript. Especifique el archivo hello.ts y las bibliotecas adicionales que se incluirán.

   tsc hello.ts --lib es6

   TypeScript utiliza el archivo hello.ts y un conjunto de archivos de biblioteca ECMAScript 6 (ES6) para transponer el código TypeScript del archivo hello.ts a código JavaScript equivalente en un archivo llamado hello.js.

2. En la ventana Environment (Entorno), abra el archivo hello.js.

3. En la barra de menús, elija Run (Ejecutar), Run Configurations (Configuraciones de ejecución), New Run Configuration (Nueva configuración de ejecución).

4. En la pestaña [New] - Idle (Nuevo - Inactivo), elija Runner: Auto (Ejecutor: automático) y, a continuación, elija Node.js.

5. En Command (Comando), escriba hello.js 5 9. En el código, 5 representa process.argv[2] y 9 representa process.argv[3]. (process.argv[0] representa el nombre del tiempo de ejecución (node) y process.argv[1] representa el nombre del archivo (hello.js)).

6. Elija Run (Ejecutar) y compare los resultados. Cuando haya terminado, elija Stop (Detener).

   Hello, World!
   The sum of 2 and 3 is 5.
   The sum of 5 and 9 is 14.

nota

En lugar de crear una nueva configuración de ejecución en el IDE, también puede ejecutar este código si ejecuta el comando node hello.js 5 9 desde el terminal.

Paso 4: Instalar y configurar AWS SDK for JavaScript in Node.js

Puede mejorar esta muestra para utilizar AWS SDK for JavaScript in Node.js y crear un bucket de Amazon S3, mostrar una lista de los buckets disponibles y, a continuación, eliminar el bucket que acaba de crear.

En este paso, va a instalar y configurar AWS SDK for JavaScript in Node.js El SDK proporciona un método práctico para interactuar con servicios de AWS, como Amazon S3, desde su código de JavaScript. Una vez instalado AWS SDK for JavaScript in Node.js, debe configurar la administración de credenciales en su entorno. El SDK necesita estas credenciales para interactuar con los servicios de AWS.

Para instalar AWS SDK for JavaScript in Node.js

En una sesión del terminal en el IDE de AWS Cloud9, en el mismo directorio que el archivo hello.js de Paso 3: Ejecutar el código, ejecute npm para instalar AWS SDK para JavaScript in Node.js.

npm install aws-sdk

Este comando agrega varias carpetas a la carpeta node_modules del Paso 3: Ejecutar el código. Estas carpetas contienen código fuente y dependencias para AWS SDK for JavaScript in Node.js. Para obtener más información, consulte Instalación del SDK para JavaScript en la Guía para desarrolladores de AWS SDK for JavaScript.

Para configurar la administración de credenciales en su entorno

Cada vez que utilice AWS SDK for JavaScript in Node.js para llamar a un servicio de AWS, debe proporcionar un conjunto de credenciales con la llamada. Estas credenciales determinan si AWS SDK for JavaScript in Node.js tiene los permisos adecuados para realizar esa llamada. Si las credenciales no cubren los permisos adecuados, la llamada no se realizará correctamente.

En este paso, se almacenan las credenciales dentro del entorno. Para ello, siga las instrucciones de Llamar a los Servicios de AWS desde un entorno en AWS Cloud9 y, a continuación, vuelva a este tema.

Para obtener información adicional, consulte Configuración de credenciales en Node.js en la Guía para desarrolladores de AWS SDK for JavaScript.

Paso 5: Agregar el código de AWS SDK

En este paso, agregará algo más de código, esta vez para interactuar con Amazon S3 y crear un bucket, ver una lista de los buckets disponibles y después eliminar el bucket que acaba de crear. Ejecutará este código más adelante.

1. En el IDE de AWS Cloud9, en el mismo directorio que el archivo hello.js de los pasos anteriores, cree un archivo denominado s3.ts.

2. Desde un terminal del IDE de AWS Cloud9, en el mismo directorio que el archivo s3.ts, habilite el código para llamar a operaciones de Amazon S3 de forma asincrónica ejecutando dos veces npm para instalar la biblioteca asíncrona para TypeScript y de nuevo para JavaScript.

   npm install @types/async # For TypeScript.
   npm install async        # For JavaScript.

3. Añada el siguiente código al archivo s3.ts:

   import * as async from 'async';
   import * as AWS from 'aws-sdk';
   
   if (process.argv.length < 4) {
     console.log('Usage: node s3.js <the bucket name> <the AWS Region to use>\n' +
       'Example: node s3.js my-test-bucket us-east-2');
     process.exit(1);
   }
   
   const AWS = require('aws-sdk'); // To set the AWS credentials and AWS Region.
   const async = require('async'); // To call AWS operations asynchronously.
   
   const s3: AWS.S3 = new AWS.S3({apiVersion: '2006-03-01'});
   const bucket_name: string = process.argv[2];
   const region: string = process.argv[3];
   
   AWS.config.update({
     region: region
   });
   
   const create_bucket_params: any = {
     Bucket: bucket_name,
     CreateBucketConfiguration: {
       LocationConstraint: region
     }
   };
   
   const delete_bucket_params: any = {
     Bucket: bucket_name
   };
   
   // List all of your available buckets in this AWS Region.
   function listMyBuckets(callback): void {
     s3.listBuckets(function(err, data) {
       if (err) {
   
       } else {
         console.log("My buckets now are:\n");
   
         for (let i: number = 0; i < data.Buckets.length; i++) {
           console.log(data.Buckets[i].Name);
         }
       }
   
       callback(err);
     });
   }
   
   // Create a bucket in this AWS Region.
   function createMyBucket(callback): void {
     console.log("\nCreating a bucket named '" + bucket_name + "'...\n");
   
     s3.createBucket(create_bucket_params, function(err, data) {
       if (err) {
         console.log(err.code + ": " + err.message);
       }
   
       callback(err);
     });
   }
   
   // Delete the bucket you just created.
   function deleteMyBucket(callback): void {
     console.log("\nDeleting the bucket named '" + bucket_name + "'...\n");
   
     s3.deleteBucket(delete_bucket_params, function(err, data) {
       if (err) {
         console.log(err.code + ": " + err.message);
       }
   
       callback(err);
     });
   }
   
   // Call the AWS operations in the following order.
   async.series([
     listMyBuckets,
     createMyBucket,
     listMyBuckets,
     deleteMyBucket,
     listMyBuckets
   ]);

Paso 6: Ejecutar el código de AWS SDK

1. En el terminal, desde el mismo directorio que el archivo s3.ts, ejecute el compilador TypeScript. Especifique el archivo s3.ts y las bibliotecas adicionales que se incluirán.

   tsc s3.ts --lib es6

   TypeScript utiliza el archivo s3.ts, AWS SDK for JavaScript in Node.js, la biblioteca asíncrona y un conjunto de archivos de biblioteca ECMAScript 6 (ES6) para transponer el código de TypeScript del archivo s3.ts a código de JavaScript equivalente en un archivo llamado s3.js.

2. En la ventana Environment (Entorno), abra el archivo s3.js.

3. En la barra de menús, elija Run (Ejecutar), Run Configurations (Configuraciones de ejecución), New Run Configuration (Nueva configuración de ejecución).

4. En la pestaña [New] - Idle (Nuevo - Inactivo), elija Runner: Auto (Ejecutor: automático) y, a continuación, elija Node.js.

5. En Command (Comando), escriba s3.js YOUR_BUCKET_NAME THE_AWS_REGION , donde YOUR_BUCKET_NAME el nombre del bucket que quiere crear y después eliminar y THE_AWS_REGION es el ID de la región de AWS en la que se creará el bucket. Por ejemplo, para la región EE.UU. Este (Ohio), utilice us-east-2. Para ver más ID, visite Amazon Simple Storage Service (Amazon S3) en la Referencia general de Amazon Web Services.

   nota

   Los nombres de bucket de Amazon S3 deben ser únicos en AWS, no solo en la cuenta de AWS.

6. Elija Run (Ejecutar) y compare los resultados. Cuando haya terminado, elija Stop (Detener).

   My buckets now are:
   
   Creating a new bucket named 'my-test-bucket'...
   
   My buckets now are:
   
   my-test-bucket
   
   Deleting the bucket named 'my-test-bucket'...
   
   My buckets now are:

Paso 7: Limpiar

Para evitar que se apliquen cargos continuos en su cuenta de AWS después de terminar de usar esta muestra, debe eliminar el entorno. Para obtener instrucciones, consulte Eliminación de un entorno en AWS Cloud9.