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

Explorando as APIs do HTML5

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
210
Writing Your Own React Renderer
Avatar for Raphael Amorim raphamorim
4
320
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
320
Making for Web with WebAssembly
Avatar for Raphael Amorim raphamorim
4
890
Scratching React Fiber
Avatar for Raphael Amorim raphamorim
3
740
Understanding Memory Behavior on NodeJS
Avatar for Raphael Amorim raphamorim
1
380
Using Canvas Components
Avatar for Raphael Amorim raphamorim
0
300

Other Decks in Programming

See All in Programming
Apache Iceberg V3 and migration to V3
Avatar for Tomohiro Tanaka tomtanaka
0
150
MDN Web Docs に日本語翻訳でコントリビュート
Avatar for uutan1108 ohmori_yusuke
0
640
Implementation Patterns
Avatar for Denys Poltorak denyspoltorak
0
280
2026年 エンジニアリング自己学習法
Avatar for yumechi(Motoki Hirao) yumechi
0
130
CSC307 Lecture 02
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
770
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
Avatar for nrs nrslib
2
1.8k
AWS re:Invent 2025参加 直前 Seattle-Tacoma Airport(SEA)におけるハードウェア紛失インシデントLT
Avatar for tetutetu214 tetutetu214
2
100
Basic Architectures
Avatar for Denys Poltorak denyspoltorak
0
660
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
Avatar for nash_efp nash_efp
0
920
[KNOTS 2026登壇資料]AIで拡張‧交差する プロダクト開発のプロセス および携わるメンバーの役割
Avatar for hisatake hisatake
0
250
Grafana：建立系統全知視角的捷徑
Avatar for Blueswen blueswen
0
330
Smart Handoff/Pickup ガイド - Claude Code セッション管理
Avatar for rasshii yukiigarashi
0
130

Featured

See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
9.9k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
2.8k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
380
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
128
17k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
440
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto Wada twada
PRO
117
110k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.7k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
527
40k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
Neural Spatial Audio Processing for Sound Field Analysis and Control
Avatar for NII S. Koyama's Lab skoyamalab
0
160
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.3k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
100

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