📚

Obsidian WebclipperでO'Reilly Learningの学習を効率化する方法

に公開1

はじめに

O'Reilly Learning について

O'Reilly Learning は、オンライン学習プラットフォームで、6万冊以上の書籍や3万時間以上の動画を提供しています。
個人向け正規料金は年額499ドルです。
O'Reilly Learningの価格

ACM(Association for Computing Machinery)のプロフェッショナル会員になると年会費99米ドル + Skills Bundle Add-On 75米ドル/年で、O'Reilly Learningにアクセスできます。

Obsidian Webclipper について

Obsidian Webclipper は、ブラウザの拡張機能で、ウェブページを簡単にObsidianのVaultに保存できます。ワンクリックでMarkdown形式で自分のVaultに保存でき、情報の整理と再利用が容易になります。

O'Reilly Learningでの活用方法

O'Reilly Learningでは、Webブラウザで本を読み、ハイライトやメモを付けることができます。しかし、Obsidianに本の内容を保存することで、以下のような追加メリットが得られます:

  • AIを使った内容の要約生成
  • 英語版の書籍を日本語に翻訳
  • 保存した内容についてAIとチャットしながら理解を深める

これらの機能により、学習効率が大幅に向上します。

効果的なクリップの方法

Obsidian Webclipperは非常に優れたツールで、表示しているWebページの内容を簡単にMarkdown形式でクリップできます。さらに、ドメインごとにカスタムテンプレートを設定することで、より効果的に情報を整理できます。

私がO'Reilly Learningで使用しているテンプレートは以下の通りです。

{
	"schemaVersion": "0.1.0",
	"name": "OReillyLearningDefault",
	"behavior": "create",
	"noteContentFormat": "{{content}}",
	"properties": [
		{
			"name": "title",
			"value": "{{title}}",
			"type": "text"
		},
		{
			"name": "url",
			"value": "{{url}}",
			"type": "text"
		},
		{
			"name": "author",
			"value": "{{meta:property:og:book:author}}",
			"type": "multitext"
		},
		{
			"name": "date",
			"value": "{{date}}",
			"type": "text"
		},
		{
			"name": "tags",
			"value": "oreilly",
			"type": "multitext"
		}
	],
	"triggers": [
		"https://learning.oreilly.com/"
	],
	"noteNameFormat": "{{meta:property:og:description}}",
	"path": "Books/OReilly/{{selector:#content-navigation > nav > section > div._currentTitleSection_8feuc_186._currentTitleFocusState_8feuc_219 > div._currentContent_8feuc_196}}"
}

このテンプレートでは以下のようなカスタマイズを行っています:

  • 保存先ディレクトリを Books/OReilly に設定
  • 著者情報を正確に取得するため {{author}} の代わりに {{meta:property:og:book:author}} を使用
  • 章名を含むノート名にするため {{title}} ではなく {{meta:property:og:description}} を使用

もっと良いやり方があればぜひ教えてください。

Obsidian Webclipper で使用できる変数

Obsidian Webclipper で使用できる変数は簡単に確認できます:

  1. クリップしたいページを開く
  2. Webclipperのアイコンをクリック
  3. 右上の ... をクリック

以下のように利用可能な変数一覧が表示されます:
Obsidian Webclipperの変数一覧

selector の確認方法

selectorは、以下の手順でブラウザの検証ツールを使って簡単に取得できます:

  1. 対象の要素を右クリック
  2. 「検証」を選択
  3. 要素を右クリックして copy > Copy selector を選択
  4. コピーしたセレクタを {{selector: xxxxx}} の形式でテンプレートに貼り付け

まとめ

この記事では、Obsidian WebclipperでO'Reilly Learningの内容を効率的に保存し活用する方法を紹介しました。主なポイントは以下の通りです:

  1. カスタムテンプレートの活用:O'Reilly Learning専用のテンプレートを設定することで、書籍情報を適切に整理できます。

  2. 知識の統合:クリップした内容をObsidianのナレッジベースに統合することで、検索性と再利用性が向上します。

  3. AIとの連携:保存した技術書の内容をAIで要約・翻訳したり、内容についてAIとチャットすることで理解を深められます。

  4. 学習サイクルの効率化:読書→クリップ→整理→復習のサイクルを確立することで、継続的な学習が可能になります。

Obsidian WebclipperとO'Reilly Learningを組み合わせることで、技術書の内容を単に読むだけでなく、自分の知識ベースとして活用し、実践に役立てることができます。ぜひ皆さんも試してみてください。

GitHubで編集を提案

Discussion

u1u1

Obsidian Webclipperで取り込んだ本文はなぜかコードブロックが取り込めていなかったです