Abhisek D.

The Power of Modern Web

Explore interactive demonstrations of cutting-edge browser APIs. Learn how modern web applications access device capabilities while respecting user privacy.

Why This Matters

Modern browsers expose 100+ APIs that transform web apps into powerful, native-like experiences. These demonstrations show what's possible today—and help you understand the privacy implications of each capability.

No server required: All demos run entirely in your browser

Privacy first: Your data never leaves your device

Educational: Learn real-world use cases and best practices

Open source: All code available for learning

Filter by Category:

Filter by Difficulty:

Live Demo
EssentialBeginner

Device Information Dashboard

Comprehensive view of all device and browser capabilities including geolocation, battery, network, screen info, storage, and more. Perfect starting point to understand what data browsers can access.

✓Geolocation
✓Battery Status
✓Network Info
✓Screen Data
Navigator APIGeolocation API
Live Demo
AdvancedAdvanced

Biometric Authentication

Experience passwordless login using WebAuthn API with Touch ID, Face ID, or Windows Hello. Learn how modern web apps implement secure, phishing-resistant authentication.

✓Touch ID
✓Face ID
✓Windows Hello
✓Security Keys
WebAuthn APIFIDO2
Live Demo
EssentialBeginner

Geolocation & Maps

Access GPS coordinates and visualize your location on interactive maps. Learn about accuracy, permissions, and real-world use cases for location-based features.

✓GPS Location
✓Map Integration
✓Distance Calculation
✓Location Tracking
Geolocation APILeaflet/Mapbox
Live Demo
EssentialBeginner

Battery Status Monitor

Monitor device battery level, charging status, and time remaining. Understand how apps optimize for low power and implement battery-aware features.

✓Battery Level
✓Charging Status
✓Time Estimates
✓Power Saving
Battery Status API
Live Demo
EssentialBeginner

Network Information

Detect connection type, speed, and data saver mode. See how apps deliver adaptive content based on network conditions.

✓Connection Type
✓Speed Detection
✓Data Saver
✓Latency (RTT)
Network Information API
Coming Soon
AdvancedIntermediate

Media Devices & Camera

Access camera, microphone, and screen sharing capabilities. Build video conferencing, photo capture, and audio recording features.

✓Camera Access
✓Microphone
✓Screen Sharing
✓Photo Capture
MediaDevices APIWebRTC
Coming Soon
BusinessIntermediate

Storage Management

Manage offline data with IndexedDB, localStorage, and Cache API. Visualize storage quota and build offline-first applications.

✓Storage Quota
✓IndexedDB
✓Cache API
✓localStorage
Storage APIIndexedDB
Coming Soon
BusinessBeginner

Clipboard Operations

Copy and paste text, images, and formatted content. Explore modern clipboard API with enhanced functionality.

✓Copy Text
✓Paste Content
✓Image Support
✓Formatted Text
Clipboard APINavigator
Coming Soon
InteractiveIntermediate

Device Orientation

Detect device tilt and rotation for gaming, AR, and immersive experiences. Build motion-controlled interfaces.

✓Tilt Detection
✓Rotation Tracking
✓Gaming Controls
✓AR Support
DeviceOrientation APIDeviceMotion API
Coming Soon
InteractiveIntermediate

Speech Recognition

Convert voice to text with Web Speech API. Build voice commands, dictation, and hands-free interactions.

✓Voice to Text
✓Voice Commands
✓Multi-language
✓Real-time
Web Speech APISpeechRecognition
Coming Soon
BusinessAdvanced

Payment Request

Native checkout experience with Payment Request API. Accept payments with stored cards and digital wallets.

✓Quick Checkout
✓Saved Cards
✓Digital Wallets
✓Secure Payments
Payment Request API
Coming Soon
AdvancedAdvanced

Web Bluetooth

Connect to nearby Bluetooth devices. Build IoT interfaces for fitness trackers, smart home, and wearables.

✓Device Pairing
✓IoT Connection
✓Fitness Trackers
✓Smart Home
Web Bluetooth APIGATT
Back to Portfolio
Chat with me!