Configuración de un entorno de desarrollo de JavaScript para Azure

2025-04-24

Al crear aplicaciones en la nube, los desarrolladores suelen preferir probar código en sus estaciones de trabajo locales antes de implementar ese código en un entorno de nube como Azure. La ventaja del desarrollo local es la amplia variedad de herramientas que ofrece, además de un entorno conocido.

En este artículo se proporcionan instrucciones de configuración para crear y validar un entorno de desarrollo local adecuado para JavaScript en Azure.

Creación de suscripción única

Los recursos de Azure se crean dentro de una suscripción y un grupo de recursos.

Tipo

Descripción

Suscripción de prueba

Cree una suscripción gratuita de prueba.

Suscripción existente

Si ya tiene una suscripción, acceda a la suscripción existente con:

En varias suscripciones

Si necesita administrar varias suscripciones, aprenda cómo crear un grupo de administración con JavaScript.

Instalación de software por única vez

Desarrollo de Azure con JavaScript en la estación de trabajo local, se recomienda instalar las siguientes herramientas:

Nombre/instalador	Descripción
LTS de Node.js	Instale el entorno de tiempo de ejecución con soporte a largo plazo (LTS) más reciente para el desarrollo de estaciones de trabajo locales. Obtenga más información sobre cómo seleccionar una versión de Node.js para Azure.
Visual Studio Code	Visual Studio Code le ofrece una solución de programación excelente e integración de JavaScript, pero no es necesario. Puede usar cualquier editor de código.
Extensiones de Visual Studio Code	Instale las extensiones que correspondan en los servicios de Azure que quiera usar.

Entorno de ejecución de hospedaje de Azure

Cuando use un recurso de Azure como entorno de ejecución de hospedaje para la aplicación, como una aplicación web de Azure o Azure Functions, debe comprobar que la versión en tiempo de ejecución del entorno de desarrollo de Node.js local se corresponda con el entorno de ejecución de recursos de Azure que tiene previsto usar.

Instalaciones locales recomendadas

Se recomiendan las siguientes instalaciones comunes de la estación de trabajo local para ayudarle con las tareas de desarrollo local.

Nombre	Descripción
CLI de Azure	La CLI local o basada en la nube para crear y usar recursos de Azure.
CLI de desarrollo de Azure	Herramienta de línea de comandos orientada a desarrolladores destinada a compilar aplicaciones en la nube en el flujo de trabajo para desarrolladores.
Extensiones de Visual Studio Code para Azure	Extensiones de VS Code al entorno de desarrollo integrado.
Git o Git para Windows	Herramientas de línea de comandos para el control de código fuente. Si lo prefiere, puede usar otras herramientas de control de código fuente.
Docker para Windows o Mac.	Use contenedores de desarrollo para entornos de desarrollo homogéneos.
LTS de Node.js	Más información

Instalación de Node.js

Azure admite versiones LTS de Node.js. Obtenga más información sobre cómo seleccionar una versión de Node.js para Azure.

Configuración única para la autenticación

Para usar el mismo código de autenticación en el desarrollo local y el entorno de hospedaje remoto de Azure, use DefaultAzureCredential. Obtenga más información sobre esta identidad administrada.

Creación de un grupo de recursos para su proyecto

Abra Azure Portal en un explorador web.
En la barra de búsqueda, escriba grupos de recursos y selecciónelo.
Seleccione + Crear.

Introduzca la configuración del grupo de recursos:

Propiedad	Valor
Suscripción	Selecciona tu suscripción.
Grupo de recursos	Escriba el nombre del grupo de recursos. Este nombre del grupo de recursos se usa dentro del URI de recursos al acceder a Resource Manager (plano de administración). El nombre no se usa para el control (por ejemplo, la creación de una base de datos) o el plano de datos (insertar datos en una tabla).
Región	Seleccione una región geográfica para el grupo de recursos.

Seleccione Revisar + crear para comenzar la validación.
Cuando pase la validación, seleccione Crear.

Abra la paleta de comandos, Ctrl + Mayús + P.
Busque crear grupo de recursos y selecciónelo.

Responda a las indicaciones mediante la siguiente configuración:

Aviso	Valor
Seleccionar suscripción	Inicie sesión en Azure si se le solicita. Seleccione una suscripción existente o cree una cuenta de Azure si no tiene ninguna.
Escriba el nombre del nuevo grupo de recursos.	Escriba el nombre del grupo de recursos. Este nombre del grupo de recursos se usa dentro del URI de recursos al acceder a Resource Manager (plano de administración). El nombre no se usa para el control (por ejemplo, la creación de una base de datos) o el plano de datos (insertar datos en una tabla).
Seleccione una ubicación para los nuevos recursos.	Seleccione una región geográfica para el grupo de recursos.

Inicie sesión en Azure:
```
az login
```
Complete la autenticación en un navegador.
Enumere los nombres e identificadores de las suscripciones. Copie el valor SubscriptionId para usar el comando siguiente.
```
az account subscription list --output table 
```
Establezca la suscripción predeterminada, que usa los comandos siguientes:
```
az account set --subscription YOUR_SUBSCRIPTION_ID
```
Seleccione de la lista una ubicación admitida para la suscripción. Copie el valor Name de una región cercana.
```
az account list-locations --output table
```

Use la siguiente CLI de Azure para crear un grupo de recursos con el nombre o el identificador de la suscripción:

az group create --name "YOUR_RESOURCE_GROUP_NAME" --location YOUR_REGION

Por ejemplo:

az group create --name "my-azure-app" --location westus

Trabajo con Azure y las bibliotecas cliente del SDK de Azure

Las bibliotecas de cliente de Azure se ofrecen una a una por cada servicio. Instale cada biblioteca según el servicio de Azure que necesite usar.

Cada nuevo proyecto que utilice Azure debe:

Cree recursos de Azure.
Instale las bibliotecas de cliente de Azure a través de un administrador de paquetes, como NPM.
Use la identidad administrada para autenticarse con la biblioteca de cliente de Azure y luego use la información de la configuración para acceder a servicios específicos.

Protección de la información de configuración

Tiene varias opciones para almacenar la información de configuración:

Azure Key Vault para crear y conservar secretos, claves y certificados que permiten acceder a los recursos en la nube, que aún no dan acceso a la identidad administrada.
Dotenv es un conocido paquete de npm para leer variables de entorno desde un archivo .env. Asegúrese de agregar el archivo .env al archivo .gitignore para que el archivo .env no se inserte en el repositorio de control de código fuente.

Creación de variables de entorno

Para usar la configuración de Azure que las bibliotecas de Azure SDK necesitan para acceder a la nube de Azure, establezca los valores más comunes en las variables de entorno. Los siguientes comandos establecen las variables de entorno para la estación de trabajo local.

En los siguientes ejemplos, el identificador de cliente es el identificador y el secreto de la entidad de servicio.

juerga
Cmd

AZURE_SUBSCRIPTION_ID="<REPLACE-WITH-YOUR-AZURE-SUBSCRIPTION-ID>"
AZURE_TENANT_ID="<REPLACE-WITH-YOUR-AZURE-TENANT-ID>"
AZURE_CLIENT_ID="<REPLACE-WITH-YOUR-AZURE-CLIENT-ID>"
AZURE_CLIENT_SECRET="<REPLACE-WITH-YOUR-AZURE-CLIENT-SECRET>"

set AZURE_SUBSCRIPTION_ID="<REPLACE-WITH-YOUR-AZURE-SUBSCRIPTION-ID>"
set AZURE_TENANT_ID="<REPLACE-WITH-YOUR-AZURE-TENANT-ID>"
set AZURE_CLIENT_ID="<REPLACE-WITH-YOUR-AZURE-CLIENT-ID>"
set AZURE_CLIENT_SECRET="<REPLACE-WITH-YOUR-AZURE-CLIENT-SECRET>"

Reemplace los valores en los corchetes <> de estos comandos por los valores de su variable de entorno específica.

Creación del archivo `.env`

Otro mecanismo común es usar el paquete DOTENV de NPM para crear un archivo .env para esta configuración. Si planea usar .env, asegúrese de agregar el archivo al.gitignore para que no lo inserte en el control de versión. Agregar el archivo .env al archivo .ignore de Git es la manera estándar de asegurarse de que esa configuración se inserte en el repositorio de control de código fuente.

Instalar paquetes de npm

En cada proyecto, se recomienda crear siempre una carpeta independiente y su propio archivo package.json mediante los pasos siguientes:

Abra un terminal, un símbolo del sistema o el shell de Bash y cree una carpeta para el proyecto. Después, vaya a la nueva carpeta.
```
mkdir MY-NEW-PROJECT && cd MY-NEW-PROJECT
```
Inicialice el archivo de paquete:
```
npm init -y
```
Este comando crea el archivo package.json e inicializa las propiedades mínimas.
Instale las bibliotecas cliente de Azure que necesita, como este ejemplo de biblioteca cliente de autenticación:
```
npm install @azure/identity
```

Uso del control de código fuente con Visual Studio Code

Se recomienda adquirir el hábito de crear un repositorio de control de código fuente cada vez que se inicia un proyecto. Puede hacerlo desde Visual Studio Code.

En Visual Studio Code, seleccione el icono de control de código fuente para abrir el explorador Control de código fuente; a continuación, seleccione Inicializar repositorio para inicializar un repositorio de Git local:
Una vez que esté inicializado el repositorio y que tenga archivos para almacenar en el control de código fuente, escriba el mensaje Initial commit y seleccione la marca de verificación para crear la confirmación inicial de los archivos de código fuente.
Cree un nuevo repositorio en GitHub GitHub y copie la dirección URL del repositorio para los siguientes pasos.
En el terminal integrado de Visual Studio, use el siguiente comando git para agregar el repositorio remoto al repositorio local. Reemplace <YOUR-ACCOUNT> y <REPOSITORY> con sus propios valores.
```
git remote add origin https://github.com/<YOUR-ACCOUNT>/<REPOSITORY>
```

Visual Studio Code incluye muchas características de Git integradas. Para más información, consulte Uso del control de versiones en VS Code.

Compartir a través de