Denoを試す

2024.12.08

Denoを使ってみたくなったので、その時の体験記的な話を少し書いてみます。

Denoの導入動機

最近の私は、AIの自動生成に興味を持っています。GoogleのGeminiやMicroSoftのCopilotなどで気軽に、かつ、無料でテキスト生成を試せるようになったことも、背景にあります。そんな中、Googleが作ったGemini AIは、

  • 各種言語からAPIを使って利用することができ、いろいろと便利な使い道がありそう。
  • しかも現時点では無料。ちょっと試すには最適。

というところに興味を引かれ、試しにプログラミングに挑戦しようかと思いました。

しかし、セキュリティ上の懸念からブラウザ用のJavaScriptでGemini AIを操作してはなりません。GeminiAIを利用するには発行されるAPIを使う必要がありますが、これを他人に知られてしまうと悪用される可能性があるからです。ブラウザ用のJavaScriptはブラウザの機能を用いれば誰でも簡単に見えてしまいます。APIキーが誰にでも簡単に見られて、盗まれてしまいます。それを避けるには、他人から簡単には見られないようにしなければならず、サーバーサイドで動作するJavaScriptを使う必要があります。

そこで、サーバーサイド側で何を使うか？ということになりますが、Denoを選んでみました。
Denoを選んだ決定的な理由はなかったのですが、

  • これを書いている段階では、V2版がリリースされたということでネットでも頻繁にDenoの記事を見ることが多く、興味を引いた。
  • Node.jsは少し使ったことがあるが、ライブラリをnpmで管理するなど、少し面倒に感じた。
  • スキルアップのための新しいことへの挑戦。使えないなら、他の選択肢を探ることになる。

といったあたりが理由になります。

Denoの導入と環境設定

これは、ネットで検索すればいろいろ出てくるので書くつもりはありません。ただ、Denoインストールマニュアルの日本語版は、これを書いている時点では内容が古いようで、少し困惑しました。中途半端に正しいマニュアルって、困りますよね…。

Hello World!

とりあえずは、定番Hello Worldです。以下がコードです。

console.log('Hello, World!');

以下は実行logです。

> deno run hello1.ts
Hello, World!

サーバー

本来の目的であるサーバーに挑戦です。以下がコードです。

Deno.serve(handler);

function handler (_req: Request){
    return new Response("Hello, World!");
}

以下が実行logです。

> deno run --allow-net hello_server1.ts
Listening on http://0.0.0.0:8000/

ブラウザでlocalhost:8000にアクセスすると、Hello, world!が表示されます。

VSCodeの拡張

私はVSCode(Visual Studio Code)で開発をしています。VSCodeで編集していると、lint機能が働き、hello_server1.ts に対してエラーが出ます。

TypeScirpt的には"Deno"が未定義であるためで、「名前 'Deno' が見つかりません。」という内容の疑似エラーになってしまいます。

これでは本当のエラーも見過ごしてしまいかねません。ずっと疑似エラーが表示されるのは気になってしまい、精神衛生上もよろしくありません。そこで、Deno用のVSCode拡張機能 Deno を入れました。これは検索で、"deno"で検索するとすぐ見つかります。

拡張機能を追加しただけではダメで、VSCodeの設定が必要です。

{
    "deno.enable": true
}

これで、"Deno"に対する疑似エラーがなくなります。

ファイルサーバー

ファイルサーバー…というか、そのままWebサーバーも簡単に作れるようです。

import { serveDir } from "https://deno.land/std@0.224.0/http/mod.ts"
Deno.serve(handler);

function handler (_req: Request){
    return serveDir(_req);
}

なお、importの"std@0.224.0"の部分は、この記事を書いているときの最新バージョンです。
このコードを参考にされる方は、その時点での最新バージョンに応じて、変えてください。

以下が実行ログです。

> deno run --allow-net --allow-read  file_server1.ts
Listening on http://0.0.0.0:8000/

これでは、正しく動いているのかわからないので、別ターミナルを開いて、curlで確認してみました。

> curl localhost:8000/hello1.ts
console.log('Hello, World!');

hello1.tsの中身がそのまま表示されました。
htmlやcssファイルも配置すれば、普通にページが見えるはずですね。

コメント