annyang : La reconnaissance vocale en JavaScript, facile comme bonjour !

Salut les amis ! Aujourd'hui on va parler d'une petite pépite JavaScript qui va vous permettre d'ajouter de la reconnaissance vocale à vos sites web en quelques lignes de code : annyang !

C'est quoi annyang ?

En gros, c'est une bibliothèque JavaScript ultra légère (2kb !) qui permet à vos visiteurs de contrôler votre site avec leur voix. Et le meilleur ? Pas besoin de dépendances externes !

// D'abord, on inclut la bibliothèque
<script src="//cdnjs.cloudflare.com/ajax/libs/annyang/2.6.0/annyang.min.js"></script>

// Ensuite, on met en place nos commandes
if (annyang) {
    const commands = {
        'bonjour': () => alert('Hey, salut !'),
        'montre *tag': (tag) => showImages(tag),
        'ouvre :page': (page) => navigateToPage(page)
    };

    // On ajoute nos commandes
    annyang.addCommands(commands);
    
    // Et on démarre l'écoute
    annyang.start();
}

Les différents types de commandes

annyang propose 3 façons super pratiques de définir vos commandes vocales :

• Variables nommées : Pour capturer un mot spécifique (ex: :page)
• Splats : Pour capturer plusieurs mots (*tag)
• Mots optionnels : Pour les commandes flexibles (entre parenthèses)

const commands = {
    // Commande avec splat
    'cherche *terme': (terme) => googleSearch(terme),
    
    // Commande avec variable nommée
    'va à :page': (page) => goToPage(page),
    
    // Commande avec mot optionnel
    'dis (moi) bonjour': () => sayHello()
};

Le support navigateur

Vous voulez l'utiliser ?

Et voilà ! Avec annyang, vous pouvez facilement ajouter de la reconnaissance vocale à vos projets. C'est pratique pour l'accessibilité, les commandes rapides, ou juste pour épater la galerie ! 😎