
Building a QR Code Generator with 10 Content Types and Scan Analytics
QR codes are everywhere, but most generators only handle URLs. We built one that supports 10 content types — WhatsApp, WiFi, vCard, GPS, Email, UPI and more — with dynamic short links, scan analytics (device, browser, location), and custom dot styles. Here's how it's structured. Content Types Each QR type encodes a differently formatted string. The browser renders a live preview as the user fills in the fields. type QrType = | " URL " | " TEXT " | " PHONE " | " UPI " | " WHATSAPP " | " WIFI " | " EMAIL " | " VCARD " | " GPS " | " PDF " ; function buildQrContent ( type : QrType , fields : Record < string , string > ): string { switch ( type ) { case " WHATSAPP " : return `https://wa.me/ ${ fields . phone } ?text= ${ encodeURIComponent ( fields . message )} ` ; case " WIFI " : return `WIFI:T: ${ fields . encryption } ;S: ${ fields . ssid } ;P: ${ fields . password } ;;` ; case " EMAIL " : return `mailto: ${ fields . email } ?subject= ${ encodeURIComponent ( fields . subject )} &body= ${
Continue reading on Dev.to Tutorial
Opens in a new tab
