Menu

1 / 2

Adding native-feeling haptics to Angular web apps with ng-haptics

DEV Community·Nicolás Giacconi·6 months ago
#iEHeb81B
#demo#angular#haptics#opensource#native
Reading 0:00
15s threshold

Adding native-feeling haptics to Angular web apps with ng-haptics

I wanted Angular web apps to feel a bit more “native” on mobile devices, especially when it comes to touch feedback.

So I built a small open-source library called ng-haptics .

It’s a lightweight Angular-first way to add haptic feedback using only native Web APIs.

💡 Why this exists

Web apps often feel “flat” compared to native apps.

One missing piece is tactile feedback:

button presses

success/error feedback

interaction confirmation

Native apps solve this with haptics. Web apps usually don’t.

ng-haptics tries to bridge that gap in Angular.

⚙️ What it is

A tiny Angular library that provides:

Standalone APIs

Declarative directives

SSR-safe design

Zero dependencies

Mobile-first testing

🧪 Example usage

<button ngHaptic= "light" > Click me </button>

Enter fullscreen mode

Exit fullscreen mode

📱 Demo

🎥 Demo video

🧠 Notes

This is not a wrapper around Capacitor or native SDKs.

It’s built entirely on top of native Web APIs…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.