🦊

【2021年版】HaxeでWebAPI実装のベストプラクティス(?)

2021/06/25に公開

概要

HaxeでWebApiを実装したくなったときに何を選べばよいか(開発環境、ライブラリ、手順などなど)が自分の中で固まってきたので整理のためにここに記載します。

前準備

Haxeあんまり知名度無い気がするのでインストール手順から書きます...

Haxeのインストール

Haxe公式サイトからインストーラーをダウンロードしてきてインストールします。
2021年6月25日現在のバージョンは 4.2.2 です。

https://haxe.org/

VSCodeのインストール

2021年6月25日現在、Haxeが一番書きやすいエディタはVS Codeです(たぶん)
大抵の人は既にインストールされているかと思いますが、していない人はインストールしましょう。

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

VSCodeのHaxe拡張をインストール

VSCodeの拡張機能で haxe で検索してトップに出てきたこれをインストールしてください。

node.jsのインストール

公式サイトからインストーラーをダウンロードしてきてインストールします。
https://nodejs.org/ja/

手順

プロジェクトディレクトリの作成

任意の場所にディレクトリ( or フォルダ )を作成してください。
以降、上記で作成したディレクトリを「作業ディレクトリ」と記載します。

Haxeプロジェクト作成

上記手順で作成したディレクトリ内でVSCodeを開きます。
Ctrl + Shift + P でコマンドパレットを開いて haxe init と入力すると Haxe: Initialize Project のメニューが出てくるので実行します。

作業ディレクトリにソースのひな形、build.hxml が生成されます。

jsのビルド設定をする

生成された build.hxml を開きます。
初期状態は以下のような内容になっているはずです。

-cp src
-D analyzer-optimize
-main Main
--interp

このままではインタープリターモードになっているのでjsを生成できるように以下のように修正します。
--js {file path} は「このパスに生成したjsを出力します」という指定になります。

-cp src
-D analyzer-optimize
-main Main
--js dest/main.js

npm init

作業ディレクトリで以下のコマンドを実行して初期化します。
色々と入力を聞かれますが適当に入れておいてください。

npm init

dts2hxの導入

TypeScript定義からHaxe用externを生成するツールを導入します。
以下のコマンドでインストールします。

npm install dts2hx

ついでにExpressもインストールしておきます。

npm install express
npm install @types/express

終わったら以下のコマンドを実行してHaxeのexternを生成します。

npx dts2hx express

作業ディレクトリに .haxelib フォルダが生成されました。
この中に生成されたexternが入っています。

local repositoryの登録

生成したexternを使えるように(-lib指定できるように)local repositoryに登録します。
作業ディレクトリで以下のコマンドを実行してください。

haxelib newrepo

Local repository already exists とか表示されますけど特に気にせず、以下のコマンドを実行して登録されたか確認します。

haxelib config

.haxelib ディレクトリのフルパスが表示されていれば完了です。

libを追加

build.hxml を開いて先ほど生成したexpressのexternを使えるようにlibを記述します。
以下の行を追加します。

-lib express
-lib express-serve-static-core

コーディング

作業ディレクトリに生成されたコードひな形の Main.hx を開き、ここにExpressのコードを記載します。
とりあえずお試しなのでjsonを返すだけのエンドポイントを1つ作成しました。

class Main {
  static function main() {
    final app = Express.call();
    app.get("/get", (req, res, next) -> {
      final response = {
        hello: "world"
      }
      res.json(response);
    });
    app.listen(3000, () -> {
      trace("server listen");
    });
  }
}

Haxeのビルド

VSCodeにてCtrl + F5でビルドします。
dest ディレクトリが作られて中に main.js が生成されたかと思います。

試してみる

以下のコマンドを作業ディレクトリで実行してnodeを立ち上げます。

node dest/main.js

エンドポイントにアクセス

ちゃんとjsonが返ってきました。

終わり

次回はDBアクセス周りについて記載します(予定)

Discussion