Configurare l'ambiente di sviluppo JavaScript locale per Azure

  • Articolo

Gli sviluppatori di applicazioni cloud preferiscono in genere testare il codice nelle rispettive workstation locali prima di distribuirlo in un ambiente cloud come Azure. Lo sviluppo locale offre il vantaggio di un'ampia gamma di strumenti insieme a un ambiente familiare.

Questo articolo fornisce istruzioni di configurazione per creare e convalidare un ambiente di sviluppo locale adatto per JavaScript con Azure.

Creazione della sottoscrizione una tantum

Le risorse di Azure vengono create all'interno di una sottoscrizione e di un gruppo di risorse.

Tipo Descrizione
Sottoscrizione alla versione di valutazione Creare una sottoscrizione di valutazione gratuita.
Sottoscrizione esistente Se si ha già una sottoscrizione, accedere alla sottoscrizione esistente nel portale di Azure, nell'interfaccia della riga di comando di Azure o negli SDK di Azure per JavaScript.
Tra più sottoscrizioni Se è necessario gestire più sottoscrizioni, questo articolo descrive come creare un gruppo di gestione con JavaScript.

Installazione di software una tantum

Sviluppo di Azure con JavaScript nella workstation locale, è consigliabile installare quanto segue:

Nome/Programma di installazione Descrizione
Node.js LTS Installare l'ambiente di runtime LTS (Long-Term Support) più recente per lo sviluppo in workstation locali.
Visual Studio Code Visual Studio Code offre un'ottima esperienza di integrazione e scrittura di codice per JavaScript, ma non è obbligatorio. È infatti possibile usare qualsiasi editor di codice.

Runtime di hosting di Azure

Se si prevede di usare una risorsa di Azure come ambiente di hosting per l'applicazione, ad esempio un'app Web di Azure o Funzioni di Azure, è necessario verificare che la versione di runtime dell'ambiente di sviluppo Node.js locale di Node.js corrisponda al runtime delle risorse di Azure che si intende usare.

Le installazioni comuni seguenti in workstation locali sono consigliate per semplificare le attività di sviluppo locali.

Nome Descrizione
Interfaccia della riga di comando di Azure Interfaccia della riga di comando locale o basata sul cloud per creare e usare le risorse di Azure.
Interfaccia della riga di comando per sviluppatori di Azure Strumento da riga di comando incentrato sugli sviluppatori per la creazione di app cloud nel flusso di lavoro per sviluppatori.
Estensioni di Visual Studio Code per Azure Estensioni di VS Code nell'IDE.
Git o Git per Windows Strumenti da riga di comando per il controllo del codice sorgente. Se si preferisce, è possibile usare uno strumento diverso per il controllo del codice sorgente.

Configurazione monouso per l'autenticazione

Per usare lo stesso codice di autenticazione nello sviluppo locale e nell'ambiente di hosting remoto di Azure, usare DefaultAzureCredential.

Creare un gruppo di risorse per il progetto

  1. Nel Web browser aprire il portale di Azure.

  2. Nella barra di ricerca immettere i gruppi di risorse e selezionarlo.

  3. Seleziona + Crea.

  4. Immettere le impostazioni del gruppo di risorse:

    Proprietà valore
    Subscription Selezionare la propria sottoscrizione.
    Gruppo di risorse Immettere il nome del gruppo di risorse. Questo nome del gruppo di risorse viene usato come parte di un URI delle risorse quando si accede a Resource Manager (piano di gestione). Il nome non viene usato per il controllo (ad esempio per la creazione di un database) o per il piano dati (inserimento di dati in una tabella).
    Area Selezionare un'area geografica per il gruppo di risorse.

  5. Selezionare Rivedi e crea per iniziare la convalida.

  6. Quando la convalida ha esito positivo, selezionare Crea.

Uso di Azure e delle librerie client di Azure SDK

Le librerie di Azure SDK vengono fornite singolarmente per ogni servizio. Ogni libreria viene installata in base al servizio di Azure che è necessario usare.

Ogni nuovo progetto che usa Azure deve:

  • Creare le risorse di Azure e salvare la configurazione o le chiavi associate in un percorso sicuro.
  • Installare le librerie di Azure SDK da npm o Yarn.
  • Usare le credenziali dell'entità servizio locale per eseguire l'autenticazione in Azure SDK, quindi usare le informazioni di configurazione per accedere a servizi specifici.

Protezione delle informazioni di configurazione

Sono disponibili diverse opzioni per archiviare le informazioni di configurazione:

  • Azure Key Vault per creare e gestire chiavi che accedono e crittografano le risorse, le app e le soluzioni cloud.
  • Dotenv è un noto pacchetto npm usato per leggere le variabili di ambiente da un file .env. Assicurarsi di aggiungere il file .env al file .gitignore in modo che il file .env non venga archiviato nel controllo del codice sorgente. Vedere altre informazioni sulle variabili di ambiente nelle app Web per Azure.

Creare variabili di ambiente per le librerie di Azure

Per usare le impostazioni di Azure richieste dalle librerie di Azure SDK per accedere al cloud di Azure, impostare i valori più comuni per le variabili di ambiente. I comandi seguenti impostano le variabili di ambiente per la workstation locale.

Negli esempi seguenti l'ID client corrisponde all'ID e al segreto dell'entità servizio.

AZURE_SUBSCRIPTION_ID="aa11bb33-cc77-dd88-ee99-0918273645aa"
AZURE_TENANT_ID="00112233-7777-8888-9999-aabbccddeeff"
AZURE_CLIENT_ID="12345678-1111-2222-3333-1234567890ab"
AZURE_CLIENT_SECRET="abcdef00-4444-5555-6666-1234567890ab"

Sostituire i valori mostrati in questi comandi con quelli dell'entità servizio specifica.

Creare un .env file

Un altro meccanismo comune consiste nell'usare il pacchetto npm DOTENV per creare un file .env per queste impostazioni. Se si prevede di usare , .envassicurarsi di non archiviare il file nel controllo del codice sorgente. Per assicurarsi che tali impostazioni vengano archiviate nel controllo del codice sorgente, il modo più semplice consiste nell'aggiungere il file .env al file .ignore di git.

Installa nuovi pacchetti npm

Per ogni progetto è consigliabile creare una cartella separata e un file package.json specifico seguendo questa procedura:

  1. Aprire un terminale, un prompt dei comandi o una shell bash e creare una nuova cartella per il progetto. Passare quindi alla nuova cartella.

    mkdir MY-NEW-PROJECT && cd MY-NEW-PROJECT

  2. Inizializzare il file di pacchetto:

    npm init -y

    In questo modo viene creato il file package.json e vengono inizializzate le proprietà minime.

  3. Installare le librerie di Azure SDK necessarie, ad esempio questo esempio:

    npm install @azure/ai-text-analytics@5.0.0

Usare il controllo del codice sorgente con Visual Studio Code

È consigliabile creare un repository del controllo del codice sorgente ogni volta che si avvia un progetto. È possibile eseguire questa operazione da Visual Studio Code.

  1. In Visual Studio Code selezionare l'icona del controllo del codice sorgente per aprire l'area Controllo del codice sorgente e quindi selezionare Inizializza repository per inizializzare un repository Git locale:

    Initialize git repository

  2. Dopo l'inizializzazione del repository e i file da archiviare nel controllo del codice sorgente, immettere il messaggio Initial commit e selezionare il segno di spunta per creare il commit iniziale dei file di origine.

    Complete an initial commit to the repository

  3. Creare un nuovo repository in GitHub o Azure DevOps e copiare l'URL del repository per il passaggio successivo.

  4. Nel terminale integrato di Visual Studio usare il comando git seguente per aggiungere il repository remoto al repository locale. Sostituire YOUR-ALIAS e YOUR-REPOSITORY con valori personalizzati.

    git remote add origin https://github.com/YOUR-ALIAS/YOUR-REPOSITORY

Visual Studio Code include molte funzionalità Git predefinite. Per altre informazioni, vedere Uso del controllo della versione in VS Code.

Passaggi successivi