PostgREST: htmxを使ったHTMLコンテンツの提供

 (postgrest.org)
3 ポイント 投稿者 GN⁺ 2023-12-19 | 1件のコメント | WhatsAppで共有

HTMLコンテンツの提供方法

  • PostgRESTとhtmxライブラリを使ってHTMLコンテンツを返し、AJAXリクエストを処理する方法を紹介。
  • htmxはHTMLレスポンスを期待し、これを使ってDOM内の要素を置き換える。

事前設定

  • チュートリアル0をベースにしたTo-Doアプリを作成。
  • 認証なしで進め、web_anonユーザーにtodosテーブルへのすべての権限を付与。
  • text/htmlをメディアタイプハンドラとして追加し、PostgRESTがWebブラウザのリクエストをHTMLドキュメントとして認識するように設定。

HTMLレスポンスの生成

  • Tailwind CSSを使って基本的なHTMLファイルを返す関数を作成。
  • Webブラウザではhttp://localhost:3000/rpc/indexでWebページを開ける。

To-Doの一覧表示と作成

  • データベースにすでに入力されているTo-Do一覧を表示する関数を作成。
  • To-Do一覧テンプレートの構築に使われ、PostgRESTエンドポイントとしては使われない。
  • To-Doをデータベースに登録するエンドポイントを追加し、/rpc/indexページを修正。

To-Doの編集と削除

  • api.html_todo関数を修正して、より機能的にする。
  • 新しいhtmx機能を追加: To-Do状態の変更、編集可能なTo-Do用HTMLの返却、To-Doの削除。
  • To-Doを編集し、データベース内のTo-Doを修正・削除するエンドポイントを追加。

GN⁺の意見

  • この記事は、PostgRESTとhtmxライブラリを使ってWebアプリケーションで動的なHTMLコンテンツを提供する方法を説明しているため、Web開発者にとって興味深い内容かもしれない。
  • AJAXを活用した非同期のWebページ更新は現代のWeb開発における重要な要素であり、この記事はその機能を実装する具体例を示している。
  • ユーザーインターフェースを改善し、サーバーとクライアント間の通信を最適化する方法を学べる良い資料である。

関連記事

1件のコメント

 
GN⁺ 2023-12-19
Hacker Newsの意見
  • PostgRESTに関するHacker Newsコメントの要約:
    • PostgRESTというオープンソースプロジェクトへの愛着: あるユーザーは、PostgRESTを自分のお気に入りのオープンソースプロジェクトの1つに挙げ、Supabaseの成功はPostgRESTとPostgresの優れた設計のおかげだと述べている。このユーザーは、SupabaseがPostgRESTプロジェクトにどれだけ支援しているのかは分からないが、多くの企業が利用しているにもかかわらず支援者が12人しかいないことを残念がっている。
    • PostgRESTアプリ開発の難しさ: 別のユーザーは、PostgRESTを使ったアプリ開発の経験はあまり良くなかったと述べ、一見シンプルなフレームワークでも要件が複雑になると問題が生じると指摘している。このケースでは、開発者が望む結果を得るためにデータベースへ多数のストアドプロシージャを書く必要があり、その結果スケーラビリティの問題が発生したという。
    • 保守の難しさ: また別のユーザーは、PostgRESTは概念実証としては素晴らしいが、実際に複雑なWebアプリケーションを保守するのは悪夢のようだろうという意見を示している。
    • シンプルなWeb開発スタックの魅力: あるユーザーは、HTMLとデータベースだけで構成されるWeb開発スタックは魅力的であり、バックエンドやフロントエンドが不要だという点を肯定的に評価している。
    • 新しい／モダンなアプリケーションにおけるコーディングパターン: CouchDBのようなJSONドキュメントデータベースを例に挙げ、クライアントが直接データベースにアクセスしてHTMLやJSONを受け取れる方式について説明している。ただし、このような方式は保守を難しくし、そのため開発は中断されたとも述べている。
    • Haskellの観点から見たPostgRESTの独創性: あるユーザーは、Haskellの観点から見るとPostgRESTは自明なプロジェクトであり、まさにそこがこのプロジェクトの天才的な点だと評価している。
    • SmoothDBの紹介: ある開発者は、PostgRESTとの互換性を目指すSmoothDBという新しいプロジェクトをGitHubで公開したと紹介し、まだベータ版だと述べている。SmoothDBはGoで書かれており、スタンドアロンでも、複雑なサーバーアプリケーションのモジュールとしてでも利用できる。
    • PostgRESTを使ったデータ検証パイプラインに関する記事: あるユーザーは、PostgRESTを汎用的なデータ検証パイプラインとして使う方法について記事を書いたと述べ、CQRS/REST APIレイヤーとして使う方法に関する次の記事を準備中だとしている。
    • PostgRESTとHTMXの組み合わせ: あるユーザーは、以前のプロジェクトでPostgRESTを使ったことがあり、HTMXと相性が良いと評価している。ただし、SQL関数の内部でHTMXテンプレートを保守することには懸念を示している。
    • 保守可能なスタックへ発展させるための追加ツール: あるユーザーは、この概念を、中〜大規模アプリケーションで優れたUXを提供できる保守可能なスタックへ発展させるために必要な追加ツールについて意見を求めている。