Dropkiq For CodeMirror

Dropkiq is now available for CodeMirror

Adam Darrah
Mar 19, 2020 12:19 PM
Dropkiq For CodeMirror

CodeMirror is one of the most widely used Javascript libraries for editing code in a web browser available today. It ships with tons of features and language modes for editing any kind of code you can think of. I've recently been reading the blog of Marijn Haverbeke, the creator of CodeMirror. The approach he used in creating CodeMirror is incredibly impressive, and made me think through some data structures I haven't thought about since being in class for my computer science degree. It's no wonder this editor has been used by huge companies for many years!

In fact, you've already used CodeMirror yourself if you've ever edited your theme on Shopify. Shopify's official theme editor is CodeMirror with custom Liquid syntax highlighting and Multiplexing. Doing a quick Google search, it looks like many people have created some 3rd party libraries to attempt to mimic the Shopify experience for your own website, such as https://www.npmjs.com/package/codemirror-liquid-multiplex.

CodeMirror is used in Shopify to edit .liquid theme files

If your company uses CodeMirror with Liquid and you're looking for an even better Liquid-editing experience, then it's your lucky day! You can now take advantage of Dropkiq's Liquid autocompletion with CodeMirror with no extra work. You simply use DropkiqUI the same way as with any other input type. Things just work like magic! Take a look at the demo to see everything in action, or you can look at the documentation to see how to set this up for yourself.

As always, please reach out to me anytime at adam@dropkiq.com if you're interested in using Dropkiq at your company and you use a WYSIWYG editor that is not listed.

You might also like...

Explore how Dropkiq can help improve your user experience.

Writing Liquid expressions is hard. Let Dropkiq help you make it easier.