Blueskyのいろいろ作ってみた

Transcript

1. Blueskyのいろいろ つくった話 2023/06/02 – Blueksy/AT Protocol勉強会 #1.5
2. もくじ • 自己紹介 • The-Blueを作ってみた • Bsky-MassDriverを作ってみた • Bksy-Albumを作ってみた • Jiho-Botを作ってみた • SkyLog, Sky-highを作ってみた • 今後の展望
3. 自己紹介
4. Shino3（しのさん） です
5. Shino3（しのさん） です • プログラマ・エンジニア • 最近はWeb系 • 組み込みソフトウェアが最初 • 2019年からWEB等の業界に • PHP/Laravelがメイン • 必要に応じてどの言語も書きます
6. Shino3（しのさん） です • 個人開発：Bluesky, Nostr • 自動車競技など。走ること • スマートフォン・ガジェット等 • 自作キーボードの設計・開発 • 推し：WeatherNews Live 檜山沙耶さん
7. The Blue つくってみた
8. Bluesky Client • 何回も紹介させて頂いてるので割愛 • Bluesky Meetup in Tokyo – first take の 動画を御覧ください
9. The Blueの問題点 Vue2 Nuxt2
10. The Blueの問題点 Vue2 Nuxt2 サポートが そろそろ切れそう
11. The Blueの問題点 • タイムラインの構築 • 投稿・リプ・リポスト、ふぁぼ等・・・ • 通知一覧を表示 • プロフィールや投稿のページを表示 • その他、表示したい情報などの設定
12. The Blueの問題点 やること多すぎなんよ・・・ • タイムラインの構築 • 投稿・リプ・リポスト、ふぁぼ等・・・ • 通知一覧を表示 • プロフィールや投稿のページを表示 • その他、表示したい情報などの設定
13. でも？
14. Webも Androidも
15. 公式があるやんけ！！
16. 優先度を下げよう！
17. 開発停止！！
18. Bsky-Massdriver つくってみた
19. 投稿専用 Webクライアント •現在、唯一の機能
20. 投稿専用 Webクライアント • 投稿のみに特化！！ • 投稿しかできない！！ • すか廃仕様（後ほど言及します） • PWA対応 • 思い立ったら即投稿
21. 投稿専用 Webクライアント •URLクエリパラメータ対応！！
22. 投稿専用 Webクライアント •URLクエリパラメータ対応！！ <a href="https://mdrv.shino3.net?intent=%EF%BE%9D%EF%BE%85%EF%BD% A7%EF%BD%9E%21%21%21“ > Blueskyでシェア </a>
23. 投稿専用 Webクライアント •URLクエリパラメータ対応！！ <a href="https://mdrv.shino3.net?intent=%EF%BE%9D%EF%BE%85%EF%BD% A7%EF%BD%9E%21%21%21“ > Blueskyでシェア </a>
24. 投稿専用 Webクライアント •URIエンコードってめんどくさい よね？？？ <a href="https://mdrv.shino3.net?intent=%EF%BE%9D%EF%BE%85%EF%BD% A7%EF%BD%9E%21%21%21“ > Blueskyでシェア </a>
25. 投稿専用 Webクライアント •URLクエリパラメータ対応！！ <a href="https://mdrv.shino3.net?intent=%EF%BE%9D%EF%BE%85%EF%BD% A7%EF%BD%9E%21%21%21“ > Blueskyでシェア </a> ここを押せば シェア一発！
26. The Blueの問題点より Vue2 Nuxt2 サポートが そろそろ切れそう
27. The Blueの問題点より • 慣れていたNuxt→Svelteベースに変更 • お勉強と実績作り • TypeScriptに対応
28. The Blueの問題点より • 慣れていたNuxt→Svelteベースに変更 • お勉強と実績作り • TypeScriptに対応 できた！！！
29. Bksy-Album つくってみた
30. 自分の投稿画像を追いかけるツール • MassDriverをベースに改造 • ログイン機能をそのまま継承 • 過去3,000件の投稿から画像を抽出 • 投稿の抽出は、SkyLogとかSkyHighの流用（後述）
31. 自分の投稿画像を追いかけるツール • なんでつくったの？
32. 自分の投稿画像を追いかけるツール • なんでつくったの？ ノリと勢い！！
33. 自分の投稿画像を追いかけるツール • なんでつくったの？ ブルスコに投稿した画像を 追いかけるツールみたいなの無いかな？
34. 自分の投稿画像を追いかけるツール • なんでつくったの？ ブルスコに投稿した画像を 追いかけるツールみたいなの無いかな？
35. 自分の投稿画像を追いかけるツール
36. 自分の投稿画像を追いかけるツール
37. Jiho-bot つくってみた
38. ほぼ30分おきに時間 を投稿してくれます • JavaScriptでバッチ処理をする練習 • 30分おき
39. 実装 • Momentで現在時刻を取得 • 投稿！ • 以上！！
40. 実装 • momentで現在時刻を取得 • 投稿！ • 以上！！ それだけ！？
41. 設 更 計 変
42. 実装 • momentで現在時刻を取得 • 投稿！ • 6分間の間でランダム • →ほぼ時間通りなBotが完成 • node-cronを使用 • cron→supervisorに変更
43. 実装 デバッグが簡単 になった！！！
44. 実装 だいじ！！
45. SkyLog SkyHigh つくってみた
46. 一日一回、投稿数を集計します
47. なんでつくったの？ • 自分の投稿数、気になるな・・・・？ • なんかめっちゃ、つぶやく人おる • この人いつもTLで見かけるじゃん
48. なんでつくったの？ • 自分の投稿数、気になるな・・・・？ • なんかめっちゃ、つぶやく人おる • この人いつもTLで見かけるじゃん 作るわ！！
49. 実装 • 過去の投稿を3,000件遡る • 1回のGetリクエストで最大100件まで取得可能  フォロワー一覧  指定ユーザーの投稿一覧 • Cursolを使って再帰処理 • 日付で判定して、24時間ぶん集計する
50. 実装 • 過去の投稿を3,000件遡る • 1回のGetリクエストで最大100件まで取得可能  フォロワー一覧  指定ユーザーの投稿一覧 • Cursolが取れるので再帰処理を実装 • 日付で判定して、24時間ぶん集計する クライアント作った経験が 役に立ったヮ
51. 結果
52. 結果
53. ぬるぽ
54. 結果
55. 結果
56. 結果
57. 結果
58. 結果
59. 結果 廃人が増え た！！
60. おまけ
61. Weather News Live タイムスケジュールBot
62. Stream系の実装に関して調査
63. Stream系の実装に関して調査