メインコンテンツへ飛ぶ

検索

· 読むのにかかる時間 1 分
echjordan
echjordan
vanessayuenn
vanessayuenn
zeke
zeke

Electron のウェブサイトに、APIドキュメント、チュートリアル、Electron 関連の npm パッケージなどを瞬時に検索できる新しい検索エンジンを導入しました。

Electron 検索のスクリーンショット

Electron のような新しい技術やフレームワークを覚えるのは大変なことです。 クイックスタート の段階を過ぎると、ベストプラクティスを学んだり、適切な API を見つけたり、夢のアプリを構築するのに役立つツールを発見したりするのが難しくなっていきます。 Electron のウェブサイトを、より早く、より簡単なアプリ構築のために必要なリソースを探せるようなより良いツールにしたいと考えています。

electronjs.org の任意のページにアクセスすると、ページ上部に新しい検索欄が表示されます。

検索エンジン​

ウェブサイトに検索を追加しようと思った当初は、バックエンドに GraphQL を使った独自の検索エンジンを試運転しました。 GraphQL の作業は楽しく、検索エンジンは高パフォーマンスでしたが、この構築は分かりきった作業ではないとすぐに気づきました。 複数語での検索やタイプミス検出のようなものは、正しく動くために多くの作業を必要とします。 車輪を再発明するのではなく、既存の検索ソリューションである Algolia を使用することにしました。

Algolia は、React、Vue、Bootstrap、Yarn、その他多数 の人気オープンソースプロジェクトの間で急速に選ばれる検索エンジンとなったホスト型検索サービスです。

ここでは、Algolia が Electron プロジェクトに適していた機能をいくつか紹介します。

APIドキュメント​

時折、何を達成したいか 分かっていても、どのように それを行うかが正確に分からないことがあります。 Electron には 750 以上の API メソッド、イベント、プロパティがあります。 人間は簡単に全部覚えられませんが、コンピュータにとっては得意分野です。 Electron の JSON API ドキュメント を利用して、Algolia にあるすべてのデータをインデックス化し、探している APIを簡単に見つけられます。

ウインドウをサイズ変更してみたいのですか? [resize] で検索して、必要なメソッドに直接ジャンプしましょう。

チュートリアル​

Electron では、API ドキュメントを補完するチュートリアルのコレクションが増え続けています。 これで、関連する API ドキュメントと一緒に、特定トピックのチュートリアルもより簡単に見つけられるようになりました。

セキュリティのベストプラクティスをお探しですか? [security] と検索しましょう。

npm パッケージ​

npm レジストリには現在 70 万以上のパッケージがあり、必要なパッケージを見つけるのは簡単ではありません。 これらのモジュールをより簡単に探せるように、Electron 向けに特別に作られた 3400 以上のモジュールを集めた electron-npm-packages を作成しました。

Libraries.io の方々は、コード、コミュニティ、ドキュメント、使用状況などのメトリクスの組み合わせに基づいてソフトウェアプロジェクトをスコアリングするシステム、SourceRank を作成しています。 これらのスコアを使って、npm レジストリ内のすべてのモジュールのスコアを含む [sourceranks] モジュールを作成しパッケージの結果をソートしています。

Electron 内蔵の IPC モジュールの代替品をお探しですか? is:package ipc と検索しましょう。

Electron アプリ​

Algolia でのデータのインデックスは簡単 なので、electron/apps から既存アプリのリストを追加しました。

[music] や [homebrew] と検索してみてください。

結果のフィルタリング​

GitHub の コード検索 を使ったことがある人なら、extension:js や user:defunkt のようなコロンで区切られたキーバリューフィルタが存在すると気づいているでしょう。 このフィルタリング技術は非常に強力なものであると考えており、Electron の検索に is: キーワードを追加しました。これにより、一種類の結果のみを表示するようにフィルタできます。

キーボードナビゲーション​

キーボードショートカットはみんな大好き! キーボードから指を離さずに検索できるようになっています。

  • / 検索欄にフォーカス
  • esc 検索欄にフォーカスしてそれを消去
  • down 次の結果に移動
  • up 前の結果か検索欄に移動
  • enter 結果を開く

また、このキーボード操作を可能にする モジュール もオープンソース化しました。 Algolia InstantSearch 用に設計されていますが、他の検索実装と互換になるように一般化してあります。

フィードバック募集中​

新しい検索ツールで何か問題が発生した場合は、それについてお聞かせください!

フィードバックを提出する最善の方法は、GitHub で適切なリポジトリに Issue を提出することです。

謝辞​

これらの新しい検索機能を構築してくださった Emily Jordan と Vanessa Yuen、Libraries.io のスコアを提供してくださった SourceRank 、そして私たちの活動を支援してくださった Algolia のチームに感謝します。 🍹