EY-Office ブログ

Jamstackは新しいWebアプリのアーキテクチャ？に書いたようなJamstackアーキテクチャのシステムを新規で作るさいに使えるFullstack Frameworkがあることを知り、少し試してみました。

今回試したのはBlitz.jsとRedwoodJSです。

どちらもフロントエンドにReactをバックエンドはNode.js + Prismaを使ったフレームワークで、Ruby on Railsのような感覚で使えます。

Blitz.js, RedwoodJS ホームページから

Blitz.js

Blitz.jsには The Fullstack React Framework と書いてあります。内部構成は

• Node.js
• TypeScript
• Prisma Database Acesss(ORM, Migration)
• APIサーバーを意識させない独自通信ライブラリー
• Next.js Routeing, SSR, SSG
• React

というNext.js + Reactを使っている開発者には使いやすそうな構成です。またRuby on Railsにインスパイアされたコマンド（開発スタイル）で以下のようにRuby on Railsそっくりです

$ blitz new blitzApp
$ blitz generate all schedule due:DateTime task:String
$ blitz db migrate
$ blitz console
$ blitz start

しかし、まだ開発途上なのか blitz db migrate が謎エラーが発生し blitz db resetで切り抜けました。しかし生成されたコードは不十分で、以下の画像のように新規作成の入力フォームはすべてのコードは自動生成されませんでした。 ここで心が折れてしまい評価は終了しました。

TypeScriptベースでPrismaやNext.jsなど素性の良いライブラリーをベースに、API通信を意識させない構成は良いのもかと思います。もう少し完成度が上がったら試してみたいと思います。

RedwoodJS

RedwoodJSはGitHubの創設者でRuby製SSGソフトJekillの作者Tom Preston-Werner（握手した事あります ^^）等が作ったFrameworkです。
ホームページにはBringing full-stack to the Jamstackと書かれています。内部構成は

• Node.js
• Prisma Database Acesss(ORM, Migration)
• GraphQL (Appollo)
• React
• Reach Router
• Storybook

TypeScriptは対応中のようです。

Blitz.jsと同じくRuby on Railsに似たコマンドですが少し設計思想が違います、DB定義はrailsやblitzとは違いコマンドラインで指定せず、ファイルで設定します（Ridgepoleに似ているかも）。

$ yarn create redwood-app redwoodApp
$ yarn redwood generate page home /
$ yarn redwood db save create schedules
$ yarn redwood db up
$ yarn redwood g scaffold post
$ yarn redwood dev

Redwoodjsも悩みましたが、なんとかRuby on RailsのSacffoldと同等のコードが生成され、GraphQL定義ファイル、ビューのReactに少し手を入れて以下のような画面ができました！

RedwoodJSはAPI部分にはデファクト的なGraphQLを使っているので、同一サーバーでスマフォ・クライアントをサポートする等の使い方も出来そうです。TypeScriptが使えると良いのですが・・・サポートされてるのを待ちたいと思います。

まとめ

Blitz.jsもRedwoodJSこれからさらに完成度を高めRuby on Railsのように使われるようになるのでしょうか、また他のJamstack用Fullstack Frameworkが現れるかもしれませんね。楽しみに眺めて行きたいと思います。