[Go Make Things] How to build a Share This button using HTML Web Components and JavaScript

By rahmat hidayat

Saturday, May 31, 2025

​ Need front-end help but don't need a full-time employee? I now offer subscription front-end engineering. Ship faster and build better systems. Pause or cancel any time. Earlier this week, I walked through how to build a "copy to clipboard" button using HTML Web Components. Over on my YouTube channel, I ended up working on a similar project: how to build a "Share This" button. This one uses the navigator.share() method: an asynchronous function that triggers the OS-native share card in supporting browsers. In this video, you'll see me… Add basic functionality Check for browser support Add accessibility features Provides options and settings for customization You can grab the full source code on GitHub, and watch on YouTube to see me code it in real-time. Learn more about subscription front-end engineering. Ship faster and build better systems. Cheers, Chris ​ Want to share this with others or read it later? View it in a browser.​ ​

Did someone forward this to you? Get Daily Developer Tips.

Don't want to get these emails? Totally cool. Update your subscriber preferences.

You can also unsubscribe from all emails from me, including updates to products you've purchased.

113 Cherry St #92768, Seattle, WA 98104-2205

Share :

Facebook Twitter Google+ Lintasme