Introduction

vue-use-web is a collection of Web APIs exposed as Vue.js composition hooks that's upcoming in Vue 3.0

You can use them with Vue 2.0 using @vue/composition-api until Vue 3.0 gets out.

What and why

Web APIs are ever changing, this library aims to provide to Vue.js developers a stable interface that integrates well into the ecosystem. Also an interface that degrades gracefully when browsers do not support said features.

I initially was choosing to expose this as a Stateful functional components but that isn't very handy and is not future proof. Implementing these APIs in Vue composition API (hooks) makes them ready for Vue 3.0 and beyond. Personally I think this is the perfect example to showcase the power of the Composition API.

Features

• Reactive Web APIs that are compatible with Vue.js.
• Graceful degradation for old browsers and denied permissions.
• Maintains similarities to the original APIs as close as possible.
• Written in TypeScript.

Available Functions

These are the currently implemented Web APIs and the planned ones.

• Battery Status API.
• Clipboard API.
• Device Light.
• Device Motion.
• Device Orientation.
• Document Visibility.
• Event Listener.
• Fetch API.
• Full-screen.
• Geo-location API.
• Hardware Concurrency.
• Intersection Observer.
• Local storage API.
• Media Query.
• Memory Status
• Mouse Position.
• Network Information API.
• Preferred Color Scheme.
• Preferred Languages.
• Script.
• WebSocket.
• Window Scroll Position.
• Window Size.
• Worker.
• Media Devices
• Bluetooth WIP.
• Notification WIP.
• Share WIP.