そして広がるNotionの可能性〜Notion APIを添えて〜

by MIERUNE

Slide 1

Slide 1 text

そして広がるNotionの可能性〜Notion APIを添えて〜須田峻宗

Slide 2

Slide 2 text

©Project PLATEAU / MLIT Japan 須田峻宗　自己紹介 SUDA 　TAKAMUNE 3年前に北海道に埼玉から移住新雪を好む生粋の「パウダージャンキー」パウダーの嗅覚には定評あり◎ ソフトウェアエンジニア

Slide 3

Slide 3 text

©Project PLATEAU / MLIT Japan 先日新しい板を買いました。　自己紹介

Slide 4

Slide 4 text

©Project PLATEAU / MLIT Japan 　自己紹介 BBQ経由で昨年11月にMIERUNEに入社『 BBQ入社』

Slide 5

Slide 5 text

©Project PLATEAU / MLIT Japan 　自己紹介 2023.05.31 BBQ #1 参加 2023.06.30 BBQ #2 参加 2023.07.27 BBQ #3 人生初登壇 2023.09.29 BBQ #4 参加 2023.10.31 BBQ #5 参加 2023.12.27 BBQ #6 参加 2024.02.27 BBQ #7 BBQ初 2回目の登壇 2023.11.01 MIERUNE 入社シニア向けモバイルアプリ開発における設計思想について

Slide 6

Slide 6 text

©OpenStreetMap contributors そして広がるNotionの可能性〜Notion APIを添えて〜

Slide 7

Slide 7 text

©Project PLATEAU / MLIT Japan 　　Notion 使ってる人います？

Slide 8

Slide 8 text

©OpenStreetMap contributors 01　Notionとは 02　Notion APIでできること 03　組み込んでみた 04　まとめ目次

Slide 9

Slide 9 text

©OpenStreetMap contributors 01 Notionとは

Slide 10

Slide 10 text

©Project PLATEAU / MLIT Japan オールインワン Notionの特徴　Notionとはドキュメント・メモ・プロジェクト管理, 表計算, カレンダー参照: Figma, Google Drive・Sheets・Docs, GitHub, etc...

Slide 11

Slide 11 text

©Project PLATEAU / MLIT Japan Notionの特徴　Notionとは自由レゴ etc... 埋め込みデータベーステーブルテキスト

Slide 12

Slide 12 text

©Project PLATEAU / MLIT Japan ページブロック Notionの特徴　Notionとはブロックテキストブロック・・・ DB ブロックページブロック無限階層が可能！

Slide 13

Slide 13 text

©Project PLATEAU / MLIT Japan Notionの特徴　Notionとは

Slide 14

Slide 14 text

©OpenStreetMap contributors 02 Notion APIでできること

Slide 15

Slide 15 text

©Project PLATEAU / MLIT Japan ●ページ ●データベースコンテンツの読み取り・書き込み・削除　Notion APIでできることコメントの読み取り・書き込み・削除ユーザー情報の読み取り

Slide 16

Slide 16 text

©Project PLATEAU / MLIT Japan 　Notion APIでできること ●ページ ●データベースコンテンツの読み取り・書き込み・削除コメントの読み取り・書き込み・削除ユーザー情報の読み取り

Slide 17

Slide 17 text

©Project PLATEAU / MLIT Japan Notionと外部(他サービス)を連携させる仕組み　Notion APIでできることページ・データベースコネクト GitHub GitHub コネクト Slack Slack コネクト開発者・・・インテグレーション

Slide 18

Slide 18 text

©Project PLATEAU / MLIT Japan どのような値が取れるのか　Notion APIでできること実際にやってみます

Slide 19

Slide 19 text

©OpenStreetMap contributors 03 組み込んでみた

Slide 20

Slide 20 text

©OpenStreetMap contributors コンテンツ読み取り編

Slide 21

Slide 21 text

©Project PLATEAU / MLIT Japan ブログ執筆から投稿組み込んでみた - コンテンツ読み取り記事執筆 Qiita・Zenn 投稿サイトテキスト画像コピペ

Slide 22

Slide 22 text

©Project PLATEAU / MLIT Japan 組み込んでみた - コンテンツ書き込みブログ執筆から投稿 - 画像記事執筆 Qiita・Zenn 投稿サイト web公開？ダウンロードしてアップロード？クラウド？

Slide 23

Slide 23 text

©Project PLATEAU / MLIT Japan 組み込んでみた - コンテンツ書き込みブログ執筆から投稿 - 画像記事執筆 Qiita・Zenn 投稿サイト web公開？ダウンロードしてアップロード？クラウド？面倒くさい！！

Slide 24

Slide 24 text

©Project PLATEAU / MLIT Japan 『Notion to Blog』組み込んでみた - コンテンツ読み取り記事執筆 Qiita・Zenn 投稿サイト Notionページ内の画像を自動的にS3にアップロード、ページの画像パスをオブジェクトURLに置換し、Markdownに変換 API データ AWS S3 画像テキスト Markdown 変換コピペパス置換

Slide 25

Slide 25 text

©Project PLATEAU / MLIT Japan 『Notion to Blog』組み込んでみた - コンテンツ読み取り Notion APIで取得できる画像パスは Notion環境AWS S3の署名付きURL 1時間で参照できなくなる。自分の環境にコピーして配信することで、この問題を解決する。

Slide 26

Slide 26 text

Slide 27

Slide 27 text

Slide 28

Slide 28 text

Slide 29

Slide 29 text

©Project PLATEAU / MLIT Japan 社員の行動管理組み込んでみた - コンテンツ書き込みある休日・・・「MS Accessで管理している社員の行動管理を移管して、移動先でも容易に確認できて、画面上・メールでの更新を他のツールでもできるようにしたい。あと分析もしたい。」「それNotionでよくないっすか？」お客さん私やってみた

Slide 30

Slide 30 text

Slide 31

Slide 31 text

©Project PLATEAU / MLIT Japan 社員の行動管理組み込んでみた - コンテンツ書き込みデータベースブロック社員B(ページブロック) 社員C(ページブロック) 社員D(ページブロック) 社員A(ページブロック) 現在:〇〇社員A(ページブロック)

Slide 32

Slide 32 text

©Project PLATEAU / MLIT Japan 社員の行動管理組み込んでみた - コンテンツ書き込みデータベースのブロックのうち、更新するブロックを特定する。 "filter": { "property": "line_user_id", "rich_text": { "equals": "{line_user_id}" } } https://api.notion.com/v1/databases/${notionDatabaseId}/query

Slide 33

Slide 33 text

©Project PLATEAU / MLIT Japan 社員の行動管理組み込んでみた - コンテンツ書き込み特定したブロックのプロパティを更新する "properties": { "現在": { "rich_text": [ { "text": { "content": currentTask } } ] } } https://api.notion.com/v1/pages/${pageId}