🐡
Nuxtで@elastic/search-uiを使ったサンプルリポジトリを作成しました。
概要
Nuxtで@elastic/search-uiを使ったサンプルリポジトリを作成しました。
以下からお試しいただけます。
背景
@elastic/search-uiは以下のように説明されています。
A JavaScript library for the fast development of modern, engaging search experiences with Elastic. Get up and running quickly without re-inventing the wheel.
（機械翻訳）Elasticを使用して、モダンで魅力的な検索エクスペリエンスを迅速に開発するためのJavaScriptライブラリです。車輪を再発明することなく、すぐに使い始めることができます。
以下でVue.jsを使ったサンプルリポジトリが公開されています。
今回は上記のリポジトリを参考に、Nuxtを使ったサンプルリポジトリを作成しました。
メモ
初期検索
以下のように指定することで、初期読み込み時の検索を実行することができました。
/searchConfig.ts
alwaysSearchOnInitialLoad: true,
公式ドキュメントの以下に記載がありました。
参考： カスタムconnectorの作成
以下を参考にカスタムconnectorを作成することで、Elasticsearch以外のAPIでも使用することができました。
具体的には以下のような手順を参考に、Drupalで作成したJSON:API Search APIと組み合わせて使用することも可能でした。
まとめ
検索機能を持つアプリケーションの作成にあたり、参考になりましたら幸いです。
Discussion