Nov 21

First post - CodeMirror

Editing code in a browser

First post!

When I began creating my CMS as my first major Django project, my first goal was to eliminate the necessity of editing text files on the filesystem. Therefore it was necessary to store Django Templates and stylesheets in the database. This was easily accomplished. However, it was immediately obvious that editing HTML, CSS, or Javascript inside a conventional browser textbox was a very poor way to create and maintain a site.

I set out to correct this situation, figuring that somebody must have implemented a Javascript-based editor, doing for code what WYSIWYG editors do for content. I quickly found EditArea. It was great, but I quickly discovered that it was not ready for primetime. Syntax highlighting worked, but the editor couldn't handle wrapping lines properly. It also was nearly impossible to see a selection when syntax highlighting was turned on. These problems were mostly confined to Firefox on the Mac.

In preparing to bring Trojan Badjer live, I decided that there must be something better out there for editing code in a browser. I ran in to a very tempting vi clone. Oooo. Tempting... But no.

I then found codemirror. I passed this over before. So utilitarian. This time around, I decided to take a closer look, and realized that, in the end, all I really wanted was really easy-to-read code. The essentials are there: sytax-highlighting, code indenting and undo-redo. Honestly, there is not much else. No toolbar even. By default, it inserts an iframe, with no border. It's perfect. Exactly what I need, and little else. The only thing I would love to have is line-numbering. I can live without it.

Since I have already had added jQuery into my framework when I was integrating WYMEdit, adding codemirror was a piece of cake. In my next post, I will describe how I did it.


I'm a Lutheran pastor, a CTO, a father, amateur photographer, programmer, Irish music fan, and all around geek, but I only have one blog. So, you will find here a mix of theology, photography, geek speak, family news, and whatever else strikes my fancy. If you get confused, there are now categories…




Recent Posts