Alıştırma - Visual Studio Code’da Node.js uygulaması oluşturma - Training

10 dakika

Bu ünitede Visual Studio Code kullanarak kaynaklarınızı içeren Azure korumalı alanında bir Node.js uygulaması derleyin ve çalıştırın.

Cosmos DB Core (SQL) veritabanınızla program aracılığıyla çalışmanızı sağlayan npm paketlerini yükleyin.
Contoso ürünleri veri kümesini bir kapsayıcıya yükleyen JavaScript kodu yazın.

Not

Bu alıştırmada, masaüstü bilgisayarınıza zaten Node.js ve npm yüklediğiniz ve Learn korumalı alanınızı başlattığınız ve Visual Studio Code'da buna bağlandığınız varsayılır.

Node.js proje oluşturma

Node.js uygulamanızı istediğiniz klasör konumunda bir terminal kullanın. Visual Studio Code'un konumunda açılması için aşağıdaki komutu girin.
```
code .
```
Terminal menüsünde Yeni Terminal'i seçin veya Ctrl + Shift` + klavye kısayolunu kullanın.
Terminal penceresinde aşağıdaki komutu çalıştırarak Node uygulaması için contoso-retail adlı yeni bir klasör oluşturun ve bu klasöre geçin.
```
mkdir contoso-retail && cd contoso-retail
```
Yeni bir Node uygulaması başlatmak üzere taşımak için aşağıdaki komutları girin.
```
npm init -y
```
npm init komutu bir package.json dosyası oluşturur ve bu dosyanın içeriklerini görüntüler. Bu dosya, uygulama için ilk meta verileri ve varsayılan ad, açıklama ve giriş noktasını içerir.
Visual Studio Code'daki Dosya menüsünde Klasörü aç'ı seçin ve contoso-retail klasörünü açın.
Gezgin penceresinde package.json dosyasını seçin.

Düzenleyici bölmesinde, package.json dosyası için aşağıdakileri değiştirin:

Özellik	Değer
type	`module` - modülün JavaScript kodu ES6 söz dizimini kullanır

Dosya aşağıdaki gibi görünmelidir. Örnek kod ES6 söz dizimini kullandığından, uygulamanın türünü modül olarak ayarlamanız gerekir.

{
    "name": "contoso-retail",
    "version": "1.0.0",
    "description": "Student and course grades maintenance",
    "main": "index.js",
    "type": "module",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "keywords": [],
    "author": "",
    "license": "MIT"
}

Dosya menüsünde Kaydet’i seçin.

Visual Studio Code'un dosya değişikliklerini otomatik kaydetmesini yapılandırma

Dosya Tercihleri Ayarları, Ctrl + , kullanarak otomatik kaydetmeyi açın.> >
Dosyaları otomatik kaydetme araması.
1000'in afterDelay'ını seçin.

.gitignore dosyası oluşturma

.gitignore dosyası, eklenmemesi gereken dosyaları kaynak denetimine denetlemenizi engeller.

adlı .gitignore Ctrl + N adlı bir dosya oluşturun ve aşağıdakini ekleyin.

node_modules
.env

Gizli dizi ortam dosyası oluşturma

Visual Studio Code'da, Dosya menüsünde Yeni Metin Dosyası'nı seçin.
Dosya menüsünde Farklı Kaydet’i seçin. Yeni dosyayı adıyla .envkaydedin.

Dosyaya aşağıdaki değişkenleri ekleyin:

COSMOS_CONNECTION_STRING=
COSMOS_DATABASE_NAME=ContosoRetail
COSMOS_CONTAINER_NAME=Products
COSMOS_CONTAINER_PARTITION_KEY=categoryName

Kaynakları görmek için Azure gezgininde Shift + Alt + A aboneliğinizi ve ardından Azure Cosmos DB düğümünü seçin.
Cosmos DB hesabınıza sağ tıklayın ve bağlantı dizesi Kopyala'yı seçin.
bağlantı dizesi .env COSMOS_CONNECTION_STRING değişkeninin dosyasına yapıştırın.

Cosmos DB paketini yükleme

Tümleşik terminalde Cosmos DB SDK'sını ekleyin.
```
npm install @azure/cosmos
```
Tümleşik terminalde, dosyayı ortam değişkenleri için kullanmak .env üzere npm paketini ekleyin. Bu paket dosyayı okur .env ve bu değerleri çalışma zamanı nesnesine process.env ekler.
```
npm install dotenv
```

Ürün şekli

Belgedeki JSON'ı anlamak, işlemlerin ve yanıtların girişini anlamanıza yardımcı olur.

Bu veri kümesindeki ürünler aşağıdaki şekle sahiptir:

{
      "id": "FEEFEE3B-6CB9-4A75-B896-5182531F661B",
      "categoryId": "AE48F0AA-4F65-4734-A4CF-D48B8F82267F",
      "categoryName": "Bikes, Road Bikes",
      "sku": "BK-R19B-52",
      "name": "Road-750 Black, 52",
      "description": "The product called \"Road-750 Black, 52\"",
      "price": 539.99,
      "tags": [
        { "id": "461ADE06-0903-4BAF-97AB-CC713E5B1DD4", "name": "Tag-174" },
        ...
      ],
      "inventory": [
        { "location": "Dallas", "inventory": 91 },
        ...
      ]
    }

Özellik	Açıklama
id	Cosmos DB, her öğeyi benzersiz olarak tanımlamak için özel tanımlayıcı olan id'yi kullanır. Kimlik, sayı, dize vb. gibi herhangi bir veri türü olabilir. Kimliği sağlamazsanız Cosmos DB sizin için bir kimlik oluşturur.
categoryName	Bu özellik, bölüm anahtarı olarak özellikle bu veri kümesi için seçilir. Ürün kategorisi adı, bölüm anahtarı için ideal olan verilerin eşit bir dağıtımını sağlar. Ayrıca categoryName, bölüm anahtarı için önemli olan sıklıkla değişmez.
etiketler ve envanter	Bunlar, anahtar sözcüğünü kullanarak `JOIN` sorguların sonuçlarını bulmak ve yeniden şekillendirmek için kullanılabilecek alt özellikleri temsil edebilir.

Kapsayıcıya ürün eklemek için betik oluşturma

Visual Studio Code'da, Dosya menüsünde Yeni Metin Dosyası'nı seçin.
Dosya menüsünde Farklı Kaydet’i seçin. Yeni dosyayı 1-contoso-products-upload-data.js adıyla kaydedin.

Aşağıdaki JavaScript'i kopyalayın ve dosyaya yapıştırın.

import * as path from "path";
import { promises as fs } from "fs";
import { fileURLToPath } from "url";
const __dirname = path.dirname(fileURLToPath(import.meta.url));

// Get environment variables from .env
import * as dotenv from "dotenv";
dotenv.config();

// Get Cosmos Client
import { CosmosClient } from "@azure/cosmos";

// Provide required connection from environment variables
const cosmosSecret = process.env.COSMOS_CONNECTION_STRING;

// Authenticate to Azure Cosmos DB
const cosmosClient = new CosmosClient(cosmosSecret);

// Set Database name and container name
const databaseName = process.env.COSMOS_DATABASE_NAME;
const containerName = process.env.COSMOS_CONTAINER_NAME;
const partitionKeyPath = [`/${process.env.COSMOS_CONTAINER_PARTITION_KEY}`];

// Create DB if it doesn't exist
const { database } = await cosmosClient.databases.createIfNotExists({
  id: databaseName,
});

// Create container if it doesn't exist
const { container } = await database.containers.createIfNotExists({
  id: containerName,
  partitionKey: {
    paths: partitionKeyPath,
  },
});

// Get product data
const fileAndPathToJson = "products.json";
const items = JSON.parse(await fs.readFile(path.join(__dirname, fileAndPathToJson), "utf-8"));

let i = 0;

// Insert products into container
for (const item of items) {
  const { resource, activityId, statusCode } = await container.items.create(item);
  console.log(`[${i++}] activityId: ${activityId}, statusCode: ${statusCode}, ${resource.name} inserted`);
}

// Show container name - copy/paste into .env
console.log(`\n\ncontainerName: ${containerName}`);// 

// Run script with 
// node 1-contoso-products-upload-data.js

products.json adlı yeni bir dosya oluşturun ve products.json örnek veri dosyasının içeriğini kopyalayın.

Dosya bir JSON nesneleri dizisi içerir.
Visual Studio Code terminalinde JavaScript dosyasını yürüterek verileri Cosmos DB kapsayıcısına yükleyin:
```
node 1-contoso-products-upload-data.js
```
Terminalde öğe sayısı, activityId, statusCode ve öğe adı görüntülenir.

İşlemin sonuç nesnesi

Bir işlemden döndürülen sonuç nesnesi Cosmos DB SQL başvuru belgelerinde belgelenmiştir. Sonucun işleme özgü bilgileri olsa da, her sonucun her zaman döndürülen bazı özellikleri vardır ve ne olduğunu belirlemek için yararlıdır.

Result özelliği	Açıklama
activityId	Belirli işlemle ilişkili benzersiz olay kimliği. Bu kimlik, kaynak adınız ve aboneliğinizle birlikte, işleminiz başarısız olursa ve desteğe başvurmanız gerekiyorsa sorunu belirlemenize yardımcı olabilir.
statusCode	İşlemin başarısını veya başarısızlığını gösteren HTTP durum kodu.
kaynak	Bu, bir kapsayıcıdaki JSON belgesi gibi son nesnenin JSON nesnesidir.

Visual Studio Code'da Cosmos DB belgelerini görüntüleme

Visual Studio Code'da Azure gezginini açın veya Shift + Alt + A klavye kısayolunu kullanın.
Concierge Aboneliği düğümünü ve ardından Azure Cosmos DB kaynakları düğümünüzü bulun ve genişletin.
ContosoRetail veritabanınızı ve Products kapsayıcısını bulun ve genişletin.
Node.js betiğinin eklediği ürünleri görmek için Belgeler düğümünü genişletin. Her belgenin düğüm adı name özelliğidir.
JSON'un tamamını görmek için ilk ürünü seçin.

Çalışmanızı denetleyin

Visual Studio Code'da, Azure Veritabanları uzantısında Cosmos DB hesabınızı, veritabanınızı ve kapsayıcınızı görürsünüz.
Kapsayıcınızı genişlettiğinizde Belgeler düğümünüzün altında birçok öğe görürsünüz.

Devam et

Alıştırma - Visual Studio Code’da Node.js uygulaması oluşturma