Cosmos Surge 

# Cosmos Surge 

![favicon-9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/cbdabe18-b23d-6966-e5af-119f5c0fd790.png)

[Cosmos Surge](https://github.com/Sun-June/cosmos-surge)はAzure Cosmos DBのデータレイヤーのクライアントツールです。

主な目的は、開発者またはデータ管理担当者がデータをより便利に管理および操作できるようにすることです。

github: https://github.com/Sun-June/cosmos-surge

![main.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/d0d8ad35-9ec0-ba74-5a4c-816518f02ea4.png)


## 使い方

### オプション1：クライアントのダウンロード：

* 提供されたリンクからクライアントをダウンロードします。
    * [Releases](https://github.com/Sun-June/cosmos-surge/releases)
* クライアントをシステムにインストールします。
* アプリケーションを起動し、使用を開始します。

### オプション2：Dockerを使用して実行：

* システムにDockerがインストールされていることを確認します。
* Docker HubからCosmos Surge Toolのイメージを取得します。
    * `docker pull sunjune/cosmos-surge:latest`
* Dockerコンテナ内でツールを実行します。
    * `docker run --name cosmos-surge -d -p 1212:9999 sunjune/cosmos-surge`
* 最後に、Webブラウザを開いてください。
    * http://localhost:1212

## 操作手順

* まず、データベースリンクを追加するために Add または Create Link をクリックします。
  * ![step1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/24a1bee4-6ff2-8e11-39e2-383b09d3da30.png)
  * `name`はこのリンクのカスタム名です。
  * `connectionString`はCosmos DBの接続文字列で、ここにはローカルエミュレーターの例があります。
  * リンクが有効かどうかを確認するには、`test` をクリックできます。
  * すべて正しい場合は、`Save` をクリックして追加します。
* 成功裡に追加した後、左側にメニューアイテムが表示され、ホバーすると以下の3階層メニューが表示されます。
  * ![step2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/db84eb65-afe0-4b08-8665-cfa5fcc63f62.png)
  * `TestData2`、`TestData`、`BF`はCosmos内の `database id` に対応しています。
    * `TestData` の下の `Data1`、`Data2`、`Data3` はCosmos内の `container id` に対応しています。
  * `REFRESH`は現在のメニューアイテムをリフレッシュするためです。
  * `EDIT`はリンクを再編集するためです。
  * `DELETE`は現在のリンクを削除するためです。
* 三階層メニューの `Data1` をクリックすると、以下の操作インターフェースが表示されます。
  * ![step3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/5d50a242-2b00-2cb3-172d-4b32dec00a4e.png)
  * メインインターフェースのタブは現在の `container` の操作パネルです（複数同時に開けます）。
  * リストには現在のデータベース内の `partition` の分類が表示され、選択してクエリでき、クエリ結果はページ分割されます。
* クエリをクリックした後、結果は以下のように表示されます：
  * ![step4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/7b131465-c167-1c56-fb66-005c527cbb35.png)
  * インターフェースでは、上部が選択された `partition` と関連する操作ボタンです。
  * 中央部分は対応するクエリSQLとページネーション情報です。
    * SQLは編集でき、編集後は `query` をクリックしてクエリを実行できます。
  * 下部は主要なクエリコンテンツを表示して、表示、変更、削除ができます。
* データを変更した後は、`Update items` をクリックして更新できます：
  * ![step5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/db3f58cc-7fdb-5573-428c-16224bc0d6d7.png)
  * 図に示すように、更新操作は今回変更されるデータの比較を表示します。
  * 確認後、`update` をクリックして更新操作を実行します。
* 削除操作も行えます。データを削除した後、`Delete items` をクリックして削除できます：
  * ![step6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/39e85af7-cf68-7e50-9ca8-a81699265d00.png)
  * 表示されるのは削除するデータです。確認後、`delete` をクリックして削除を確認します。
* `Functions`ボタングループ：
  * `add`をクリックすると新しいデータを追加できます。
  * `history`をクリックすると操作履歴を表示できます。
    * ![step7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/b731d4c0-c75e-99e0-359b-8471e00997ec.png)
    * タブは操作の種類です。
    * 現在のページは直前に実行した更新ログで、`update details...` をクリックするとその時のデータが表示されます。
  * `export` ボタンは、現在のクエリ結果データを別の `container` にインポートできます。
    * ![step8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/ae14989b-9405-c9c3-6f71-ede006f30932.png)
    * `toId` は選択したターゲット `container` です。
    * `Handling duplicate data` は同じデータを処理する方法です（つまり、同じidとpartitionを持つデータ）。
      * `upsert`は強制的な更新です。
      * `skip`は処理せずにスキップします。
    * 確認後、`Do` をクリックして実行を開始します。
    * 実行インターフェースは次のとおりです：
      * ![step9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3568363/57cfd655-8f02-f0be-ffd4-46aedb73be82.png)
      * 実行インターフェースは閉じることができます。
      * さまざまな進捗情報と対応するSQLステートメント情報が含まれています。
      * 右上隅には一時停止とキャンセルボタンがあります。

## ローカル開発またはパッケージング

### ローカル開発

* まず、ビューレイヤーのプロジェクトをクローンします。アドレス： [cosmos-surge-view](https://github.com/Sun-June/cosmos-surge-view) .
  * 最初に `npm install` コマンドを実行します。
  * 次に、`npm run dev` を実行します。
* 現在のプロジェクトもクローンします。
  * まず、コマンド `npm install` を実行してください。
  * その後、`npm run start` を実行してください。
* これでElectronが起動し、デバッグ開発ができます。

### ローカルパッケージング

* また、ビューレイヤーのプロジェクトもクローンする必要があります。アドレス： [cosmos-surge-view](https://github.com/Sun-June/cosmos-surge-view) .
    * まず、コマンド `npm install` を実行してください。
    * その後、`npm run build` を実行してください。
    * dist ディレクトリ内のファイルを準備し、次に進みます。
* 現在のプロジェクトもクローンしてください。
    * まず、コマンド `npm install` を実行してください。
    * 次に、ビューレイヤープロジェクトから上記で準備した dist ディレクトリの内容を static ディレクトリにコピーしてください。
      * staticディレクトリが存在しない場合、作成してください。
    * 最後に、ご自身のプラットフォームに合わせて次のコマンドを実行してください。
      * mac: `npm run package:mac`.
      * windows: `npm run package:win`.