ローカル環境での開発
この クイックスタート では Dfinity Canister SDK を初めてインストールする方が、スマートコントラクトを Internet Computer のブロックチェーンにデプロイするのではなく、 ローカルの実行環境 にデプロイし、動作させることを想定しています。
まず最初に greet
という関数を1つだけ持つシンプルな Hello Canister をビルドしデプロイしてみます。 greet
関数は1つの引数を受けとり、その結果を Hello, everyone! のように返します。コマンドラインで Canister を実行した場合はターミナルに、ブラウザで Canister にアクセスした場合は HTML で表示されます。
始める前に
DFINITY Canister SDK をダウンロードしてインストールする前に、以下のことを確認してください。
-
インターネットに接続されている macOS または Linux コンピュータでターミナルにアクセスできること。
現在 DFINITY Canister SDK は、macOS または Linux の OS を搭載したコンピュータでのみ動作します。
-
フロントエンド開発用のテンプレートファイルをプロジェクトに含めたい場合は、
node.js
がインストールされている必要があります。
このチュートリアルは、ターミナルを開いてコマンドを実行するなど、コンピュータ上で一般的な作業を行う方法を知っていることを前提としています。
コンピュータで新しいターミナルを開く方法や、node.js
をインストールする方法がわからない場合は、初めての人のための準備 を参照してください。
準備ができたら ダウンロードとインストール に進みます。
ダウンロードとインストール
最新の DFINITY Canister Software Development Kit (SDK) を、コンピュータのターミナルから直接ダウンロードすることができます。
ダウンロードしてインストールするには:
-
ローカルコンピュータでターミナルを開きます。
例えば、「アプリケーション」から「ユーティリティ」を開いて、「ターミナル」をダブルクリックするか、⌘+スペースキー を押して「検索」を開き、
terminal
と入力します。 -
以下のコマンドを実行して、DFINITY Canister SDK パッケージをダウンロードしてインストールします。
sh -ci "$(curl -fsSL https://smartcontracts.org/install.sh)"
このコマンドは、DFINITY コマンドラインインターフェース(CLI)及びその依存関係をローカルコンピュータにインストールする前に、使用許諾契約書を読み同意するよう促します。
-
y
と入力し、Return を押すと、インストールが続行されます。このコマンドは、コンピュータにインストールされているコンポーネントに関する情報を表示します。
SDK の確認
インストールスクリプトでエラーがなければ、プログラム開発を始めるために必要なすべてのものが、ローカルコンピュータ上で利用可能になります。
SDK を使用できることを確認するには:
-
ローカルコンピュータでターミナルを開きます(まだ開いていない場合)。
-
次のコマンドを実行して、DFINITY コマンドラインインターフェース(CLI)がインストールされ
dfx
コマンドが実行可能であることを確認します。dfx --version
このコマンドは、以下のような
dfx
コマンドのバージョン情報を表示します。dfx 0.9.3
-
他の
dfx
コマンドの使用方法は、以下のコマンドを実行してください。dfx --help
このコマンドは、
dfx
とそのオプション情報を表示します。
新しいプロジェクトの作成
Internet Computer の Dapps 開発はプロジェクトとして始めます。 プロジェクトはdfx コマンドで作成できます。
このチュートリアルでは、プロジェクトのスターターファイルを使ったアプリケーション作成について説明するために、デフォルトのサンプルアプリケーションの作成から始めます。
新しいプロジェクトを作成すると、dfx
コマンドラインインターフェイスは、ワークスペースにデフォルトのプロジェクトディレクトリを追加します。プロジェクトディレクトリを構成するテンプレートファイルについては、デフォルトプロジェクトの確認 で説明しています。
新しいプロジェクトを作成する手順:
-
ローカルコンピュータでターミナルを開きます。
-
以下のコマンドを実行し、
hello
という名前の新しいプロジェクトを作成します。dfx new hello
dfx new hello
コマンドは、新しいhello
プロジェクトディレクトリ、テンプレートファイル、そして新しい Git リポジトリを作成します。もし別のプロジェクト名を使った場合は、使った名前をメモしておいてください。以下の手順では、
hello
プロジェクト名の代わりにそのプロジェクト名を使用してください。 -
以下のコマンドでプロジェクトディレクトリに移動します。
cd hello
ローカル環境での開発を始める
最初のプロジェクトをビルドする前に、Canister 実行環境に接続する必要があります。 ベスト・プラクティスとして、2つのターミナルを開いておいてください。これにより、1つのターミナルで Canister の動作を確認し、別のターミナルでプロジェクトを管理することができます。
ローカルでの Canister 実行環境の準備:
-
ローカルコンピュータで新しいターミナルを開きます。
-
必要に応じて、プロジェクトのルートディレクトリに移動します。
これで、2つのターミナルが開き、両方のターミナルでプロジェクト・ディレクトリがカレント・ワーキング・ディレクトリになっているはずです。
-
2つ目のターミナルで以下のコマンドを実行して、ローカルな Canister 実行環境を開始します。
dfx start
お使いのプラットフォームのセキュリティ設定によっては、警告が表示される場合があります。 ネットワーク接続を許可するかどうかのプロンプトが表示された場合は、Allow をクリックします。
-
Canister の実行が表示されているターミナルを開いたままにして、最初のターミナルにフォーカスを切り替えます。
残りの手順は、Canister の実行操作が表示されていないこちらのターミナルで行います。
アプリケーションの登録とビルド、デプロイ
ローカルの Canister 実行環境に接続すると、アプリケーションの登録とビルド、デプロイが可能になります。
最初のアプリケーションをローカル環境にデプロイするには
-
プロジェクトのルート・ディレクトリにいることを確認します。
-
以下のコマンドを実行して、プロジェクト・ディレクトリで
node
モジュールが利用可能であることを確認します。npm install
このステップについてさらに情報が欲しい場合は node がプロジェクトで利用可能であることを確認する を参照してください。
-
以下のコマンドで、あなたの最初のアプリケーションを登録、ビルドそしてデプロイします。
dfx deploy
dfx deploy
コマンドの出力には、実行した結果が表示されます。 例えば、このステップではhello
メインプログラムとhello_assets
フロントエンドUI用の2つの Canister 識別子を登録し、以下のようなインストール情報を表示します。Creating a wallet canister on the local network. The wallet canister on the "local" network for user "default" is "rwlgt-iiaaa-aaaaa-aaaaa-cai" Deploying all canisters. Creating canisters... Creating canister "hello"... "hello" canister created with canister id: "rrkah-fqaaa-aaaaa-aaaaq-cai" Creating canister "hello_assets"... "hello_assets" canister created with canister id: "ryjl3-tyaaa-aaaaa-aaaba-cai" Building canisters... Building frontend... Installing canisters... Creating UI canister on the local network. The UI canister on the "local" network is "r7inp-6aaaa-aaaaa-aaabq-cai" Installing code for canister hello, with canister_id rrkah-fqaaa-aaaaa-aaaaq-cai Installing code for canister hello_assets, with canister_id ryjl3-tyaaa-aaaaa-aaaba-cai Authorizing our identity (default) to the asset canister... Uploading assets to asset canister... /index.html 1/1 (573 bytes) /index.html (gzip) 1/1 (342 bytes) /index.js 1/1 (605692 bytes) /index.js (gzip) 1/1 (143882 bytes) /main.css 1/1 (484 bytes) /main.css (gzip) 1/1 (263 bytes) /sample-asset.txt 1/1 (24 bytes) /logo.png 1/1 (25397 bytes) /index.js.map 1/1 (649485 bytes) /index.js.map (gzip) 1/1 (149014 bytes) Deployed canisters.
別の名前でプロジェクトを作成した場合、
hello
やhello_assets
ではなく、プロジェクトの名前になります。また、最初のデプロイ時には、
dfx
はdefault
アイデンティティと、default
アイデンティティが管理するローカルの Cycle ウォレットを作成することに注意してください。 Cycle ウォレットは特別なタイプの Canister で、Cycle を他の Canister に転送することができます。このサンプルアプリケーションをローカルにデプロイするためには、デフォルトの開発者アイデンティティ、Cycle ウォレットの使用、Cycle の管理などについて特に知る必要はありません。これらのトピックについては後ほど説明しますが、今のところ、これらが自動的に作成されることを覚えておいてください。
-
以下のコマンドを実行して、
hello
キャニスターと定義済みのgreet
関数を呼び出します。dfx canister call hello greet everyone
このコマンドを詳しく見てみましょう。
-
dfx canister call
コマンドでは、Canister 名と、呼び出すメソッドまたは関数を指定する必要があります。 -
hello
は呼び出したい Canister の名前を指定します。 -
greet
はhello
Caniser で呼び出したい関数の名前を指定します。 -
everyone
はgreet
関数に渡したいテキスト型の引数です。
ただし、別の名前でプロジェクトを作成した場合は、Canister 名がプロジェクト名と一致するので、コマンドラインを
hello
の代わりに使用した名前に合わせて変更する必要があります。 -
-
コマンドが
greet
関数の戻り値を表示することを確認してください。例:
("Hello, everyone!")
フロントエンドアプリケーションのテスト
アプリケーションのデプロイとコマンドラインを使った動作テストが終わったので、Webブラウザを使ってフロントエンドにアクセスできるかどうかを確認してみましょう。
-
開発サーバーを
npm start
で起動します。 -
ブラウザを開きます。
-
http://localhost:8080/ にアクセスします。
このURLにアクセスすると、サンプルのアセット画像ファイル、入力フィールド、ボタンを含むシンプルなHTMLページが表示されます。 例えば、以下のようになります。
+
-
挨拶を入力し、 Click Me をクリックすると挨拶が返ってきます。
例:
ローカルの Canister 実行環境の停止
ブラウザでアプリケーションをテストした後は、ローカルの Canister実行環境を停止して、バックグラウンドで実行し続けないようにします。
ローカルの実行環境を停止するには、以下の手順に従います。
-
開発サーバが表示されているターミナルで、Control-C を押して開発サーバのプロセスを中断します。
-
Canister 実行操作を表示しているターミナルで、Control-C を押してローカル・ネットワーク・プロセスを中断します。
-
以下のコマンドを実行して、ローカル・コンピュータ上で動作しているCanister 実行環境を停止します。
dfx stop
次のステップ
このクイックスタートでは、独自の Dapps を開発するための基本的な流れを紹介するために、いくつかの重要なステップにのみ触れています。 他のドキュメントには、Motoko の使い方や Internet Computer ブロックチェーン上で動作する Dapps の開発方法を学ぶための、より詳細な例やチュートリアルなどもあります。
次のステップに進むために以下も参考にしてください。
-
Tutorials ローカルの Canister 実行環境を使用して、シンプルな Dapps を構築するためのチュートリアルです。
-
Convert ICP tokens to cycles Internet Computer ブロックチェーンへのアプリケーションのデプロイを可能にするために、ICPトークンを Cycle に変換します。
-
On-chain deployment Cycle を所持し、Internet Computer ブロックチェーンのメインネットにアプリケーションをデプロイします。
-
What is Candid? Candid インターフェース記述言語がどのようにサービスの相互運用性とコンポーザビリティを可能にするかを学びます。
-
Motoko at-a-glance Motoko についての機能と構文について学ぶことができます。