10.1 ブロック要素の分類
- ブロック要素の関係性を示した図です。
10.2 Page object
10.2.1 単体ページ
単体ページサンプル- 上の単体ページの URL をここに貼っておきましょう。アプリで開いている人は、上のページを開いた後で、Cmd-L(macOS), Ctrl-L (Windows)でコピーできます。またブラウザで開いている人はアドレスバーから取得できます。今回のようにページが直接貼られている場合には、ブロックハンドル(6点のもの)のメニューで表示される「リンクをコピー」でも取得できます。
ページの URL を記載
例: https://www.notion.so/hkob/2bcd8e4e98ab81e883b6ff10b6cd88e8?source=copy_link
補足説明
最近、ページ URL を取得すると末尾に「?source=copy_link」が付与されるようになっています。初版の書籍では末尾の32桁の16進数という説明が記述されていますが、? 以降の文字列を抜いた末尾32文字と読み替えてください。NotionRubyMapping でも v0.7.6 にて、末尾の ? 以降の文字列を無視するようにしました。v0.7.5 以前の NotionRubyMapping を使っている場合には、gem を再インストールしてアップデートしてください。
または
- 以下のメソッドで page を取得します。
- Page object を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。取得した結果の
"id"部が上のページ URL の赤字部分と一致していることが確認できます。
JSON 部分をコピー&貼り付け
10.2.2 データソースに所属するページ
- データソース内のページ(最初のページ)へのメンションリンクを用意しました。このリンクからページを開き、ページリンクを取得してください。
ページの URL を記載
例: https://www.notion.so/hkob/2bcd8e4e98ab81c5963cdbc38ea9d93f?source=copy_link
- 以下のメソッドで page を取得します。
- Page object を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。取得した結果の
"id"部が上のページ URL の赤字部分と一致していることが確認できます。
JSON 部分をコピー&貼り付け
10.3 DataSource object
- 今回取り扱うデータベースは以下のサンプルデータベースです。このデータベースにはデータソースが一つ入っています。
- 後で ID が一致することを確認するために、ビューの設定から「データソースを管理」を選び、「…」の部分のメニューにある「データソースIDをコピー」としてください。
- クリップボードにデータソースIDが入っているので、ここに保存しておきましょう。
データソースIDを貼り付け
- このデータソースは直接 URL から取得することもできますが、先ほど取得したページの親としてデータソースを取得してみます。
- DataSource object を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。取得した結果の
"id"部が上のページ URL の赤字部分と一致していることが確認できます。
JSON 部分をコピー&貼り付け
10.4 Database object
- 上のサンプルデータベースを取得します。実際にはデータソースの親として取得しますが、後で ID を確認するために URL から ID を取得してみます。まずはサンプルデータベースを開きページリンクを取得してください。赤字の部分が database_id となります。
ページの URL を記載
例: https://www.notion.so/hkob/2bcd8e4e98ab813a8b68cfec895adc46?v=2bcd8e4e98ab81a1ae41000c30da63b2&source=copy_link
- このデータソースは直接 URL から取得することもできますが、先ほど取得したページの親としてデータソースを取得してみます。
- DataSource object を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。取得した結果の
"id"部が上のページ URL の赤字部分と一致していることが確認できます。
JSON 部分をコピー&貼り付け
10.5 Block object
ブロック一覧- 今回取り扱うブロックは以下のページに置かれています。このページの URL を取得してください。
ページの URL を記載
例: https://www.notion.so/hkob/2bcd8e4e98ab812abf98fa554a977972?source=copy_link
- 以下のメソッドで page を取得します。
- 以下のメソッドで block の配列を取得します。
- ブロックは全部で 30 個あります。
10.5.1 Bookmark block object
最初の要素(blocks の0番目の要素)のブックマークブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.2 Breadcrumb block object
- 1番目の要素の階層リンクブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.3 Bulleted list item block object
- 2番目の要素の箇条書きリストブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.4 Callout block object
- 3番目の要素のコールアウトブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.5 Code block object
- 4番目の要素のコードブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.6 Column list block object/ Column block object
- 5番目の要素の列リストブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- has_children があるので、Column list block は子要素を持ちます。次に Column list ブロックの最初の子要素の JSON を表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- この Column block も子要素を持ちます。さらに Column block の子要素を確認します。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 以下の図はColumn list ブロックの関係を示したものです。
10.5.7 Divider block object
- 6番目の要素の区切り線ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.8 Embed block object
- 7番目の要素の埋め込みブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.9 Equation block object
- 8番目の要素の数式ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.10 File block object
- 9番目の要素のファイルブロックを JSON で表示してみます。
10.5.11 Heading block object
- 10番目の要素の見出し1ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 11番目の要素の見出し2ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 12番目の要素の見出し3ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.12 Image block object
- 13番目の要素のイメージブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.13 Link to page block object
- 14 番目の要素のページリンクブロック(ページ) を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 15 番目の要素のページリンクブロック(データベース) を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.14 Numbered list item block object
- 16番目の要素の番号付きリストブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.15 Paragraph block object
- 17番目の要素のテキストブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.16 PDF block object
- 18番目の要素の PDF ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.17 Quote block object
- 19番目の要素の引用ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.18 Synced block object
- 20番目の要素の同期ブロック(オリジナル)を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 21番目の要素の同期ブロック(コピー)を JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.19 Table block object / Table row block object
- 22番目の要素のテーブルブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
Table block の子要素の最初の要素(0行目)である table_row を確認してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.20 Table of contents block object
- 23番目の要素の目次ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.21 To do block object
- 24番目の要素の To do ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.22 Toggle block object
- 25番目の要素のトグルブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.23 Toggle heading block object
- 26番目の要素のトグル見出し1ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 27番目の要素のトグル見出し2ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
- 28番目の要素のトグル見出し3ブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
10.5.24 Video block object
- 29番目の要素のビデオブロックを JSON で表示してみます。
- 後で確認できるように出力された結果を保存しておきましょう。
JSON 部分をコピー&貼り付け
この CHAPTER 内の SECTION
CHAPTER LIST