Chetan Mittal
Chetan Mittal Dev - Blog

Chetan Mittal Dev - Blog

Come on Zammad - your primary tech stack should include Coffeescript not VueJS

Zammad is one of the largest open source coffeescript project

Chetan Mittal's photo
Chetan Mittal
·Sep 29, 2022·

4 min read

Come on Zammad - your primary tech stack should include Coffeescript not VueJS

Table of contents

  • Background
  • Realization
  • Proof
  • Closing
  • Why not design an image with real tech stack?

Background

If you have been reading my articles lately then you must be knowing already "how i found Zammad?".

When I was searching for 10 best open source projects build on Rails and VueJS, to commit to, on both Google and Github then I came across a customer support open source project having moniker 'Zammad'. I glanced through the project's main website at Zammad.com and also checked the software languages (frameworks) it uses on Github.

I just fell in love with Zammad's website. And, also found listed VueJS in 'Languages' sidebar on its Github repository page.

Screenshot from 2022-09-29 07-59-18.png

So, I shortlisted Zammad considering it as an open source software using VueJS as its frontend tech stack. The mention of VueJS in its Tech Stack on its open job listing pages also confirmed this.

Screenshot from 2022-09-29 08-05-08.png

Another confirmation was made by the vite.config.ts file in its source.

Screenshot from 2022-09-29 08-09-32.png

Realization

However, I realized later when I started to setup Zammad on my Ubuntu 22.04 development machine, and started to understand the source code, that it uses Coffeescript heavily and not VueJS for its web application views.

Screenshot from 2022-09-29 08-14-46.png

And VueJS is being used to build a mobile frontend which is barely functional. And to create a support ticket it redirects back to the web view running on Coffeescript.

Proof

Let us see the below screencast to find this out. I have an environment variable ENABLE_EXPERIMENTAL_MOBILE_FRONTEND set to true as mentioned on my Zammad setup guide on Ubuntu 22.04. And I have booted up the Zammad server on my local development machine. You can see clearly its starts a vite server too which serves the VueJS based mobile frontend.

chetanmittal@chetanmittal-ubuntu2204:~/workspace/zammad$ foreman start -f Procfile.dev
08:18:43 vite.1      | started with pid 11280
08:18:43 web.1       | started with pid 11281
08:18:43 websocket.1 | started with pid 11282
08:18:43 worker.1    | started with pid 11284
08:20:16 web.1       | => Booting Puma
08:20:16 web.1       | => Rails 6.1.6.1 application starting in development 
08:20:16 web.1       | => Run `bin/rails server --help` for more startup options
08:20:48 websocket.1 | 2022-09-29T02:50:48Z:client(-) check unused idle connections...
08:20:49 websocket.1 | 2022-09-29T02:50:49Z:client(75280) closing idle long polling connection
08:20:49 web.1       | Puma starting in single mode...
08:20:49 web.1       | * Version 4.3.12 (ruby 3.1.2-p20), codename: Mysterious Traveller
08:20:49 web.1       | * Min threads: 5, max threads: 30
08:20:49 web.1       | * Environment: development
08:20:49 web.1       | * Listening on tcp://127.0.0.1:3000
08:20:49 web.1       | Use Ctrl-C to stop
08:21:08 websocket.1 | 2022-09-29T02:51:08Z:client(-) Status: websocket clients: 0
08:21:08 websocket.1 | 2022-09-29T02:51:08Z:client(-) Status: ajax clients: 0
08:21:13 vite.1      | 
08:21:13 vite.1      |   VITE v3.0.9  ready in 131068 ms
08:21:13 vite.1      | 
08:21:13 vite.1      |   ➜  Local:   http://localhost:3036/vite-dev/

Screencast

Now, in the above screencast you will find that:-

  1. When I change the url to go to mobile frontend Zammad uses vite to serve pages
  2. VueJS directives such as v-if can be seen in the html source inside developer tools
  3. When I tried to 'create a new ticket' it redirected me back to the Coffeescript based web view

Closing

I would just request to the teams building open source projects that you must mention your real tech stack than just using a famous technology's name for plain marketing.

The way this project does. https://github.com/codecombat/codecombat. Why didn't I find this project earlier? Because I was looking for VueJS projects and not Coffeescript projects. However, Codecombat uses both Coffeescript and VueJS. See the screenshot below.

Screenshot from 2022-09-29 09-20-13.png

For the team @ Zammad - Coffeescript is also a nice tool and I am amazed at the UI you have built for your support ticketing product. Mentioning Coffeescript along with VueJS in your tech stack would do good to the project and not harm it. There is no where Coffeescript seen in your tech stack on your website pages.

Screenshot from 2022-09-29 08-05-08.png

Also, your Tailwind and GraphQL implementations are also experimental. I realize you use Gitlab CI/CD and Docker as I can find the configs. Ansible you might be using internally for your paid Zammad SaaS services. And, Mattermost you might be using it for internal private/corporatish communication, however, Slack or Discord is better for open source project communications. As an open source enthusiast I can't chat with any of your team member as you have no slack no discord.

Why not design an image with real tech stack?

real-tech-stack-zammad.png

Technologies mentioned in real tech stack above

  1. Coffeescript - https://coffeescript.org/
  2. SpineJS - https://spine.github.io/
  3. Bootstrap CSS - https://getbootstrap.com/docs/3.4/
  4. ECO View Templates - https://github.com/sstephenson/eco
 
Share this