Build a service desk database, server, and web app

Summary

In this developer code pattern, we walk you through the creation of a web application that tracks support tickets. The app allows users to create, assign, manage, and close support tickets. The app UI is built with Vue.js, and the data is stored in EDB.

Description

We used Node.js and Express to build our server. This allowed us to use JavaScript for both our server and our client. Node.js+Express makes it easy to create a server with REST endpoints. To communicate with our database, we decided to use Sequelize object-relational mapping (ORM). The Sequelize Node.js module and command-line utilities helped us create our database schema and define the referential integrity between our tables. In our JavaScript, we use the models that were created instead of writing SQL. Sequelize also made it easy for us to automatically update our database during development, and it can be used for database migration in the future.

For the database, we are using EDB. EDB is an enterprise-class database based on the very popular PostgreSQL open source relational database. We are provisioning a database-as-a-service using IBM Cloud. With a few mouse clicks, we get a fully managed installation of EDB in the cloud that we can access from anywhere. We use the common psql command-line tool to run our data loading scripts to seed the database, but many query tools are available that can also be used.

To create a UI that will work just as well on a phone as it does on a big screen, we chose Vue and Vuetify. Our UI includes sidebar navigation, multiple pages, and many reusable components. Using Vue plus Vuetify gave us a powerful framework to create a professional-looking web UI that was easy to write and much more maintainable than plain HTML, JavaScript, and CSS.

When you have completed this code pattern, you will understand how to:

  • Provision a “Databases for EDB” instance on IBM Cloud.
  • Use Sequelize to programmatically map objects to your relational database.
  • Create a modern web app built on Node.js, with an Express server for REST APIs, and a Vue-based UI.
  • Use psql scripts to seed the database tables with tickets, users, and support staff.

Flow

flow

  1. Administrator uses psql to seed EDB tables with user, assignee, and ticket data.
  2. User interacts with the Node.js app to create and maintain ticket information. The Vue-based client UI accesses EDB data via the Express server REST APIs.
  3. The server uses Sequelize to perform CRUD operations on the EDB instance.

Instructions

Ready to get started? Find the detailed steps for this pattern in the README. The steps will show you how to:

  1. Clone the repo
  2. Provision the Databases for EDB service
  3. Add service credentials to environment file
  4. Load sample data
  5. Run the application
  6. Use the app
  7. Review the application structure

To learn more, visit the IBM and EDB product page and check out the IBM Hybrid Data Management Community.