4
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Sandcastleで始めるCESIUM ion 超入門(番外編)

Last updated at Posted at 2025-10-11

はじめに

今回はまず、コードを実行する環境「Node.js(ノード ジェイエス)」を準備します。

Node.js は Javascript の実行環境です。自分のパソコンにインストールして、Sandcaslte のコードを自分の手元で実行することができます。自分のパソコンに実行環境があれば、Sandcatsle でいい感じに動いたコードをコピペして、手元の Mac や Windows PC でコードを実行できるようになります。めちゃ便利です。

コードを書く→すぐに試す→ちょっと直す→すぐに試す、を何度も手早く繰り返せるようになるので、開発スピードが爆上がりします。Cesium 開発者は、みんなこの道を通ってプロになっています(たぶん😆)。

これまで Node.js のインストールでコケてた人も、ステップバイステップでゴールまで辿り着けるように、丁寧解説を心がけますね。

すでに Node.js をインストールしてある方、開発に慣れていて、ここで紹介する以外の方法で Node.js をインストールしたい方は、この項目を飛ばしていただいて大丈夫です。

この記事は 2025年8月7日 に書いています。以下で示している Node.js と関連ツールのバージョンは、みなさんがインストールを実行された時点での、もっと新しいものに変わっていると思いますが、そこは問題ありません。新しい方のバージョンを使ってください。

ソフトのインストール方法は Mac と Windows で異なります。

Mac に Node.js をインストールする

まずは、Node.js が入っているかを確認しておきます。
Mac のターミナル画面で「node -v」とタイプして実行(リターン)してみてください。

Mac の「ターミナル」アプリは、アプリケーションフォルダの下の方、「ユーティリティ」を開いた中にあります。
Macのターミナルの場所.png

ターミナル画面が出てきたら、「node -v」とタイプしてリターンしてみてください。
(Macだとターミナル画面の初期設定色は白だと思います。)

node -v

こんな感じのバージョン番号が表示されたら、Node.js が入っていますので、以下の Node.js インストールの手順は飛ばしてください。

v24.1.0

Node.js のホームページに行く

Node.js をインストールする方法は何種類かありますが、簡単なのは下記のリンクから Node.js のホームページを開くことです。

サイトが開いたら、「Install Node.js」ボタンを押します。

Nodejsのサイト.png

Macの場合はこの画面になりますので、「クリップボードにコピー」ボタンを押します。

MacにNode.jsをインストールする.png

そうすると「Node.js®をダウンロードする」画面に表示されているコードがコピーされますので、そのまま Mac のターミナル画面にペーストしてください。

# nvmをダウンロードしてインストールする:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

# シェルを再起動する代わりに実行する
\. "$HOME/.nvm/nvm.sh"

# Node.jsをダウンロードしてインストールする:
nvm install 22

# Node.jsのバージョンを確認する:
node -v # "v22.18.0"が表示される。
nvm current # "v22.18.0"が表示される。

# npmのバージョンを確認する:
npm -v # "10.9.3"が表示される。

これらのコマンド群を実行する(リターンすると)と、Node.js 本体は ユーザのホームフォルダの中の、「.nvm/versions/node/」にインストールされます。

以下を実行すると、zsh: command not found という警告が出まくります。
それでも、インストールは進みますので、気にせず行ってください。

実行してみると、ターミナルウインドウにはこのように表示されると思います。

zsh: command not found: #
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100 16631  100 16631    0     0  86970      0 --:--:-- --:--:-- --:--:-- 86619
=> nvm is already installed in /Users/yutaka/.nvm, trying to update using git
=> => Compressing and cleaning up git repository

=> nvm source string already in /Users/yutaka/.zshrc
=> bash_completion source string already in /Users/yutaka/.zshrc
=> Close and reopen your terminal to start using nvm or run the following to use it now:

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion
zsh: command not found: #
zsh: command not found: #
Downloading and installing node v22.18.0...
Downloading https://nodejs.org/dist/v22.18.0/node-v22.18.0-darwin-arm64.tar.xz...
######################################################################### 100.0%
Computing checksum with shasum -a 256
Checksums matched!
Now using node v22.18.0 (npm v10.9.3)
zsh: command not found: #
v22.18.0
v22.18.0
zsh: command not found: #
10.9.3

ところどころに、ちょっと気になる表示がありますね。

zsh: command not found: #

これは、# で始まるコメント行の部分がエラーになっているのでした。
以下のような行です。# で始まっている行は後でコードを見た時に、そこで何をやっているのか、理解しやすくするためのメモなのですが、プログラムではないので、エラー表示が出ます。でも実害はありません。放置でOKです!

Node.js がインストールできた!

さて、ちゃんとNode.jsがインストールされたか気になりますが、その結果も表示されています。

ここのとこ。

v22.18.0
v22.18.0

これは、コピペしたコードのこの部分の実行結果として、Node.js(Node 本体)と nvm(Node.js のバージョン管理ツール)のそれぞれのバージョン番号が表示されたものです。

# Node.jsのバージョンを確認する:
node -v # "v22.18.0"が表示される。
nvm current # "v22.18.0"が表示される。

最後のこれ。

10.9.3

この部分は以下のコードの実行結果で、npm(Node.js の管理ツール)のバージョンが表示されています。

# npmのバージョンを確認する:
npm -v # "10.9.3"が表示される。

以上で、Mac への Node.js のインストールが完了です。

Windows にインストールする

まず、Node.js のバージョン管理ツールである nvm をインストールします。
こちらの URL を開きます。

画面が開いたら、少し下にスクロールして、Assets という項目を見つけます。
その中にある、nvm-setup.exe をダブルクリックしてダウンロードします。

nvm-setup.exe.png

ダウンロードができたら、「ファイルを開く」

nvm-setup.exeを実行.png

確認画面が出ますので、「はい」を選択

nvmインストール確認.png

ライセンス条項に同意を求められるので、「I accept ...」を選んで Next

I accept.png

nvm の置き場所を聞かれます。
そのまま「Next」すれば、Wimdowsにログインしているユーザーの、ホームディレクトリの下におかれます。

インストール先.png

さらに、Node.js の配置先を聞かれます。これもこのまま「Next」で。

ActiveVersionの配置先.png

新バージョンのお知らせなどを表示するか聞かれます。
このまま「Next」しておきましょう。

お知らせ設定.png

メアドを登録しておけば、お知らせしてもらえます。

メアド.png

これで準備完了です。
「Install」を押します。

スクリーンショット 2025-08-08 19.08.28.png

インストール中...

プログレスバー.png

「Finish」を押してください!

完了.png

㊗️これで、Windows に Node.js をインストールできました。
ちょっと大変でしたね。

4
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?