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
9
0

MDNのWebAPI 3選

Avatar for kuracchi

kuracchi

March 18, 2026

More Decks by kuracchi

See All by kuracchi
大規模なプロダクト開発に携わる新卒エンジニアの苦労と成長
Avatar for kuracchi kura04
0
39
新卒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
95

Featured

See All Featured
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
Avatar for Liv Day livdayseo
0
140
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
200
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
Avatar for Dan Newman danielanewman
230
23k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.5k
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
360
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
370
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
230
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
3
3.4k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.5k
Mind Mapping
Avatar for Hélio Medeiros helmedeiros
PRO
1
250
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
7
36k

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