On this put up, we’re going to learn to implement buyer help capabilities utilizing a minimal code method and counting on third celebration providers. There are a whole lot of conditions through which you may must implement some buyer help capabilities. Perhaps you’re creating your individual product, or perhaps you’re working for an organization that should enhance their operations.

With the arrival of COVID-19, e-commerce has develop into a significant concern for many companies. Having an excellent buyer help technique in place is a should today. On-line shoppers demand options like on-line dwell chat or multi-channel communication and count on excessive responsiveness from on-line companies.

The pandemic has generated unprecedented ranges of uncertainty for enterprise they usually want to have the ability to adapt within the shortest time potential. For that reason, we’re going to actually on third celebration providers and use a minimal code method. This enables us to dramatically cut back the time to market and improvement value. Operational value can also be extremely versatile as a result of each Zendesk and Azure can adapt their choices and costs to our enterprise scale and wishes.

The very first thing we’re going to do is to go to https://www.zendesk.com/ and create an account. I can’t doc how to do that as a result of Zendesk may be very intuitive and it has superb documentation.

After creating the account, you may go to the settings web page and go to the channels part to seek out out your help electronic mail:

The format of this electronic mail handle must be help@yourcompany.zendesk.com. You’ll need to recollect this handle as a result of we’re going to want it later.

We are able to then go to the widget part underneath the channels part to allow the contact kind and the net chat options:

For those who go to the settings it is possible for you to to seek out the set up information:

All you must do is so as to add a script tag to your web site’s supply code:

<script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"></script>

We’ve got enabled the contact kind widget which is displayed when there aren’t any buyer help brokers on-line:

We’ve got additionally enabled the dwell chat widget which is displayed when buyer help brokers are on-line:

A bit icon might be then displayed on the underside proper of your webpage. When a person clicks on the icon, the contact kind or the dwell chat kind might be displayed.

Ideally, we need to have a single level to handle all our buyer request. The request could have originated in our web site, our electronic mail or social media:

• Net: We are actually able to handle requests that originated on our web site.

• Electronic mail: Managing electronic mail requests could be achieved by enabling electronic mail forwarding from certainly one of your organization electronic mail addresses to your Zendesk electronic mail handle.

• Social media: You possibly can go to the channel settings in Zendesk to attach your social media accounts with Zendesk.

• Cellphone calls. Zendesk additionally permits you to handle cellphone calls as buyer requests tickets. You possibly can study extra utilizing the Zendesk documentation.

Normally, the default Zendesk implementation can be sufficient to get began. Nonetheless, in my case, I wanted an extra customized contact kind:

I wanted this kind to be extremely seen and the underside proper “assist” button didn’t have sufficient visibility for me. The webform was carried out utilizing React and Formik.

I wished to ship the request that originated utilizing this kind to Zendesk. The best resolution can be to ship an electronic mail to the Zendesk help electronic mail handle. We have to implement an HTTP POST endpoint that takes the shape particulars as JSON and ship an electronic mail to the Zendesk help electronic mail handle. I wished to implement this with as little code as potential and the very first thing that got here so my thoughts was to make use of an Azure perform.

Utilizing an Azure perform would require us to outline an HTTP set off and the code that sends the e-mail. We would want to handle the permissions so our electronic mail server permits us to ship an electronic mail. This wasn’t a large job but it surely required me to save lots of the code in a repository, deploy it, and so on. It was an excessive amount of work for one thing so easy. I wished to discover a higher approach and that’s how I ended up utilizing Azure Logic Apps.

We are able to go to the Azure portal and create a brand new Azure Logic App, then use the designer to create the logic guidelines of our app. The very first thing that we have to do is to outline an HTTP set off for our HTTP POST request:

You possibly can paste an instance of the physique of your request and the Logic App designer will routinely translate it into the request schema.

If you save your logic, Azure will generate an URL you could invoke out of your app.

The second factor that we have to do is so as to add a step:

We have to add a step that may return an HTTP response:

We then want so as to add a parallel step to ship an electronic mail. In my case I take advantage of Gmail however there are different integrations out there.

We have to extract the info from the unique HTTP request so as to add it to the e-mail contents. We are able to do that utilizing an expression:

We are able to use triggerBody() to entry the request physique and json(triggerBody()) to remodel it into JSON. We are able to then entry the properties within the request physique as follows json(triggerBody()).firm.

We are able to then save the whole lot and two sources ought to have been created:

We are able to then invoke the HTTP set off in our logic app by sending an HTTP request from the net app:

const response = await fetch(`INSERT_THE_TRIGGER_URL_HERE`, {
    methodology: "POST",
    physique: JSON.stringify(values),
});
const json = response.json();

You possibly can then use the browser developer instruments to see if the request was profitable:

And at last, head to the Azure Logic App monitoring part to see if all of the steps labored as anticipated. The monitoring instruments with offering you with some particulars if one thing fails:

If the whole lot labored it’s best to now have a brand new ticket in your Zendesk buyer help dashboard:

The operational value of operating this logic app is nearly zero and we are able to get began with Zendesk for simply $60 a 12 months. We are able to now ship an expert buyer help expertise on a finances and in just some hours!

As we are able to see Azure Logic apps may also help us to unravel real-business wants with virtually no code. This enables us to maneuver quicker and adapt quicker in a time of unprecedented uncertainty.