Principales tareas de los desarrolladores de JavaScript
Busque un ejemplo de la tarea actual. Si no encuentra una tarea, envíenos sus comentarios para solicitarla.
Aplicación de Active Directory
Proporcione la autenticación.
Documentación de registro de una aplicación de AD
| Tarea | using |
|---|---|
| Crear el registro de aplicaciones | Portal CLI de Azure |
| Autenticación sencilla | Static Web Apps Express.js |
| Mostrar una lista de los registros de aplicaciones | CLI de Azure |
Botón de inicio y cierre de sesión de MSAL con @azure/msal-browser |
React/TypeScript |
MSAL React con @azure/msal-browser que pasa las credenciales de usuario a Function API |
React y Azure Function API |
MSAL Express.js con @azure/msal-node |
Express.js |
| Revocar permisos de AAD | https://myapplications.microsoft.com/ |
| Revocar permisos de consumidor | https://account.live.com/consent/manage |
| Iniciar sesión | CLI de Azure Extensión de Visual Studio Code |
Grupos de recursos de Azure
| Tarea | using |
|---|---|
| Creación de un grupo de recursos | CLI de Azure TypeScript |
| Eliminación de un grupo de recursos | CLI de Azure TypeScript |
| Enumeración de grupos de recursos | TypeScript |
Aplicaciones
Aplicaciones web estáticas
| Tarea | using |
|---|---|
| Creación de una aplicación de Deno | Bash |
| Creación de una aplicación de React que tiene como destino el lenguaje JavaScript | Bash |
| Creación de una aplicación de React que tiene como destino el lenguaje TypeScript | Bash |
| Creación de una aplicación de Vue | Bash |
| Creación de aplicaciones web estáticas | Extensión de Visual Studio Code CLI de Azure |
| Examinar sitio | Extensión de Visual Studio Code |
| Proxy de SWA local con la CLI de SWA | CLI de SWA |
| Autenticación de SWA local con la CLI de SWA | CLI de SWA |
| Establecer las variables de entorno local de la aplicación de Static Web | Bash |
Aplicaciones de función (sin servidor)
| Tarea | using |
|---|---|
| Creación de una aplicación de funciones localmente | Extensión de Visual Studio Code |
| Código de desencadenador HTTP | JavaScript |
| Depuración y prueba de una función localmente | Visual Studio Code |
| Implementación de una función en la nube de Azure | Extensión de Visual Studio Code |
| Comprobación de que la API de función segura está disponible | Extensión de Visual Studio Code y explorador |
| Eliminación del recurso de una aplicación de funciones | Extensión de Visual Studio Code |
App Service: aplicaciones de pila completa, solo de servidor o solo de cliente
| Tarea | using |
|---|---|
| Creación de una aplicación de Express.js local | Bash |
| Creación de un recurso de aplicación: incluye la implementación de la aplicación de Express.js y los registros de secuencias | Extensión de Visual Studio Code |
| Creación de un recurso de aplicación: incluye: la implementación de la aplicación de Express.js, la configuración de las opciones de la aplicación, la ejecución de npm install e ir al sitio web implementado | Extensión de Visual Studio Code |
| Creación de un recurso de aplicación | CLI de Azure |
| Creación de una aplicación, implementación, aplicación de explorador, visualización de registros | CLI de Azure |
| Configuración de una aplicación web para que use una cadena de conexión de base de datos | CLI de Azure |
| Configuración de una aplicación web para que use un contenedor | CLI de Azure |
| Configuración del nombre de dominio personalizado de una aplicación web | CLI de Azure |
| Eliminación del recurso de aplicación | Extensión de Visual Studio Code CLI de Azure |
| Implementación o reimplementación de una aplicación | Extensión de Visual Studio Code |
| Obtención de la dirección IP externa de una aplicación web | CLI de Azure |
| Compra de un nombre de dominio y configuración del registro DNS | CLI de Azure |
| Transmisión de registros remotos | Extensión de Visual Studio Code CLI de Azure |
Cognitive Services
Documentación del grupo de servicios
| Tarea | using |
|---|---|
| Creación de un recurso de ComputerVision de Cognitive Services | CLI de Azure |
| Obtención de un recurso de ComputerVision de Cognitive Services | CLI de Azure |
| Instalación del SDK de Azure | Bash |
Análisis de imágenes con @azure/cognitiveservices-computervision |
Visual Studio Code |
Contenedores, incluidas las tareas de Docker
| Tarea | using |
|---|---|
| Adición de archivos de Docker al proyecto local | Extensión de Visual Studio Code |
| Compilación de una imagen de Docker desde el proyecto local | Extensión de Visual Studio Code |
| Creación de una imagen de contenedor a partir del proyecto local de JavaScript | Visual Studio Code |
| Creación de un recurso de registro de contenedor | Extensión de Visual Studio Code CLI de Azure |
| Crea un archivo Dockerfile. | Extensión de Visual Studio Code |
| Implementación de la imagen en App Service | Extensión de Visual Studio Code |
| Obtención de las credenciales de Azure Container Registry | CLI de Azure |
| Inicio de sesión en el registro de contenedor | BASH: CLI de Docker |
| Inserción de imágenes en el recurso del registro de Docker | Extensión de Visual Studio Code |
| Inserción de imágenes en el recurso de Azure Container Registry | Extensión de Visual Studio Code BASH: CLI de Docker |
| Ejecución de un contenedor local | Extensión de Visual Studio Code |
| Etiquetado de una imagen local | BASH: CLI de Docker |
| Comprobación de la versión de Docker | Bash |
Bases de datos
Cassandra API en Cosmos DB
| Tarea | Uso |
|---|---|
| Crear el recurso | Azure Portal CLI de Azure |
| Crear un almacén de claves en el recurso | CLI de Azure |
| Crear una tabla en el almacén de claves | CLI de Azure |
| Obtención de información sobre la conexión | CLI de Azure |
| Usar cassandra-driver API en Cosmos DB | JavaScript |
MariaDB
| Tarea | Uso |
|---|---|
| Creación de un recurso de MariaDB | Azure Portal CLI de Azure @azure/arm-mariadb |
| Creación de una base de datos MariaDB en el recurso | CLI de Azure |
| Obtención de la cadena de conexión | CLI de Azure |
| Uso y visualización de la base de datos | La CLI de mysql de Azure Cloud Shell MySQL Workbench Extensión de Visual Studio Code npm mariadb JavaScript |
MongoDB API en Cosmos DB
| Tarea | using |
|---|---|
| Creación de un recurso de MongoDB en Cosmos DB | Extensión de Visual Studio Code CLI de Azure |
| Obtención de la cadena de conexión de Cosmos DB | Extensión de Visual Studio Code CLI de Azure |
| Visualización de Cosmos DB | Explorador de Cosmos DB |
| Uso de Mongoose API para MongoDB en Cosmos DB | JavaScript |
MySQL
| Tarea | Uso |
|---|---|
| Crear el recurso | Azure Portal CLI de Azure @azure/arm-mysql |
| Crear una base de datos en el recurso | CLI de Azure |
| Obtención de la cadena de conexión | CLI de Azure |
| Uso y visualización de la base de datos | MySQL Workbench Extensión de Visual Studio Code npm mysql npm promise-mysql |
| Uso de promise-mysql API | JavaScript |
PostgreSQL
| Tarea | using |
|---|---|
| Crear el recurso | Extensión de Visual Studio Code CLI de Azure Azure Portal @azure/arm-postgresql |
| Obtención de la cadena de conexión | CLI de Azure |
| Ver la base de datos | Extensión de Visual Studio Code psql de Azure Cloud Shell |
| Usar pg API para la base de datos | JavaScript |
SQL API en Cosmos DB
- Documentación del servicio
- @azure/cosmosdb npm package
| Tarea | using |
|---|---|
| Adición de una regla de firewall para la dirección IP del cliente | CLI de Azure |
| Crear el recurso Cosmos DB - SQL API | Extensión de Visual Studio Code CLI de Azure |
| Obtener las claves de Cosmos DB | CLI de Azure |
| Obtención de la cadena de conexión de Cosmos DB | Extensión de Visual Studio Code |
| Visualización de Cosmos DB | Explorador de Cosmos DB |
| Usar SQL API en Cosmos DB | JavaScript |
GraphQL
| Tarea | using |
|---|---|
Implementación de una instancia de GraphQL API Hello World como una función de Azure Functions |
VSCode |
| Implementación de operaciones CRUD en GraphQL API como una función de Azure Functions | VSCode |
Implementación en el entorno de hospedaje
| Tarea | using |
|---|---|
| Aplicación web estática (SWA) | Código de VS Desde Framework (Next.js) Azure Pipelines |
| Functions | Código de VS Azure Pipelines Acciones de GitHub |
| App Service | Express.js con VS Code Inserción en Git Acciones de GitHub Azure DevOps |
Git
| Tarea | using |
|---|---|
| Creación de una rama local | Visual Studio Code con la paleta de comandos Visual Studio Code con la barra de estado |
| Clonación de un proyecto de GitHub en un equipo local | Visual Studio Code |
| Inserción de una rama local en un repositorio remoto | Visual Studio Code con la barra de estado Visual Studio Code con la extensión de Source Course |
GitHub
Acciones
| Tarea | using |
|---|---|
| Adición de secretos | Visual Studio Code |
| Visualización del proceso de compilación | Sitio web de GitHub |
Key Vault
| Tarea | using |
|---|---|
| Obtención de secretos | @azure/keyvault-secrets |
Supervisión
| Tarea | using |
|---|---|
| Crear el recurso | CLI de Azure |
Storage
| Tarea | using |
|---|---|
| Crear el recurso | Extensión de Visual Studio Code |
| Eliminación de un recurso | Extensión de Visual Studio Code |
| Creación de un token de firma de acceso compartido (SAS) del contenedor de almacenamiento | Portal |
| Establecimiento del token de SAS en el código | TypeScript |
| Configuración de CORS para el almacenamiento | Portal |
| Uso del emulador Storage Azurite | Visual Studio Code |
Datos BLOB
| Tarea | using |
|---|---|
Creación de un contenedor en el almacenamiento con @azure/storage-blob |
React/TypeScript |
Carga de un archivo en el almacenamiento con @azure/storage-blob |
React/TypeScript |
| Cargue el archivo en Storage mediante Function API | TypeScript con enlace de salida |
Uso del terminal
| Tarea | using |
|---|---|
| Terminal integrado | Visual Studio Code |
Máquinas virtuales
| Tarea | using |
|---|---|
| Creación: con archivo cloud-init | YAML |
| Creación: con la CLI de Azure y un recurso de máquina virtual Linux | CLI de Azure |
| Conexión: apertura del puerto de la máquina virtual Linux | CLI de Azure |
| Conexión: con SSH | Bash |
| Obtener estado | @azure/arm-compute |
| Enumeración de máquinas virtuales | @azure/arm-compute |
| Detención de la máquina virtual | @azure/arm-compute |
| Iniciar VM | @azure/arm-compute |
| Registros: instalación del SDK de supervisión | Bash |
| Registros: adición del código de supervisión a la aplicación de Express.js | applicationinsights |
| Ver registros | CLI de Azure Portal |
| Eliminar | @azure/arm-resources |
Visual Studio Code: Desarrollo y depuración de aplicaciones JavaScript
Documentación de la herramienta
| Tarea | using |
|---|---|
| Finalización de código | Visual Studio Code |
| Depuración de una aplicación Node.js local | Visual Studio Code |
| Depuración de pila completa local | Visual Studio Code |
| Navegación por los archivos del proyecto y el código | Visual Studio Code |
| Ejecución de la aplicación local de Node.js | Visual Studio Code |
Ejemplos de apoyo de estas tareas
| Nombre | Descripción |
|---|---|
| Aplicación de React con Function API | Compile e implemente localmente una aplicación cliente de React/TypeScript con una instancia de Azure Function API en una aplicación web estática de Azure con una acción de GitHub. TutorialCódigo de ejemplo |
| Aplicación de React con Cognitive Services | Compile e implemente localmente una aplicación cliente de React/TypeScript en una aplicación web estática de Azure con una acción de GitHub. TutorialCódigo de ejemplo |
| Aplicación de React para cargar un archivo en blobs de Azure Storage | Este proyecto de ejemplo es una aplicación cliente del marco de trabajo React (create-react-app) en TypeScript con un formulario HTML para seleccionar un archivo para cargarlo en Azure Storage Blob. TutorialCódigo de ejemplo |
| Aplicación de React con botón de inicio de sesión | La SPA creada en este tutorial es una aplicación de React (create-react-app) con las siguientes tareas: * Inicio de sesión con un inicio de sesión compatible con Microsoft, como Office 365 u Outlook.com * Cierre de sesión de la aplicación TutorialCódigo de ejemplo |
| Aplicación Azure Function con MongoDB | La funcionalidad de base de datos de MongoDB incluye lo siguiente: * Agregar elemento * Eliminar elemento por identificador * Obtener elemento por identificador * Obtener todos los elementos TutorialCódigo de ejemplo |
| Archivo de carga de la aplicación Azure Function en Blob Storage | En este artículo se muestra cómo crear una instancia de Function API, que carga un archivo en Azure Storage mediante un enlace de salida para transferir el contenido del archivo de la API a Storage: * Desarrollar y ejecutar localmente la instancia con la emulación de Azurite Storage y Azure Functions Core Tools. * Implementar la instancia en Azure Functions con un recurso de Storage personalizado. * Revisar los registros en Application Insights. TutorialCódigo de ejemplo |
| Aplicación de funciones de Azure para administrar grupos de recursos | En esta serie de artículos, creará una aplicación de funciones de Azure con API para administrar grupos de recursos de Azure. Características y funcionalidades de esta serie de artículos: * Creación de un proyecto local de aplicación de funciones de Azure en Visual Studio Code * Creación de código reutilizable de Function API en Visual Studio Code * Implementación en Azure Functions * Creación de una entidad de servicio * Configuración local y remota de la configuración de la aplicación * Uso de DefaultAzureCredential en entornos locales y remotos * Uso de los SDK de Azure para utilizar Azure Identity API y Azure Resource Management API * Uso de las API locales y en la nube para crear, eliminar y enumerar los grupos de recursos de la suscripción. Serie de artículosCódigo de ejemplo |
| Aplicación de Express.js con base de datos de MongoDB | En el tutorial se muestra cómo cargar y ejecutar el proyecto de forma local mediante VSCode con extensiones y cómo ejecutar el código de forma remota en una aplicación de App Service. El tutorial incluye la creación de un recurso de Cosmos DB para la API de Mongo, la obtención de la información de conexión y la configuración de la opción de configuración de App Service para conectarse a una base de datos en la nube. TutorialCódigo de ejemplo |
| Aplicación de Express.js implementada en una máquina virtual con el archivo cloud-init | Cree una máquina virtual Linux para una aplicación de Express.js. La máquina virtual se configura con un archivo de configuración cloud-init e incluye NGINX y un repositorio de GitHub para una aplicación de Express.js. Una vez que la máquina virtual está en ejecución, puede conectarse a la máquina virtual con SSH, cambiar la aplicación web para incluir el registro de seguimientos y ver la aplicación de servidor de Express.js pública en un explorador web. TutorialCódigo de ejemplo |
| Función sin servidor de GraphQL | Hola mundo con TypeScript, listo para implementar en Azure Functions. Código de ejemplo |
| Función CRUD sin servidor de GraphQL | Operaciones de CRUD con TypeScript, listas para implementar en Azure Functions. Código de ejemplo |
| Aplicación web estática de GraphQL | Aplicación web estática con un cliente React y Azure Functions, ambos con modelos de TypeScript compartidos que muestran un juego de preguntas y respuestas, con datos contenidos en Cosmos DB SQL API. Código de ejemplo |
Use la colección de fragmentos de código de un extremo a otro de JavaScript, https://github.com/azure-samples/js-e2e, para buscar o enviar ejemplos de código de JavaScript o TypeScript.
Use el explorador de ejemplos de Azure para encontrar más ejemplos que admitan su caso de uso específico.