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

Explorando as APIs do HTML5

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Raphael Amorim Raphael Amorim
May 07, 2014
Programming
0
140

Explorando as APIs do HTML5

Avatar for Raphael Amorim

Raphael Amorim

May 07, 2014
Tweet

More Decks by Raphael Amorim

See All by Raphael Amorim
Rust 101 for Web
Avatar for Raphael Amorim raphamorim
0
220
Writing Your Own React Renderer
Avatar for Raphael Amorim raphamorim
4
330
the new react
Avatar for Raphael Amorim raphamorim
1
140
Composition on High-Order Components
Avatar for Raphael Amorim raphamorim
0
150
Understanding React
Avatar for Raphael Amorim raphamorim
1
330
Making for Web with WebAssembly
Avatar for Raphael Amorim raphamorim
4
900
Scratching React Fiber
Avatar for Raphael Amorim raphamorim
3
750
Understanding Memory Behavior on NodeJS
Avatar for Raphael Amorim raphamorim
1
380
Using Canvas Components
Avatar for Raphael Amorim raphamorim
0
310

Other Decks in Programming

See All in Programming
go directiveを最新にしすぎないで欲しい話──あるいは、Go 1.26からgo mod initで作られるgo directiveの値が変わる話 / Go 1.26 リリースパーティ
Avatar for Arthur arthur1
2
520
コーディングルールの鮮度を保ちたい / keep-fresh-go-internal-conventions
Avatar for NAGATA Hiroaki handlename
0
180
Claude Code Skill入門
Avatar for maya mayahoney
0
140
メタプログラミングで実現する「コードを仕様にする」仕組み/nikkei-tech-talk43
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
0
170
S3ストレージクラスの「見える」「ある」「使える」は全部違う ─ 体験から見た、仕様の深淵を覗く
Avatar for ya_ma23 ya_ma23
0
230
NOT A HOTEL - 建築や人と融合し、自由を創り出すソフトウェア
Avatar for Hokuto Shimokawa not_a_hokuts
2
970
CSC307 Lecture 13
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
320
Go 1.26でのsliceのメモリアロケーション最適化 / Go 1.26 リリースパーティ #go126party
Avatar for mazrean mazrean
1
370
AIコーディングの理想と現実 2026 | AI Coding: Expectations vs. Reality 2026
Avatar for Tomohisa Takaoka tomohisa
0
1.2k
CDIの誤解しがちな仕様とその対処TIPS
Avatar for futokiyo futokiyo
0
190
Railsの気持ちを考えながらコントローラとビューを整頓する/tidying-rails-controllers-and-views-as-rails-think
Avatar for MOROHASHI Kyosuke moro
5
390
Go Conference mini in Sendai 2026 : Goに新機能を提案し実装されるまでのフロー徹底解説
Avatar for Takahito Yamatoya yamatoya
0
550

Featured

See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
67
37k
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.9k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
122
21k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
290
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
75
5.1k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
140
Done Done
Avatar for chrislema chrislema
186
16k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
210
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
A Soul's Torment
Avatar for Nat Ma seathinner
5
2.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.3k

Transcript

  1. Explorando as APIs do HTML5

  2. None

  3. ! Write Code Every ! Single Day

  4. API's do HTML5 ?

  5. None

  6. Web Speech API

  7. Comportamento

  8. Comportamento

  9. Exemplos + raphamorim.com/sound-hunter/ + google.com/intl/pt/chrome/demos/ speech.html

  10. Vibration API

  11. Comportamento navigator.vibrate(time) if (navigator.vibrate) navigator.vibrate(500) ! ! navigator.vibrate([500, 1000, 2000])

  12. ! Fullscreen API

  13. Comportamento ! document.querySelector(‘html’).requestFullscreen() document.exitFullscreen()

  14. Comportamento Mas como saber o status da API? var fullscreenElement

    = document.fullscreenElement var fullscreenEnabled = document.fullscreenEnabled

  15. Comportamento Awesome!! Mas e quanto os eventos da API? fullscreenchange

    fullscreenerror

  16. Comportamento ::fullscreen & ::backdrop

  17. Exemplos + demo.hongkiat.com/html5- fullscreen-api/index.html

  18. None
  19. None
  20. None

  21. Geolocation

  22. Comportamento if (navigator.geolocation) navigator.geolocation.getCurrentPosition(showPosition) function showPosition(position) ! var latitude =

    position.coords.latitude; ! var longitude = position.coords.longitude;

  23. Comportamento position.coords.latitude position.coords.longitude altitude speed altitudeAccuracy timestamp accuracy heading

  24. Suporte

  25. Exemplos + html5demos.com/geo

  26. …E isso é tudo pessoal :) raphamorim