Upgrade to Pro — share decks privately, control downloads, hide ads and more …

MDNのWebAPI 3選

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for kuracchi kuracchi
March 18, 2026
12
0

MDNのWebAPI 3選

Avatar for kuracchi

kuracchi

March 18, 2026

More Decks by kuracchi

See All by kuracchi
大規模なプロダクト開発に携わる新卒エンジニアの苦労と成長
Avatar for kuracchi kura04
0
42
新卒1年目がTPACに参加したことをきっかけにMDNのWeb APIを全部読んでみた。
Avatar for kuracchi kura04
3
110
新卒目線で感じたAIレビュー機能開発の学びと課題
Avatar for kuracchi kura04
0
600
ChromeDevTools_MCPを活用したフロントエンド開発
Avatar for kuracchi kura04
0
100

Featured

See All Featured
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
470
Designing for Performance
Avatar for Lara Hogan lara
611
70k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
1
2.8k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3.3k
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
990
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
360
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
1
430
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.5k
Stewardship and Sustainability of Urban and Community Forests
Avatar for Eric Wiseman pwiseman
0
280
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
360
30k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
380
Music & Morning Musume
Avatar for Bryan Veloso bryan
47
7.3k

Transcript

  1. MDNのWeb API[spec]を 全部読んでみた 2025.02.18 くらっち 1

  2. Web APIを全部読んでみた 2

  3. Web API3選 3

  4. HTML Drag and Drop API 4

  5. ブラウザでドラッグ&ドロップを 実装できるAPI 5

  6. HTMLをドラッグ可能にするには draggble属性をtrueに設定する 6

  7. “draggble=true”の実装 7

  8. ドラッグ開始時やドラッグ中、 ドロップした時の処理を実装可能 8

  9. ドラッグイベントを利用したDnDの実装 9 推しWebAPI3選

  10. HTMLとJavaScriptで 簡単にDnDが実装可能 10

  11. Battery Status API 11

  12. デバイスのバッテリー量や変化を 取得することが出来るAPI 12

  13. 今回注目するのは ブラウザ毎の実装方針 13

  14. 実装されていないブラウザがある 14 mdn， Battery Status API， https://developer.mozilla.org/en-US/docs/Web/API/Battery_Status_API

  15. プライバシー上の懸念により FireFoxから削除された 15 bleepingcomputer， Battery Status API being Removed from

    Firefox due to Privacy Concerns， https://www.bleepingcomputer.com/news/software/battery-status-api-being-removed-from-firefox-due-to-privacy-concerns/

  16. まだ実装されていないだけでなく 実装しないパターンもある 16

  17. File System API 17

  18. デバイスのファイルにアクセス 読み込みや書き込み等が可能なAPI 18

  19. 思い入れのあるAPIなので選出 19

  20. 思い入れのあるAPIとは？ 20

  21. OSSに初めてContributeする きっかけになったAPI！ 21

  22. MDNのtypoを修正 22

  23. MDNにContributeするまで 23

  24. 2025年11月に開催された TPAC 2025に参加 24

  25. Webは自分達が作っていくもの と意識が変わる 25

  26. 2025年12月に1人アドカレを行い WebAPIを1日1つまとめる 26

  27. 19日目のアドカレでtypoを発見 27

  28. 同期や先輩に相談し、 MDNにContributeすることを決心 28

  29. MDNのtypoを修正（再掲） 29

  30. TPACに参加したことで Webに対して行動することが出来た 30

  31. ご清聴ありがとうございました！ 31

  32. ©️ Cybozu, Inc. 32