Comment utiliser les plateformes de commerce sans tête pour les campagnes marketing ?

Publié: 2022-04-18

Que sont les plateformes de commerce sans tête ?

Plates-formes de commerce électronique sans tête ou plates-formes basées sur des API - logiciels dans lesquels le front-end (ou le «head») a été découplé ou complètement supprimé, ne laissant que le backend.

Le concept architectural qui sous-tend ces plateformes a commencé avec le monde des CMS. En séparant les couches, les entreprises voulaient lutter contre les obstacles sur leur chemin vers une diffusion de contenu plus rapide sur des canaux marketing de plus en plus récents - le smartphone jouant le premier rôle.

Avec le logiciel CMS traditionnel, les problèmes de bas niveau auxquels les développeurs ont été confrontés :

la conception est limitée par des cadres hérités, un ensemble prédéfini d'expériences disponibles uniquement ;
un petit changement frontal peut nécessiter des changements dans la base de données et le code principal, augmentant le temps de test, et donc le coût total de la tâche ;
les modifications apportées au code back-end peuvent provoquer des erreurs inattendues dans le front-end ;

se sont accumulés et se sont traduits au fil du temps en frein à main pour les entreprises :

peu ou pas de place pour la personnalisation ;
la confusion et l'incompréhension mutuelle sur les raisons pour lesquelles de petits changements logiciels prennent des années à se terminer ;
de nouveaux canaux marketing inexploités ou contournés par des logiciels peu prioritaires qui arrivent trop tard.

En conséquence, les "API-first", "API-based" ou "headless CMS" ont fleuri. Mais cela s'est rapidement étendu à d'autres domaines numériques, notamment le commerce électronique et le marketing.

Si c'est la première fois que vous rencontrez des plateformes headless, vous pourriez trouver mon dernier article intéressant : Understanding API-Based Platforms. De plus, Paul, dans son introduction au commerce électronique sans tête, montre quelques exemples concrets d'applications construites avec des outils basés sur des API.

Plates-formes sans tête - d'une idée à un POC prêt pour la production en 1 jour

Vérifions si nous pouvons vraiment créer un logiciel flexible aussi rapidement. Nous allons recréer une stratégie marketing utilisée par les grandes marques de nos jours. En un mot ça va :

Géolocalisez les clients.
Attribuez-leur un bon de réduction personnalisé.
Fournissez un code de coupon unique avec une notification push.

Il n'est pas difficile d'imaginer que des entreprises comme Uber doivent avoir investi une douzaine de mois-homme de développement ou même plus dans ce logiciel.

Ce qui pourrait ressembler à la tâche la plus simple - attribuer un code de réduction aléatoire - est chargé de mises en garde. J'ai appris cela à la dure parce que notre équipe y travaille depuis 3 ans maintenant. Le nombre de nouveaux cas de coin croissant et les frais généraux de gestion peuvent brûler même quelque chose qui ressemble à un système simple.

Heureusement, les plateformes sans tête sont là pour nous aider.

Nous utiliserons trois plates-formes SaaS conviviales pour les développeurs pour créer une solution fonctionnelle :

Radar - API de géolocalisation
Voucherify - API de gestion des promotions
Braze - API de notification

Voyons comment nous pouvons les fusionner pour impressionner vos clients avec des promotions vraiment personnalisées grâce à une approche sans tête.

Remarque : la solution suivante suppose que vous disposez d'un compte actif sur Radar, Voucherify et Braze. En outre, tous doivent être remplis avec votre base de données clients, y compris un champ qui peut être utilisé pour identifier de manière unique une personne.

Détecter le moment où un client entre chez vous avec Radar - géolocalisation sans tête

Le concept derrière Radar est simple. La plateforme géolocalise les applications en utilisant 3 types de contexte :

Geofence - Radar se targue d'être plus puissant que le geofencing natif iOS ou Android, avec une prise en charge multiplateforme pour des geofences illimitées, des geofences polygonales et la détection d'arrêt. En effet, tout le géorepérage et la génération d'événements se produisent côté serveur.
Lieux - Radar peut reconnaître une longue liste de lieux car il utilise la base de données Facebook. Et le plus cool, c'est que vous pouvez travailler avec des catégories intégrées (par exemple, les grands aéroports) ou des chaînes (par exemple, Starbucks).
Insights - Leur moteur de localisation peut également apprendre comment se rapprocher d'un utilisateur entrant/sortant de la maison et du bureau.

Lorsque Radar détecte que votre utilisateur visite ou quitte le lieu, il vous permet de notifier votre application avec un webhook.

Tout ce que vous avez à faire, en tant que développeur, est d'utiliser l'un des kits de développement logiciel (iOS, Android, Web) pour authentifier, configurer et affiner les options de suivi - par exemple, si vous souhaitez suivre en arrière-plan ou au premier plan.

Voyons alors la plate-forme sans tête Radar en action !

1. Configurez votre compte

Accédez à radar.io et créez un compte, puis utilisez les clés d'API de test pour initialiser le widget Radar comme indiqué ci-dessous :

Radar.initialize("VOTRE_CLE");

</script>{{ENDCODE}}

2. Suivre les utilisateurs

La dernière étape consiste à vérifier si le suivi fonctionne. Pour ce faire, nous utiliserons la méthode trackOnce qui est invoquée si Radar détecte des changements d'emplacement.

Exécutons le code et voyons quelles informations Radar fournit (n'oubliez pas d'autoriser le suivi de la localisation dans votre navigateur) :

{{CODE}}

Radar.trackOnce(function(status, location, user, events) { console.log({ status, location, user, events });});

Production:

événements : [] (0)

emplacement : Coordonnées {latitude : 50,25462479999998, longitude : 19,061743829999994, altitude : nulle, précision : 165, altitudeAccuracy : nulle, …}

statut : "SUCCES"

utilisateur : {userAgent : "Mozilla/5.0 (Macintosh ; Intel Mac OS X 10_14_4) Ap… (KHTML, comme Gecko) Version/12.1 Safari/605.1.15", ip : "93.179.216.18", locationAccuracy : 165, deviceType : "Web", arrêté : vrai, …}

OK - Radar a trouvé notre cachette. Mais sans le contexte, il ne sait pas quoi faire de cette information. Travaillons sur les informations de Radar.

Nous allons donner un nom à l'endroit d'où vous vous êtes enregistré - en général (dans Radar aussi), ce contexte d'emplacement s'appelle un geofence. Voici comment procéder :

Accédez au créateur de géorepérage.
Sélectionnez un type de source respectif, j'irai pour Place et tapez mon entreprise en tant que requête.
En conséquence, Radar recherche les coordonnées géographiques et suggère une frontière de clôture géographique.

Si l'emplacement vous convient, confirmez la clôture géographique avec CRÉER.

Maintenant, actualisons la page et regardons la console. Le radar nous envoie maintenant quelques événements :

{

"createdAt":"2019-04-16T16:08:49.645Z",

"vivre": faux,

"type":"user.entered_geofence",

"emplacement":{

"coordonnées":[

19.062212,

50.254927099999996

"type":"Point"

"précision de l'emplacement":20,

"confiance":3,

"actualCreatedAt":"2019-04-16T16:08:49.645Z",

"utilisateur":{

"_id":"5cb5f2ba36581b002a3534ca",

"userAgent":"Mozilla/5.0 (Macintosh ; Intel Mac OS X 10_14_4) AppleWebKit/537.36 (KHTML, comme Gecko) Chrome/73.0.3683.103 Safari/537.36",

"deviceId":"a96ec0db-969c-4a77-996c-361a0530660a"

"clôture géographique":{

"_id":"5cb5f7d3a60e95002b009ebd",

"description":"rspective",

"type":"cercle",

"geometryRadius":100,

"geometryCenter":{

"type":"Point",

"coordonnées":[

19.062346299999945,

50.25495069999999

]

}

"_id":"5cb5fe117cd3430025b9ee0d"

}

Il semble qu'il comprenne que nous sommes entrés dans notre clôture géographique nouvellement créée. Comme nous sommes assis au même endroit, les actualisations ultérieures ne devraient pas apporter de nouveaux événements. Mais lorsque nous changeons d'emplacement, Radar le détecte également.

Pour le tester, prenez votre machine, sortez de la zone de clôture géographique et reconnectez-vous là-bas Ou... vous pouvez utiliser les capteurs des outils Chrome.

Modifiez votre position en sélectionnant une position suffisamment éloignée et actualisez à nouveau la page. Maintenant, Radar montre que user.exited_geofence

Vous pouvez suivre les événements de géolocalisation pour tous les utilisateurs enregistrés et non enregistrés avec le tableau de bord pratique du Radar, en temps réel :

Notification des applications externes via la messagerie sans tête

Ainsi, le suivi de Radar comprend maintenant notre contexte de localisation. Mais pour l'utiliser pour notre scénario, Radar doit le partager avec le monde extérieur. Et il le fait de plusieurs façons. L'un d'eux consiste à utiliser des webhooks.

Un webhook est un concept d'API qui permet à une application de fournir à d'autres applications des informations en temps réel.

Selon Segment, une plate-forme qui permet de collecter et d'échanger des données clients sur de nombreux systèmes, la popularité des webhooks augmente rapidement.

Une implémentation typique de webhook permet à l'utilisateur d'une application de :

notifier un système externe (ou plusieurs systèmes)
avec un ou plusieurs appels d'API
moment où un événement particulier s'est produit.

Avec un tel mécanisme en place, un utilisateur de l'application n'a pas besoin d'interroger fréquemment les données pour détecter les modifications en temps réel.

L'envoi d'une requête à une API externe n'est qu'un aspect du processus. Pour terminer le cycle du webhook, le client destinataire doit le consommer avec succès.

Dans le monde HTTP, cela signifie généralement répondre avec le statut 2**. Si ce n'est pas le cas, le moteur de webhook réessayera plus tard (une stratégie de nouvelle tentative dépend des auteurs de stratégie définis).

Dans notre cas, Radar envoie la charge utile de l'événement que nous avons vue lorsque nous avons changé notre emplacement vers un point de terminaison fourni. Ajoutons-en un pour voir les webhooks en action.

Accédez à Intégrations.
Sélectionnez l'environnement de test et la livraison d'un événement unique .
Indiquez un point de terminaison à notifier. Vous avez quelques options ici. Tu peux:

créer un simple serveur Web sur votre machine et utiliser ngrok pour canaliser le trafic,
utilisez glitch pour déployer votre endpoint immédiatement,
puisez dans l'un des capteurs de webhook en ligne comme: webhook.site ou requestbin

Collez votre URL unique dans le formulaire et confirmez.

Cliquez sur Test dans la colonne ACTIONS pour déclencher votre premier événement. Si vous le configurez correctement, vous devriez voir la charge utile du webhook comme indiqué dans l'image ci-dessous :

Jusqu'ici tout va bien. Le résultat est plutôt prometteur, n'est-ce pas ? Avec quelques copier-coller et un extrait de JavaScript, nous avons couvert la partie géolocalisation de notre cas d'utilisation. Au stade actuel, Radar ne peut pas identifier les utilisateurs autrement qu'avec un identifiant d'appareil stocké dans des cookies. Pour le rendre plus robuste, identifions l'utilisateur avec un email. Avec le SDK de Radar, c'est une ligne :

Radar.setUserId("[email protected]");

Vous pouvez immédiatement voir le nouvel ID dans le tableau de bord :

Nous devons donc maintenant nous attaquer à une exigence de remise personnelle - un code de coupon unique.

Connecter Radar et Voucherify moteur de promotion sans tête

Comme Radar, Voucherify avec son API vous offre une fonction de couponing flexible pour une fraction du coût que vous encourriez si vous partiez de zéro.

Comme nous le verrons bientôt, il prend en charge d'autres campagnes promotionnelles telles que des remises, des recommandations ou des programmes de fidélité qui peuvent être diffusés avec n'importe quel canal marketing actuel ou futur.

Pour exploiter les fonctionnalités de personnalisation de Voucherify, vous devez d'abord importer les données des utilisateurs et les synchroniser.

Voucherify stocke les données des clients dans des objets client qui peuvent être regroupés en segments en fonction des attributs personnels, de l'emplacement et de l'historique des interactions de Voucherify.

Supposons que vous avez déjà importé votre client test dans Voucherify et nous allons maintenant voir comment synchroniser son emplacement avec Radar - sans le code.

Zapier – la colle du web

Imaginez si toutes les plates-formes qui exposent des webhooks étaient répertoriées dans un seul répertoire, avec une structure unifiée et la possibilité de les connecter comme des blocs - voici Zapier.

Zapier connecte plus de 1000 applications Web et leur permet de travailler ensemble en arrière-plan.

Chaque Zap commence par un déclencheur d'événement dans l'une de vos applications qui lance votre flux de travail. Voici quelques exemples tirés de la documentation de Zapier :

Automatisez votre présence sur les réseaux sociaux en envoyant de nouveaux éléments RSS à Facebook sous forme de messages ;
Organisez vos projets en copiant les nouvelles cartes Trello dans Evernote ;
Restez en contact avec les prospects en ajoutant des répondants au formulaire de Typeform à votre liste de diffusion dans MailChimp ;
Assurez-vous que votre équipe ne manque jamais une réunion en informant un canal dans Slack des événements à venir de Google Calendar ;
…et beaucoup plus!

Vous allez probablement demander maintenant : "Est-ce que Zapier peut nous aider ?". Oui il peut! Jouons avec quelques Zaps pour mettre à jour les modifications de géolocalisation vers Voucherify.

Cliquez sur Faire un Zap et sélectionnez Webhooks.
Avec cette option, Zapier peut créer un point de terminaison (similaire à webhook.site) que nous pouvons utiliser pour consommer le webhook de Radar. Pour ce faire, choisissez Catch Hook.
La vue suivante vous donnera une URL de point de terminaison qui remplacera l'ancienne dans la configuration du webhook Radar.

Collez le lien vers Radar et relancez le test. Si Radar confirme le nouveau point de terminaison avec une barre clignotante verte, passez à l'étape suivante dans Zapier.
Sur l'écran suivant, vous devriez remarquer la charge utile de votre demande de test

Confirmez le formulaire et la première étape du Zap - déclencheur - est prête.

Maintenant, nous devons mettre les messages consommés au travail. Pour terminer le Zap, nous avons besoin d'au moins une action (vous pouvez enchaîner plusieurs plateformes avec un seul Zap).

Choisissez Voucherify dans l'explorateur d'actions. Remarque Voucherify Zap est disponible "sur invitation", voici le lien pour l'obtenir.

Sélectionnez l'option Mettre à jour le client et passez au formulaire Configurer le modèle .
C'est un élément clé. Sur ce formulaire, Zapier vous permet de mapper l'entrée à la sortie. L'éditeur est à la fois puissant et intuitif. Il dispose d'un champ de recherche intelligent qui vous permet de parcourir le JSON entrant à la fois par clés et par valeurs. Vous pouvez également concaténer facilement deux ou plusieurs champs d'entrée en un seul sortant.

Dans notre cas, nous voulons simplement identifier le client par le source_id et mettre à jour un champ personnalisé « rspectiveHQ » en fonction de l'événement, de sorte que le mappage se présente comme suit :

Voucherify : ID de la source - Radar : ID de l'utilisateur
Voucherify : Métadonnées -> rspectiveHQ - Radar : Type d'événement

Ignorez le test et remplissez le formulaire - le ZAP est activé et attend !

Nous avons configuré le webhook de Radar et activé Voucherify Zap. Testons si l'ensemble du pipeline fonctionne. Accédez à notre application Web et essayez à nouveau de modifier l'emplacement pour avertir le détecteur de Radar.

Voici ce qui devrait suivre :

Le radar suit 2 événements, l'utilisateur sort et entre dans la clôture géographique.
Zapier attrape 2 webhooks en conséquence.
Bonifier les pistes pour les mises à jour du profil client.

Zapier est plus que cela. Lorsque vous regardez les options de configuration du workflow, vous remarquerez des rouages qui permettent de construire des processus assez complexes. Les étapes d'assistance telles que les conditions, les filtres ou les retards seront utiles pour analyser et digérer les données d'entrée et formater la sortie en conséquence.

Vous pouvez même écrire du code personnalisé (en JavaScript et Python) si vous avez besoin de plus de flexibilité à l'une des étapes - vous ai-je déjà dit que vous pouvez enchaîner une série de paires déclencheur-action ?

Donnez à la documentation de démarrage rapide de Zapier une chance de comprendre de quel type de gain de temps il s'agit.

Génération d'un coupon unique pour les utilisateurs géolocalisés via un moteur de promotion sans tête

L'une des fonctionnalités essentielles de Voucherify est la personnalisation des remises en fonction du profil du client, en temps réel. Cela est possible grâce aux segments dynamiques qui surveillent les attributs des clients et ce qu'ils ont mis dans un panier, et déclenchent des actions selon certaines règles commerciales.

Dans notre cas, nous allons créer un segment qui vérifie notre champ personnalisé (rspectiveHQ) qui, à son tour, stocke les informations si un client est entré dans le geofence. Nous pouvons y parvenir par un seul point de terminaison à partir de l'API Voucherify, mais le moyen le plus rapide consiste simplement à utiliser le tableau de bord.

Accédez à Clients et ouvrez le créateur de segment. Filtrez maintenant le client à l'aide d'un champ de métadonnées correspondant, comme dans l'image ci-dessous :

Confirmez le filtre, appuyez sur le rechargement et vous verrez tous les clients correspondant au segment. Vous pouvez "demander" à votre utilisateur test de quitter la clôture géographique et de recharger le segment pour voir si l'intégration fonctionne comme prévu.

Si ce que vous voyez reflète la réalité, enregistrez le segment.

L'étape suivante consiste à utiliser les informations sur l'emplacement pour adapter la remise.

Mais avant de plonger dedans, je veux que vous vous arrêtiez un instant et que vous analysiez tout ce que nous avons accompli jusqu'à présent sans écrire un seul code back-end . En même temps, nous n'avons pas fermé notre solution pour changement car Radar et Voucherify exposent une API riche et une architecture sans tête que vous pouvez brancher quand vous en avez besoin.

La dernière étape consiste à mettre en place une distribution qui :

envoyer un code promo unique
à un client détecté
avec le canal prédéfini

Pour commencer, générons un code promotionnel unique pour chaque utilisateur. Que ce soit une réduction de 10 %. Accédez au créateur de la campagne, choisissez l'option Codes groupés et suivez les étapes où vous définirez :

type et montant de la remise,
Plage de temps,
modèle de codes comprenant la longueur, le préfixe, le suffixe et le jeu de caractères,
nombre initial de codes,
et autres détails.

La 4ème étape du créateur - les règles de validation - est particulièrement intéressante. C'est un endroit où vous pouvez définir qui et sous quelles conditions peut utiliser le code. N'oubliez pas que nous voulons limiter l'échange uniquement aux clients qui ont visité notre clôture géographique. Nous utiliserons notre segment pour terminer cette étape.

Cet outil vous offre beaucoup plus d'options de filtrage. Si vous travaillez sur des campagnes d'acquisition ou de fidélisation de clients, vous voudrez peut-être consulter la référence des règles de validation, car elle peut vous faire économiser une tonne de lignes de code.

Lorsque Voucherify termine la génération en bloc, vous devriez les voir répertoriés :

Nous avons le segment et les codes promotionnels, connectons-les maintenant à notre canal marketing sortant !

Vous pouvez l'implémenter avec l'API Voucherify et les webhooks, mais il existe un moyen plus rapide - rencontrer les distributions.

Cette fonctionnalité vous permet de détecter un nouveau client entré (ou quitté) un segment, de lui attribuer un code de coupon unique et de l'envoyer par e-mail, SMS, notification push, chat en direct ou publicités sur les réseaux sociaux. De plus, un éditeur visuel vous aide à créer une copie de promotion personnalisée.

Chaque canal a son propre modèle spécifique de message, voyons à quoi il ressemble pour les notifications push. Mais pour continuer, nous devons créer un compte Braze et le connecter à Voucherify avec la clé API.

Envoi d'un code promo via notification push avec Braze

Braze (anciennement AppBoy) est l'un des leaders des outils de marketing mobile. Nous n'utiliserons qu'une fraction de leurs capacités, je vous recommande donc de consulter leur documentation pour en savoir plus sur leur offre.

La configuration de notre scénario nécessite 3 étapes :

Création d'une campagne de notification push ;
Envoi de codes promo de Voucherify à Braze ;
Configuration d'une notification push Web dans notre application.

Campagne de notifications push

De la même manière que Voucherify, Braze peut déclencher certaines actions basées sur des modifications en temps réel des attributs du client. Dans ce cas particulier, la distribution que nous avons créée dans Voucherify définira un champ personnalisé rempli d'un code unique de la campagne de code en masse.

Nous définirons la campagne Braze de manière à ce qu'elle détecte ce changement et déclenche une notification push vers une instance d'application à laquelle un client est connecté.

Ouvrez Gérer le groupe d'applications pour définir un contexte d'application.
Sélectionnez une application Web pour obtenir une clé publique d'API.

Vous pouvez maintenant accéder à Campagnes et créer une nouvelle campagne de notification push.
Composez un message qui inclut le code de coupon {{custom_attribute.${coupon}}}, sélectionnez l'onglet Test et utilisez Send Test to Myself. Si vous autorisez la notification Web, vous devriez remarquer un message glissant en haut à droite.

Le code de coupon sur le message de test sera vide car nous n'avons ajouté cet attribut personnalisé à aucun des utilisateurs. Enregistrons le brouillon de la campagne et créons manuellement un utilisateur test avec le code.

Créez un fichier CSV simple comme suit :

external_id, coupon

[email protected], xyz

Et allez dans User Import pour le télécharger.

Maintenant que nous avons les données de test et l'option «Remplacer les attributs des destinataires…» cochées, nous pouvons voir la variable substituée.
Dans l'onglet Livraison, modifiez le type de livraison en Basé sur l'action et sélectionnez Changer le déclencheur de valeur d'attribut personnalisé comme dans l'image ci-dessous :

Inscrivez "Tous les utilisateurs" dans la campagne à l'étape suivante et laissez les autres paramètres inchangés. Lorsque vous êtes prêt, cliquez sur Lancer la campagne en bas à droite.

Fournir à Braze des codes de réduction

C'est le moment où nous devrions brancher Voucherify à Braze. Heureusement, Voucherify prend en charge Braze avec une intégration native. La seule chose qui reste pour connecter ces deux plates-formes marketing est d'aller dans Intégrations, de sélectionner Braze et de fournir le point de terminaison et la clé de l'API.

Vous pouvez maintenant rouvrir le brouillon de notre distribution et terminer la dernière étape. Indiquez les noms des champs personnalisés sous lesquels Voucherify attribue un code unique et sa valeur :

Et mettez-le en direct. Désormais, chaque fois que Radar détecte un événement de clôture géographique et met donc à jour le segment de clientèle, Voucherify attribuera à ce client un code de coupon et le publiera dans le profil de l'utilisateur dans Braze.

La campagne Braze détectera le nouveau changement de champ et tentera d'envoyer une notification Web.

Recevoir une notification push

Nous y sommes presque! La toute dernière étape pour finaliser notre chaîne de promotion consiste à laisser la notification push s'écouler dans notre application.

Comme d'habitude dans le cas des plates-formes sans tête, il n'est pas nécessaire de l'implémenter manuellement. Braze, en tant que véritable plate-forme de développement, propose un SDK open source pour le Web.

Pour le rendre opérationnel, vous devez coller un court extrait et le remplir avec la clé API publique.

const test_user = {

prénom : "Mike",

nom_de_famille : "Sedzielewski",

email : "[email protected]"

}

+fonction(a,p,P,b,y){appboy={};appboyQueue=[];for(var

s="initialize destroy getDeviceId toggleAppboyLogging setLogger

openSession changeUser requestImmediateDataFlush requestFeedRefresh

subscribeToFeedUpdates requestContentCardsRefresh

subscribeToContentCardsUpdates logCardImpressions logCardClick

logCardDismissal logFeedDisplayed logContentCardsDisplayed

logInAppMessageImpression logInAppMessageClick

logInAppMessageButtonClick logInAppMessageHtmlClick

subscribeToNewInAppMessages removeSubscription

removeAllSubscriptions logCustomEvent logPurchase isPushSupported

isPushBlocked isPushGranted isPushPermissionGranted

enregistrerAppboyPushMessages désenregistrerAppboyPushMessages

submitFeedback trackLocation stopWebTracking resumeWebTracking

wipeData ab ab.DeviceProperties ab.User ab.User.Genders

ab.User.NotificationSubscriptionTypes ab.User.prototype.getUserId

ab.User.prototype.setFirstName ab.User.prototype.setLastName

ab.User.prototype.setEmail ab.User.prototype.setGender

ab.User.prototype.setDateOfBirth ab.User.prototype.setCountry

ab.User.prototype.setHomeCity ab.User.prototype.setLanguage

ab.User.prototype.setEmailNotificationSubscriptionType

ab.User.prototype.setPushNotificationSubscriptionType

ab.User.prototype.setPhoneNumber ab.User.prototype.setAvatarImageUrl

ab.User.prototype.setLastKnownLocation

ab.User.prototype.setUserAttribute

ab.User.prototype.setCustomUserAttribute

ab.User.prototype.addToCustomAttributeArray

ab.User.prototype.removeFromCustomAttributeArray

ab.User.prototype.incrementCustomUserAttribute

ab.User.prototype.addAlias

ab.User.prototype.setCustomLocationAttribute

ab.InAppMessage ab.InAppMessage.SlideFrom ab.InAppMessage.ClickAction

ab.InAppMessage.DismissType ab.InAppMessage.OpenTarget

ab.InAppMessage.ImageStyle ab.InAppMessage.TextAlignment

ab.InAppMessage.Orientation ab.InAppMessage.CropType

ab.InAppMessage.prototype.subscribeToClickedEvent

ab.InAppMessage.prototype.subscribeToDismissedEvent

ab.InAppMessage.prototype.removeSubscription

ab.InAppMessage.prototype.removeAllSubscriptions

ab.InAppMessage.Button

ab.InAppMessage.Button.prototype.subscribeToClickedEvent

ab.InAppMessage.Button.prototype.removeSubscription

ab.InAppMessage.Button.prototype.removeAllSubscriptions

ab.SlideUpMessage ab.ModalMessage ab.FullScreenMessage

ab.HtmlMessage ab.ControlMessage ab.Feed

ab.Feed.prototype.getUnreadCardCount ab.ContentCards

ab.ContentCards.prototype.getUnviewedCardCount ab.Card

ab.ClassicCard ab.CaptionedImage ab.Banner ab.ControlCard

ab.WindowUtils display display.automaticallyShowNewInAppMessages

display.showInAppMessage display.showFeed display.destroyFeed

display.toggleFeed display.showContentCards display.hideContentCards

display.toggleContentCards sharedLib".split("

"),i=0;i<s.length;i++){for(var

m=s[i],k=appboy,l=m.split("."),j=0;j<l.length-1;j++)k=k[l[j]];k[l[ j]

]=(new Function("fonction de retour

"+m.replace(/\./g,"_")+"(){appboyQueue.push(arguments); retourner

vrai}"))()}appboy.getUser=fonction(){retourner nouveau

appboy.ab.User};appboy.getCachedFeed=fonction(){retourner nouveau

appboy.ab.Feed};appboy.getCachedContentCards=fonction(){retourner nouveau

appboy.ab.ContentCards};(y=p.createElement(P)).type='text/javascript

';y.src='https://js.appboycdn.com/web-sdk/2.3/appboy.min.js';y.async

=1 ;(b=p.getElementsByTagName(P)[0]).parentNode.insertBefore(y,b)}(wi

ndow,document,'script');

appboy.initialize('YOUR_KEY', {baseUrl :

"https://sdk.iad-03.braze.com/api/v3"});

appboy.toggleAppboyLogging();

appboy.registerAppboyPushMessages()

appboy.changeUser("[email protected]");

appboy.display.automaticallyShowNewInAppMessages();

appboy.openSession();

</script>

Et enregistrez un service-worker.js :

self.importScripts('https://js.appboycdn.com/web-sdk/2.3/service-worker.js');

Lorsqu'il est en place, exécutez un autre test avec l'utilisateur "text@example" dans l'entrée "Ajouter des utilisateurs individuels". Votre application devrait recevoir une notification avec le code promotionnel "xyz".

Maintenant, testons si la campagne déclenche un message push lorsque vous modifiez le champ du coupon .

Tout d'abord, assurez-vous que votre campagne est active et que l'application Web est lancée. Deuxièmement, téléchargez la collection Braze Postman, ouvrez le catalogue de données utilisateur et sélectionnez User Track - Attributes Example. (Si vous ne connaissez pas Postman, vous pouvez vous rattraper ici)

Remplacez l'URL du point de terminaison par celle qui vous est attribuée, dans mon cas, c'est : https://rest.iad-03.braze.com/

Et la charge utile de la requête à :

{{CODE}}{

"api_key":"VOTRE_CLE",

"les attributs":[

{

"id_externe":"[email protected]",

"coupon":"123"

}

]

} {{ENDCODE}}

Envoyez la demande et attendez un autre message avec le code de coupon mis à jour.

Tester tous les blocs de construction sans tête

Pour vous assurer que le flux de travail fait ce que nous avons demandé, ouvrez simplement votre application et utilisez le capteur pour "localiser" à un endroit différent, puis revenez à la clôture géographique. Dans quelques secondes, vous devriez voir la notification personnalisée sur votre écran !

Désormais, l'utilisateur peut prendre son code et le mettre dans la boîte de coupons validée par Voucherify sur le backend.

Résumons ici les gains des plates-formes sans tête :

En une heure environ, nous avons livré une solution de travail pour un scénario commercial assez complexe.
La base de code est super courte et simple - ce qui se traduit par moins de frais de maintenance.
Bien que nous n'ayons pas un contrôle à 100% sur la solution, elle est toujours ouverte à la personnalisation grâce à l'accès API.
L'absence de pleine propriété est compensée par le soutien des équipes des fournisseurs et une meilleure qualité des outils.
Avec des webhooks et des outils comme Zapier, vous connectez et entremêlez divers départements et systèmes en un rien de temps.

Une chose à laquelle vous devez faire attention lorsque vous utilisez plusieurs fournisseurs SaaS est le repli. Parfois, une plate-forme est en panne et vous devez indiquer à votre système comment réagir - par exemple, comment stocker et mettre en file d'attente les actions. Les plates-formes conviviales pour les développeurs exposent cependant des interfaces que vous pouvez utiliser pour surveiller la disponibilité de leur API et réagir à temps.

D'un autre côté, les solutions de secours super robustes ne sont finalement pas nécessaires pour les applications au stade POC.

Comment l'approche sans tête peut-elle m'aider ?

En un mot, en apprenant comment tirer parti des plateformes sans tête pour créer quelque chose de valeur rapidement et à moindre coût, vous gagnerez en valeur sur le marché du travail.

Ce ne sont pas les langages de programmation ou les frameworks qui représentent l'avantage concurrentiel aujourd'hui. C'est souvent très différent - c'est ainsi que les entreprises peuvent utiliser les outils disponibles pour résoudre leurs problèmes avec le moins de code possible. En d'autres termes, ce sont les choses qui comptent plus que la maîtrise d'un stack ou de stacks technologiques donnés :

Savoir réduire le time to market ;
Aperçu des techniques de réduction des coûts de maintenance ;
Capacité à réduire les dépendances vis-à-vis des technologies individuelles ;
Aperçu des technologies actuelles prenant en charge les trois ci-dessus.

Où chercher plus de plateformes de commerce sans tête ?

Un bon point de départ peut être cette liste :

Promotions

Bonifier
Cadeau
Vauchar

Catalogue & inventaire

Recombée
Canalape
Cristalliser

Chariot

Snipcart
Rusé

Paiement

Bande
Exigible
Carré

Messagerie

Couche
Pousseur
Pubnum

Réservation & événements

Timekit
Entrée

Expédition

Shippo
Navirenuage
Lob

Général

Élastique
Snipcart
Moltin
OrderCloud
Outils de commerce

Mais si vous voulez aller au-delà du commerce électronique sans tête, je vous suggère de visiter https://www.programmableweb.com et de creuser. Une autre façon de commencer votre recherche est de parcourir les intégrations Zapier.

Une autre consiste à accéder au réseau API Postman.

Ressources:

Code source de démonstration sur le pépin