Roam Research＋Merriam辞書で自分だけの単語帳を作る方法

こんにちは、Choimirai School のサンミンです。

【主要なアップデート】
（2021.02.06）Roam42のトリガーを「;;」から「jj」へ変更
（2020.12.20）Roam42の変更内容を反映。最新のコードはGitHubを参照してください。
（2020.12.03）GitHubへのリンクを追加

0  はじめに

先月紹介したRoam ResearchのSmartBlock（SB）機能。

今回のnoteではSBを存分に活用し、自分だけの単語帳を作る方法を紹介します。

1  準備するもの

■ SmartBlock対応のRoam42
■ Merriam WebsterのAPI Key
■ Merriamの辞書を参照するためのSmart Block

2  SmartBlock対応のRoam42

Roam42のインストール方法はこちらの note を参考にしてください。

3  Merriam WebsterのAPI Keyを取得

API Keyは辞書ごとに取得することができるようになっています。今回のSmartBlockではLearner's Dictionaryを利用しますのでアカウントを作成する際に適切な辞書を選ぶように気をつけてください。

　アカウント作成及びAPI Keyの取得は下記のページからお願いします。

アカウントが無事生成されましたら「YOUR KEYS」からAPI Keyが確認できます。

4 SmartBlockの登録

次のコードをご自分のRoamにコピーしてください。

【追記：2020.12.03】２つのリクエストがありましたので、修正済みのコードをGitHubに投稿しました。最新のコードは下記のGitHubページを参照してください。

修正内容：
①「global warming」などスペースが含まれている単語にも対応。
② 発音が含まれてない単語も検索可能に。この場合、プレイヤーは非表示。

※重要：コードをコピーする際には書式なしの貼り付けが必要です。

- #42SmartBlock  zz_Merriam
   - <%NOBLOCKOUTPUT%><%JAVASCRIPTASYNC:
```javascript
// Default to the page title
var wordToLookUp = prompt('Enter word to lookup.',document.title);
// Get your API from https://dictionaryapi.com/register/index
var apiKey = 'YourAPI'

var url = "https://dictionaryapi.com/api/v3/references/learners/json/" + wordToLookUp + "/?key="+apiKey;
var dicUrl = "https://learnersdictionary.com/definition/" + wordToLookUp
var audio = "https://media.merriam-webster.com/audio/prons/en/us/mp3/"
var responseText = $.ajax({url:url, type:"GET", async:false,}).responseText; 
var data = JSON.parse(responseText);

for(idx in data) {
 var shortDef = data[idx].meta["app-shortdef"]
 var prs = data[idx].hwi["prs"]
 var sound = prs[0].sound["audio"]
 var ipa = prs[0].ipa
 var file = sound + ".mp3"
 var subDir = sound[0] + "/"
 var audioPath = audio + subDir + file
 var embed = "{{audio: " + audioPath + "}}"
 
 // Print the speech of word along with ipa pronunciation
 await roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(
   shortDef["fl"] + " | / " + ipa + " / "
 );

 // Print URL of Merriam Learner's dictionary
 await roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(dicUrl);

 // Definition of the word
 await roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(shortDef["def"]);

 // Embed audio for the word
 await roam42.smartBlocks.activeWorkflow.outputAdditionalBlock(embed);

 // Fetch only the first record	
 break;
}
return '';```
%>

書式なしで貼り付けても余計な「ー」やインデントなど２箇所修正が必要です。

修正後次のような形式になっているかもう一度ご確認ください。Merriamのウェブサイトで取得したAPI Keyは、var apiKey = '' のところに貼り付けます。

API Keyは、var apiKey = '' のところに貼り付ける

5  SmartBlock（SB）の実装

【追記：2021.02.06】SmartBlockのトリガーを「;;」から「jj」へ変更

手順通りにSBの登録が終われば、「jj」で登録済みのSMを呼び起こし、その中から「zz_Merriam」 を実行することができます。SBによって表示される情報は、

① 品詞＋発音記号
② Learner's Dictionaryへのリンク
③ 単語の定義
④ 発音

ポップアップが表示され、デフォルトとしてページのタイトルを検索する仕組みとなっています。ポップアップに表示されている単語を変えれば別の単語の意味を調べることもできます。

意味を調べるだけでなく、発音をMP3として聴けるメリットは大きいと思っています。

また、単語ごとにLearner's Dictionaryへのリンクが生成されますので、他の意味を参照する時も便利です。

6  まとめ

以前、発音ファイルをMP3でダウンロードする方法を note に書いたことがあります。今回紹介したSBを使えばこうした手作業は必要ではありません。

手作業ですと一つのファイルを調べるのに5分。ところが、SBを使えば5秒で終わる。手作業より60倍も早く調べることができます。