ググり力、それはエンジニアには必須の能力である

**ググり力**、それはエンジニアにとっては **必須の能力** になりつつあると思います。
さて、皆さんは自分のググり力で欲しい情報にちゃんとたどり着けると言えますか？

@Yametaro さんからのお題です。

```
ある日、コードレビュー中ワイ
ワイ「さぁ、今日も同僚のコードをレビューしていくでぇ」
ワイ「まずは新卒のT君のコードを読んでいこか」
ワイ「どれどれ…」
ワイ「ん？なんやこの??っていう書き方は…？」
ワイ「ググってみよか…」
ワイ「JavaScript ??と入力して、検索ボタンをポチッとな」
ワイ「…あれ？それらしい検索結果が出てこんな…」
ワイ「ぐぬぬ、記号関係はググりづらいこともあるんやな…」
ワイ「これじゃあ今日はもう、酒飲んで寝るしかないやないか…」

〜飲酒、そして就寝へ…〜
```

では JavaScript で ?? の検索方法はどうしたらいいのか？ ここに１つの解答を示しておきます！
**「javascript double question mark」と検索すること** です。

![javascript_??](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/00_search_javascript_%3F%3F.png)

この記事はどうやったら自分の欲しい情報が効率よく見つけられるのか試行錯誤してきて身についたググり力を紹介していきます。  

# 日本のサイトだけでなく、英語のサイトから探せ！

読めないからと英語のサイトを毛嫌いしてませんか？
残念ながら、それでは本当に欲しい情報にたどり着くことはできないでしょう。

日本の人口と英語圏の人口を考えれば明らかですが、 **圧倒的に英語圏の人口の方が多い** です。
情報も必然的に英語のサイトの方が多いです。

検索する時は英語のサイトを参考にすることも心がけましょう！

## どうやって英語のサイトを検索すればいいの？

厳密には違いますが、日本語以外のサイト（ほとんどが英語のサイトで検索される）で「javascript double question mark」と検索している結果です。

![01_search_only_en](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/01_search_only_en.png)

通常の検索と何が違うのかそれはクエリパラメータに新たに **「&lr=-lang_ja」** が追加されていることです。
**「&lr=-lang_ja」** のクエリパラメータを追加することで日本語以外のサイトを対象にして検索することができます。

### クエリパラメータに追加するのめんどう

毎回検索後に **「&lr=-lang_ja」** のクエリパラメータを追加するのはめんどうですよね。
英語のサイトを検索できるように **ブラウザの検索エンジンに設定を追加すること** をオススメします。
追加すると以下の感じで検索ができるようになります。

![02_search_only_en_sample](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/02_search_only_en_sample.gif)

## 検索エンジンの設定を追加

![03_search_engine_setting](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/03_search_engine_setting.gif)

chrome のアドレスバーに `chrome://settings/searchEngines` を入力して、Enter を押し検索エンジンの管理画面へ遷移します。
その他の検索エンジンの追加ボタンを押し、`検索エンジン`, `キーワード`, `URL（%s=検索語句）` にそれぞれ入力することで追加することができます。
`検索エンジン`, `キーワード` はお好みで大丈夫です。`URL（%s=検索語句）` には以下の JavaScript を入れましょう。

```javascript
javascript: (function () {
  window.open(
    `https://www.google.co.jp/search?q=${decodeURIComponent("%s")}&lr=-lang_ja`
  );
})();
```

アドレスバーで入力したキーワードが %s で渡ってくるのでそれに対して `&lr=-lang_ja` を追加した形の URL を作成し 新しいタブで表示するようにしているだけです。
これは JavaScript で動作させるので Chrome の設定画面では動作しません。Chrome の設定画面では JavaScript が動作しないためです。

これで、日本語以外のサイトから簡単に検索できるようになりました。検索する時は以下の３ステップでキーボードだけですぐに検索できます。

1. **「command + l」**  を入力（アドレスバーにフォーカス） 
2. **「自分が設定したキーワード」** を入力しスペースキーを押す
3. **「調べたいキーワード」** を入力し Enter を押す

# 記号関係は英語名で検索せよ！

記号をそのまま入力して検索しても意図したとおりの検索結果が表示されません。どうすればいいのか？
これに関しては冒頭で解答したとおり、記号名を入力すると検索にヒットします。記号の正しい英語名を覚えておくことで検索することができるようになります。
日本語名を入力しても検索することができますが正しい読み方を理解しておくことは大切です。

## 主要な記号の英語名

こちらに一覧として残しておきます。検索する時は mark や sign などは除いて検索したほうがよいかもしれません。
そこらへんは自分で試してみてください！

| 記号 | 英語                                                              |
|:----:|:------------------------------------------------------------------|
| `!`  | exclamation mark<br>exclamation point                             |
| `@`  | at sign<br>at symbol                                              |
| `#`  | number sign<br>hash mark                                          |
| `$`  | dollar sign                                                       |
| `%`  | percent sign                                                      |
| `^`  | circumflex accent<br>caret<br>hat                                 |
| `&`  | ampersand                                                         |
| `*`  | asterisk                                                          |
| `/`  | slash                                                             |
| `?`  | question mark                                                     |
| `+`  | plus sign                                                         |
| `-`  | minus sign<br>hyphen-minus<br>hyphen                              |
| `"`  | double quotation mark                                             |
| `'`  | apostrophe<br>single quotation mark                               |
| `,`  | comma                                                             |
| `:`  | colon                                                             |
| `;`  | semicolon                                                         |
| `~`  | tilde                                                             |
| `_`  | underscore<br>underline<br>low line                               |
| `|`  | vertical line<br>vertical bar<br>pipe                             |
| `    | grave accent<br>backquote                                         |
| `\`  | backslash<br>reverse solidus                                      |
| `¥`  | yen sign                                                          |
| `<`  | left angle bracket<br>opening angle bracket<br>less-than sign     |
| `>`  | right angle bracket<br>closing angle bracket<br>greater-than sign |
| `[`  | left square bracket<br>opening square bracket                     |
| `]`  | right square bracket<br>closing square bracket                    |
| `{`  | left curly bracket<br>opening curly bracket                       |
| `}`  | right curly bracket<br>closing curly bracket                      |
| `(`  | left round bracket<br>left parenthesis<br>opening parenthesis     |
| `)`  | right round bracket<br>right parenthesis<br>closing parenthesis   |

参考サイト

- [英語の記号・マークの読み方 | 英語＠めもらんだむ](https://memotec.net/etc/mark.html)

## ruby の `&:` の記法について検索

`ruby ampersand colon` で検索してみましょう。どうでしょうか？ 検索できているように見えます！

![04_search_ruby_ampersand_colon](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/04_search_ruby_ampersand_colon.png)

# Google検索で定義されている記号や単語を使って検索精度を上げろ！

皆さんは、ただ単語を入力して検索していませんか？
Google検索ではより検索の精度を高めることができる検索方法があります。よく使うであろう主要な機能を紹介していきます。

詳しくはこちらの公式サイトを参考にしてください。

- [ウェブ検索の精度を高める - Google 検索 ヘルプ](https://support.google.com/websearch/answer/2466433?hl=ja)

## 検索から語句を除外する

Google検索のヘルプページにはこんな事が書かれています。**-（ハイフン）** を使用することで特定の語句を除外することができます。

> 除外する語句の前に「-」を付けます。例: ジャガー 速度 -自動車

### Rails の resource で検索してみる

Rails のルーティングの設定では `resources` と `resource` があります。`resource`について調べてみましょう。

![05_search_rails_resource](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/05_search_rails_resource.png)

ぐぬぬ、単純に `resource` と検索すると `resources` と `resource` の両方が表示されてしまっていますね。
ここで特定の語句を除外する、 **-（ハイフン）** を使用して `resources` を除外してみます。

![06_search_rails_resource_and_exclude_resources](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/06_search_rails_resource_and_exclude_resources.png)

無事除外されて `resource` だけ検索されました。

## 完全一致を検索する

Google検索のヘルプページにはこんな事が書かれています。**"（ダブルクォーテーション）** を使用することで完全一致で検索されるようになります。

> 単語や語句を引用符で囲みます。例: "世界一高い建築物"

### 完全一致検索を試してみる

`"世界一高い建築物"` と `世界一高い建造物` で検索した結果を比較してみましょう。

`世界一高い建造物` で検索してみるとわかるんですが、`世界一高い建造物` で検索したのにも関わらず、 `世界で一番高い建物` がヒットしてしまいました。

![07_ambiguous_search_the_tallest_building_in_the_world](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/07_ambiguous_search_the_tallest_building_in_the_world.png)

完全一致検索をした場合はちゃんとサイト内に `"世界一高い建築物"` が含まれているものが表示されています。

![08_perfect_matching_search_the_tallest_building_in_the_world](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/08_perfect_matching_search_the_tallest_building_in_the_world.png)

この **完全一致検索は後に具体的に使う方法** を説明します。

## 特定のサイトを検索する

Google検索のヘルプページにはこんな事が書かれています。**site:** を使用することで特定のサイト内で検索することができるようになります。

> サイトまたはドメインの前に「site:」を付けます。例: site:youtube.com または site:.gov

### 特定のサイトから検索してみる

qiita の自分の記事一覧からのみ検索してみます。`github site:https://qiita.com/dodonki1223`

![09_search_site_sample](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/09_search_site_sample.png)

ちゃんと、URLが `https://qiita.com/dodonki1223` のもののみ検索されています。

### 検索のエンジンの設定を追加

「英語のサイトを検索する」時にも紹介した検索エンジンの設定に以下のURLを設定することでアドレバーに入力するだけで簡単にドメインからの検索、サイト内からの検索が可能になります。

#### ドメイン検索

```javascript
javascript: (function () {
  window.open(
    `https://www.google.co.jp/search?q=${decodeURIComponent("%s")} site:${location.origin}`
  );
})();
```

#### サイト内検索

```javascript
javascript: (function () {
  window.open(
    `https://www.google.co.jp/search?q=${decodeURIComponent("%s")} site:${location.href}`
  );
})();
```

# エラーの検索時には除外検索、完全一致検索も活用せよ！

何か日々の業務でエラーが発生した時、エラーを検索すると思いますが、完全一致検索を使うと便利な時があります。
基本的にはエラーをそのまま検索すると思いますが、似たようなエラーが検索されそれがノイズになる時があります。
そんな時は、ただそのままエラーを検索するのではなく、語句の除外や完全一致検索を活用することでノイズを除外し自分が欲しい情報だけを検索する事ができるようになります。

## 完全一致検索を使用するタイミング

ありきたりな単語の羅列の時は一部かすっていて、検索にヒットしてしまう時には、完全一致検索が活躍するでしょう。
**完全一致検索を使用することでエラーの文言と一言一句違わないものが表示される** ようになります。

## 除外検索を使用するタイミング

同じエラーなんだが、違うプログラミング言語も検索されてしまうケースがあります。
そんな時に **語句の除外を使用することで自分が調べたいプログラミング言語以外をどんどん除外していくことができる** ようになります。

## エラーの検索時のコツ

エラーの検索時のちょっとしたコツを紹介します。エラーを検索した時、 **それが自分のプロダクトだけの問題なのかそれともライブラリ、言語特有のエラーなのかの見極め方** です。

表示されたエラーをそのまま検索し、 **結果がかなりの数ヒットされた時** は、**それはライブラリ、言語特有のエラーだと推測** されます。
また **結果がほとんど出てこない場合** は **自分のプロダクトだけの問題の可能性が高い** です。

検索結果数が多いということは世界中でハマったことのある人が多いということです。逆に検索結果数が少ない場合はそのエラーでハマっている人が少ないということです。つまり自分のプロダクトの処理でエラー文を生成して表示していたりなどが考えられるため、むしろそういう場合は **プロダクトコード内から検索したほうが有用な情報を得られるケースが多い** かと思います。

これはあくまでも１つの指標なので絶対では無いですがざっくりと判断する時に使うとよいかもしれません。

# サイトに検索機能が無い時はドメイン検索を使用せよ！

![10_search_domain_sample](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/10_search_domain_sample.png)

サイトに検索機能が無い時はドメイン検索を使用することで簡易的な検索機能を使用することができます。

# なるべく最新の情報を探せ！

日々、技術は更新されていくため数年前の記事は古くて使えなくなっている可能性があります。
情報を探す時はいつ書かれたものなのか、新鮮な情報を常に探す癖をつけると良いでしょう。

Google検索には期間を指定して検索する機能もあります。検索した時に古い記事がヒットするようであれば期間を指定しましょう。

**「ツール → 期間指定なし → 対象の期間」** の操作で期間を指定できます。

![11_period_search_sample](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/11_period_search_sample.png)

# サービスやライブラリの比較には `vs` キーワードを使え！

![12_search_vs_keyword](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/12_search_vs_keyword.png)

サービスやライブラリの後に `vs` キーワードを使用すると似たようなサービスやライブラリのサジェストが表示されます。
これを見ることで技術選定時の参考にしたりすることができます。また自分が知らないものが出てきたりするのでとても有用です。

@halo1kw さんから情報を頂きました！
`alternative` キーワードでも検索ができるようです。

![21_search_alternative](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/21_search_alternative.png)

# ライブラリの導入時に動かない時は `not working` キーワードを使え！

![13_search_not_working_keyword](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/13_search_not_working_keyword.png)

ライブラリを導入したんだが、なんかわからないが動かない。そんなケースに出くわしたことは無いでしょうか？
そんな時は `not working` をつけて検索すると GitHub の issue や stack overflow が検索にヒットすることがあります。
自分と同じように世界中で困っている人を見つけられることができるのでオススメです。

# バージョンアップ時は `upgrade`, `migration` キーワードを使え！

ライブラリやフレームワークのバージョンアップ時は `upgrade`, `migration` というキーワードで検索するとドキュメントが出てくることが多いです。
公式の Upgrade Guide や Migration Guide が表示される事が多いのでまずは公式のドキュメントを参考にバージョンアップを行うことをオススメします。

## upgrade で検索

Next.js の場合は `upgrade` で検索すると、Upgrade Guide がトップに表示されていることがわかります。

![19_search_upgrade](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/19_search_upgrade.png)

## migration で検索

Yarn の場合は `migration` で検索すると、Migration Guide がトップに表示されていることがわかります。

![20_search_migration](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/20_search_migration.png)

# 複数の OSS のコードを検索できるようにしよう！

サンプルコードの検索をする時のオススメとしては複数の OSS を検索できるようにすると良いでしょう。
Google で検索するだけでなくお気に入りの OSS のコードを参考にするのも１つの指標として良いと思います。

ただし、問題としては複数の OSS を検索する仕組みが今の所ないような気がします。なのでちょっとしたスクリプト（OSS検索ツール）を書いてそれを使うことで簡単に検索できるようにします。

## OSS 検索ツール

スクリプトを実行することで、OSS のリポジトリをローカルに clone, update を自動で行い、Visual Studio Code のワークスペース機能を使い clone してきたリポジトリを横断して検索できる仕組みを構築します。

### スクリプトの作成

まずは必要なファイルを作成します。

![14_oss_files_sample](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/14_oss_files_sample.png)

以下のコマンドを全部実行します。

```shell
$ mkdir oss_sample
$ cd oss_sample
$ mkdir list
$ touch ./list/ssh
$ touch clone_and_update.bash
```

次に bash ファイルの中身を記述します。

```bash
#!/bin/bash

declare -a cloneList=($(cat ./list/ssh))

echo '{
	"folders": [' > oss_sample.code-workspace

for ((i = 0; i < ${#cloneList[@]}; i++)) {
  project_name=$(echo "${cloneList[i]}" | cut -d '/' -f2 | sed -e 's/.git//g')
  project_dir="./${project_name}"

  echo '		{
			"path": "'${project_name}'"
		},' >> oss_sample.code-workspace

  if [ ! -d $project_dir ]; then
    echo $project_name clone start...
    git clone ${cloneList[i]}
  else
    echo $project_name clone skip...
    echo $project_name update
    cd $project_name
    git fetch
    git pull
    cd ../
  fi
}

echo '	],
	"settings": {}
}' >> oss_sample.code-workspace
```

最後に ssh のファイル内に clone するリポジトリを改行区切りで入れるだけです。

```
git@github.com:hashicorp/terraform.git
git@github.com:go-gorm/gorm.git
git@github.com:beego/beego.git
```

### 実行してみる

以下のコマンドを実行してください。

```bash
$ bash clone_and_update.bash
```

実行すると ssh ファイルに記述したリポジトリがローカルに clone され、code-workspace ファイルが出来上がります。

![15_oss_sample_run](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/15_oss_sample_run.png)

### 検索を試してみる

以下のコマンドでワークスペースを開きます。

```shell
$ code oss_sample.code-workspace
```

ワークスペースを開いたら、検索することで clone してきた OSS を横断的に検索をすることができるようになります。

![16_oss_sample_search](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/16_oss_sample_search.png)

### OSS を読むことのススメ

以前、Zenn で OSS を読むことのメリットをまとめた記事があるのでこちらも良かったら読んでみてください。

- [OSSノススメ - Zenn](https://zenn.dev/dodonki1223/articles/6418df73713313)

# 自分だけの簡易検索データベース

自分が行っている、Google 検索以外での検索 Tips です。
いくつかの情報網を slack に集約してそれを元に検索する方法です。スクショは「AppSync」で検索した結果です。

![17_slack_search_tool](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/17_slack_search_tool.png)

## 自分だけの簡易検索データベースの作り方

slack で自分だけのワークスペースを作成します。
作成したワークスペースに RSS が通知させるようにします。RSS のアプリは以下の URL からインストールが可能です。

- [RSS | Slack App ディレクトリ](https://slack.com/apps/A0F81R7U7-rss?tab=more_info)

### RSS 

自分だけの簡易検索データベースは基本的にはこの RSS が主な情報源になります。自分が気になっているブログなど登録しておくと良いでしょう。
個人的に登録している RSS をこちらに記載しておきます。

| RSS                                                                                      | 説明                                        |
|:-----------------------------------------------------------------------------------------|:--------------------------------------------|
| [はてなブックマーク テクノロジー 人気エントリー](https://b.hatena.ne.jp/hotentry/it.rss) | 日本で注目を浴びているIT関連の記事を収集    |
| [Zenn のトレンド](https://zenn.dev/feed)                                                 | Zenn の記事でトレンドになっているものを収集 |
| [DevelopersIO](https://dev.classmethod.jp/feed/)                                         | AWS の情報を収集                            |
| [Amazon Web Services ブログ](https://aws.amazon.com/jp/blogs/news/feed/)                 | AWS の情報を収集　                          |
| [The Go Programming Language Blog](https://go.dev/blog/feed.atom)                        | Go についての情報を収集                     |

podcast も RSS に登録しておくと後から、検索した時にヒットされると「そういえば、あの podcast で話していたな」と思い、もう一度聞くこともあり、かなりよいと個人的には思っています。

もしオススメの RSS, podcast があれば教えてください！

### その他の情報

RSS では取得できない情報もあるのでそれ以外の収集方法をこちらに記載しておきます。

#### Qiita のトレンドを slack に通知させる

自作のツールなんですが、[qiita_trend_slack_notifier](https://github.com/dodonki1223/qiita_trend_slack_notifier) を使って slack に Qiita のトレンドを通知させています。

![slack_notify_sample](https://raw.githubusercontent.com/dodonki1223/qiita_trend_slack_notifier/master/image/slack_notify_sample.png)

#### pocket を使いブックマークしたページを通知させる

[pocket](https://getpocket.com/ja/) と [IFTTT](https://ifttt.com/) を使い slack に投稿させます。
[IFTTT](https://ifttt.com/) で下記のように設定すれば pocket で保存したものが slack に通知させるようになります。

![18_create_sample_ifttt](https://raw.githubusercontent.com/dodonki1223/image_garage/master/articles/18/18_create_sample_ifttt.png)

chrome の拡張機能で [Save to Pocket](https://chrome.google.com/webstore/detail/save-to-pocket/niloccemoadcdkdjlinkgdfekeahmflj?hl=ja) があるのでこれを追加して気になったページをどんどん pocket で保存して slack に溜め込んでいきます。

# 最後に

如何でしたでしょうか？ 役に立った情報があれば嬉しいです。
皆さんが行っている検索方法も、もしよろしければコメントにて教えてください！