2024/3/13
Astro DB触ってみた
2024/3/12にAstro DBのアーリープレビューが始まったので、見ていきます。
Astro DBとは
ドキュメント https://docs.astro.build/ja/guides/astro-db/
Astro DB is a fully-managed SQL database designed exclusively for Astro.
訳すと、
Astro DB は、 Astro 専用に設計されたフルマネージド SQL データベースです。
とあります。
特徴は以下の通りです。
- Powered by LibSQL
LibSQL balanced lightweight efficiency with proven enterprise-grade performance.
LibSQL は、軽量効率と実証済みのエンタープライズ グレードのパフォーマンスのバランスをとりました。
- Scale with confidence
Astro DB’s automatically scales up to meet demand and scales down to $0 when inactive.
Astro DB は需要に合わせて自動的にスケールアップし、非アクティブな場合は $0 までスケールダウンします。
- Automatically configured
Everything is setup for you, like a TypeScript ORM with full type-safety out of the box.
すぐに使用できる完全なタイプ セーフティを備えた TypeScript ORM のように、すべてが自動的にセットアップされます。
LibSQLはSQLiteのフォークです。
また、Astro DBにはDrizzle ORMがbuilt-inで含まれています。 Drizzle ORMを使い慣れてる人にとってはかなり嬉しいですね。
値段
やっぱり一番気になるのはここですよね。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2Fba1ef94c82bb374bd2080f765415d682.png&w=3840&q=75)
なんと、基本無料です。
データベース数、アプリ数は無制限で、ストレージは1GB まで無料です。 1GB追加ごとに月1.00ドルかかります。 読み取りは月10億回まで無料で、追加100万回ごとに0.001ドルかかります。 書き込みは月100万回まで無料で、追加100万回ごとに1.00ドルかかります。
また、自動的にスケーリングされますが、クレジットカードの登録は必要ないため、 勝手に課金されることはないのがいいですよね。
個人で使う分には、制限を超えることは少ないと思うのでかなり良い感じだと思います。 制限を超えても結構良心的な値段だと思います。
使ってみる
まずはAstro Studioにサインアップします。
Astro Studioに関しては、こちら には以下のように書かれています。
Astro DB can connect to the Astro Studio platform to quickly add a hosted database to your project. You can view, manage and deploy new hosted databases all from the Astro Studio web portal.
Astro DB はAstro Studio プラットフォームに接続して、ホストされたデータベースをプロジェクトにすばやく追加できます。新しいホスト型データベースの表示、管理、展開はすべて Astro Studio Web ポータルから行うことができます。
ここから、使えます。パパっとGitHubでアカウントを作っちゃいましょう。
プロジェクト作成
今回は、簡単のためテンプレートから作成します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F2c56fd0656c5d9fb2693e614b91f3277.png&w=3840&q=75)
Start a Projectを押します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F013fe59d4363d2e82886df805a25ee0f.png&w=3840&q=75)
Create from Templateを押します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F70c6c3fe4e15454e192dfd877265bd76.png&w=3840&q=75)
3種類ありますが、今回はJob Boardを選択します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2Fcc6a8a6d865b821e9946a62ccf7bcc7f.png&w=3840&q=75)
リポジトリ名は適当にastrodb-jobboardにしました。 RegionをAsia(Tokyo)にして、Create a private Git repositoryのチェックを外して、 Create New Projectを押します。
しばらく待つと、プロジェクトが作成されます。
https://github.com/RUNFUNRUN/astrodb-jobboard
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F1332b9246cc2a08164f02c4be90be49d.png&w=3840&q=75)
また、Astro StudioのWeb UI内からSQL ConsoleとStackBlitzが使えるようです。
見てみる
早速クローンしてローカルで動かします。
ログに以下のようなものが出てきます。
最初にローカルサーバーを立ててDBを作成しないと、db/seed.ts
でLSPがエラーを出してしまいます。
あと、前提としてこのプロジェクトはSSRで動いている点に注意です。
同時並行で中も見ていきましょう。
config.ts
ではテーブルの定義を、seed.ts
では初期データの入力をしてるようです。
次に、呼び出し側の実装を見ていきます。 今回は一覧部分を見ます。(ファイル内から一部抜粋してます。)
結構使いやすそうです。Drizzle ORM使ってる人はすぐ使えそうです。
デプロイ
今回はVercelにデプロイしてみます。
その前に、package.json
のbuild
スクリプトを以下のように変更します。
ちなみに、ローカル環境で本番DBにアクセスしたい場合は、同様にastro dev
に--remote
オプションをつけ、
.env
を作成してvercelと同じように変数を設定すればいいです。
VercelにAstroプロジェクトをデプロイする場合、必要なパッケージがあるのでインストールします。
設定も勝手にやってくれます。
pushしたら、次はAstro Studioからトークンを取得します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F5a454de6cb1be9d2991ef8a802729bc5.png&w=3840&q=75)
次にVercelでプロジェクトを作成します。 さっきのトークンを環境変数に設定します。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2Fafe0195b57c28ec3e8a1ec4481a9a934.png&w=3840&q=75)
これでデプロイしてみます。
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F5beb48955f7894d96fdd52eeb2c70046.png&w=3840&q=75)
無事デプロイできました。でも、プレビューを見ると内容がありませんね。
seed.ts
で設定したデータはあくまで開発用なので、自分でデータを入れる必要があります。
でも最初から入れておきたいデータありますよね。
そういう時は以下を実行します。(環境変数を設定してる前提)
今回はSSRなので、本番にもそのままリロードするだけで反映されます。
https://astrodb-jobboard-ten.vercel.app/
![image by gyazo](/_next/image?url=https%3A%2F%2Fi.gyazo.com%2F0f9e991d46218ae583f9f6fedc0bde27.png&w=3840&q=75)
いい感じです。
さいごに
GitHub Actionsとの連携など、まだまだ触れていない機能がたくさんありますが、今回はここまでにします。
Astro DBはまだアーリープレビューですが、かなり使いやすそうです。 自分の中でAstroはSSGのイメージが強かったですが、今回SSRに触れてみました。 AstroはReact等のあライブラリでCSRもできるのも良いですね。 今度Astroで何か作ってみたいなと思いました。
ではまた。
Last updated on