Building a Server-Side App in Zendesk

Building a Server-Side App in Zendesk

Table of Contents

  1. Introduction
  2. Setting up a server-side app in Zendesk
  3. Deleting unnecessary files
  4. Creating the HTML boilerplate
  5. Adding the ZAF SDK script
  6. Initializing the client
  7. Creating a script to append text
  8. Adding a button to trigger the script
  9. Creating the Zendesk app with zcli
  10. Updating the manifest.json
  11. Running the local server
  12. Uploading the app to Zendesk instance
  13. Conclusion

Setting up a Server-Side App in Zendesk

Zendesk is a powerful customer service platform that allows businesses to create their own customized apps. In this tutorial, we will guide you on how to set up a server-side app in your Zendesk instance. This tutorial is perfect for beginners who are new to app development and unsure of where to start. By following these steps, you will learn the basics of creating a server-side app and be up and running in no time.

Deleting Unnecessary Files

To begin, we will delete unnecessary files in our project. If you are using glitch.com, go to glitch.com and click on "New Project." Then, select "Find more" to create a basic app. Since this app will be the most basic version, we can delete the "script.js" and "style.css" files as this project does not require any styling.

Creating the HTML Boilerplate

Next, let's replace the contents of the "index.html" file with our own HTML boilerplate that is commonly used for Zendesk apps. You can use the existing content or start from scratch. The crucial part is importing the ZAF SDK with the <script> tag and ensuring that we initialize the client.

Creating a Script to Append Text

Now, we will create a script that appends a specific text to the comment field in the Zendesk ticket sidebar. This script will provide positive affirmations to agents when they are having a bad day. We will use the comment.appendText method in the ZAF SDK to achieve this. There are other methods available if you want to use markdown or HTML for the appended text.

Adding a Button to Trigger the Script

To make it more user-friendly, let's add a button that agents can click to trigger the script. The button can say something like "Click me for a positive affirmation." When the button is clicked, the script will run, and the generated text will appear in the comment field.

Creating the Zendesk App with zcli

To create the Zendesk app, we will use zcli, a command-line interface tool provided by Zendesk. If you are new to making Zendesk apps or zcli, don't worry. We will provide links in the description to help you get started. Open your favorite terminal window and create a directory called "Server Side App" (you can use your preferred name).

Updating the manifest.json

Open the "manifest.json" file in your code editor and locate the "url" field. Go to Glitch and grab the URL of your app. Click on "Share" and then click on the link next to the "Live Site" option. Replace the "asset/iframe.html" value in the "url" field with the obtained URL. Save the changes.

Running the Local Server

Before uploading the app to your Zendesk instance, we need to run the local server. Make sure you are logged in to zcli by using the appropriate command. If you haven't logged in or set up a profile, follow the instructions mentioned in the link provided earlier. Run the command zcli apps:server. If this is your first time developing with Zendesk, access the local server by appending zcli_apps=true to the end of your URL.

Uploading the App to Zendesk Instance

Now, let's upload the app to your Zendesk instance. Close the local server and execute the command zcli apps:create. This command will validate the app, package it up, and upload it to your logged-in Zendesk instance. After the upload is successful, go back to your instance and remove zcli_apps=true from the URL. You should now see your app alongside the REPL app.

Conclusion

Congratulations! You have successfully set up a server-side app in your Zendesk instance. These were the basic steps to get you started on app development. In future tutorials, we will explore more advanced topics such as secure settings. If you have any questions or need further assistance, please feel free to drop them in the comments below. Happy app development!

Highlights

  • Learn how to set up a server-side app in Zendesk
  • Delete unnecessary files in your project
  • Create the HTML boilerplate for your app
  • Utilize the ZAF SDK script for app functionality
  • Add a button to trigger a script action
  • Create the Zendesk app using zcli
  • Update the manifest.json file for app configuration
  • Run the local server for testing and development
  • Upload the app to your Zendesk instance
  • Get started on app development with Zendesk

FAQ

Q: Can I set up a server-side app in Zendesk if I have no prior coding experience? A: Yes, this tutorial is perfect for beginners. It provides a step-by-step guide to help you set up your first server-side app in Zendesk.

Q: Do I need to have a Zendesk account to follow this tutorial? A: Yes, you will need a Zendesk account to create and upload your app to your Zendesk instance. Sign up for a free trial if you don't have an account already.

Q: Can I customize the app further after following this tutorial? A: Yes, this tutorial covers the basics of app setup. You can customize the app by adding additional functionality, design elements, or integrating with external services.

Q: Is zcli the only way to create a Zendesk app? A: No, zcli is one of the tools provided by Zendesk for app development. You can also use the Zendesk Apps Framework (ZAF), which offers more flexibility and control.

Q: Can I test the app on my Zendesk instance before uploading it? A: Yes, by running the local server, you can test and debug your app locally to ensure it's functioning as expected before uploading it to your Zendesk instance.

I am a shopify merchant, I am opening several shopify stores. I use ppspy to find Shopify stores and track competitor stores. PPSPY really helped me a lot, I also subscribe to PPSPY's service, I hope more people can like PPSPY! — Ecomvy

Join PPSPY to find the shopify store & products

To make it happen in 3 seconds.

Sign Up
App rating
4.9
Shopify Store
2M+
Trusted Customers
1000+
No complicated
No difficulty
Free trial