🦄

Elysia.jsを始める【概要・Getting Start】

2024/08/25に公開

※ 主に https://elysiajs.com/ の日本語訳をしつつ、多少わかりやすい表現に直しているものになっているので、詳細は公式ページを参照のこと

Elysia.js is 何?

TypeScriptをベースとしたJavaScriptフレームワーク。
Bunで動作し、エンドツーエンドの型安全性、統一された型システムを有している。

エンドツーエンドの型安全性があるので、フロントエンドからバックエンドへのリクエスト、レスポンスの型が一致するため、型エラーを防ぐことができる。
そして、統一された型システムを持っているので、フレームワーク全体で一貫した型チェックができるようになっている。

加えて、人間工学的に直感的で使いやすい開発者体験重視な設計になっているため、高速 + 堅牢 + 使いやすいフレームワークというのがウリになっている。

人間工学的な設計?

シンプルなAPI設計

単純に値を返すだけなら、以下のようにメソッドを追加しなくてもブラウザ渡した値が表示される。

impoert { Elysia } from 'elysia'

new Elysia()
    .get('/', 'Suichan ha Kyoumo Kawaii !')
    .listen(3000)

JSONなら、

impoert { Elysia } from 'elysia'

new Elysia()
    .get('/json', {
        hoshimachi: 'suisei'
    })
    .listen(3000)

という感じで、JSON変換のための特別なメソッドを定義する必要はない。

また、Content-Typeに関しても、Elysia.jsの方で自動的に判定してくれるので、JSONを返却するパターンであれば、Content-Typeヘッダーをapplication/jsonとして設定されて返却される。

型安全性

Elysia.jsにはTypeBoxを搭載している。
そのため、JSONスキーマと同様の型定義を行うことにより、静的型付け言語のような厳格なデータ型の検証をすることができるようになっている。

import { Elysia, t } from "elysia";

const app = new Elysia()
.post('/talents', ({ body }) => {
  return body
}, {
  body: t.Object({
    name: t.String(),
    gen: t.String(),
    hight: t.Number()
  })
})
.listen(3000)

上記のように定義した場合、コンパイル時の静的型チェックが行われる。
また、Visual Studio CodeなどのIDEへの支援として、型エラーをリアルタイムチェックできるようになっている。

APIドキュメント生成と管理のしやすさ

OpenAI 3.0の使用に準拠したドキュメント生成機能を有している
そして、Elysia.jsではSwaggerプラグインを使えば、比較的簡単にAPI仕様を生成することができる

import { Elysia, t } from "elysia";
import { swagger } from '@elysiajs/swagger'

const app = new Elysia()
  .use(swagger())
  .get('/suichanha/kyoumo/:word', ({ params }) => {
    return {
      word: params.word
    }
  })
  .post('/talents', ({ body }) => {
    return body
  }, {
    body: t.Object({
      name: t.String(),
      gen: t.String(),
      hight: t.Number()
    })
  })
  .listen(3000)

Elysia.jsを始める

Bunがない場合はBunを先にインストールする

https://bun.sh/docs/installation を参考に環境に合わせてBunをインストールする

brew install oven-sh/bun/bun

Elysia.jsでアプリケーションを作っていく

bun create elysia sample-app

sample-appのところは、アプリケーションで付けたい名前を任意でつければOK

上記画像のような形式でアプリケーションの原型が生成される。

案内の通り、

cd sample-app

sample-appの部分は、createしたときにつけた名前になっている

で、アプリケーションルートに入り、

bun run src/index.ts

をすると、

サーバーが立ち上がる

ブラウザで http://localhost:3000/ にアクセスすれば、

見れるようになる。


Elysia.jsを始める【Route】に続きます。

参考:https://elysiajs.com/

Discussion