Zen Coding

Download Squad has a quick review, with video, of Zen Coding (Google Code project page here), an extremely well-thought-out accelerator for anyone who codes HTML. Its syntax is CSS-like. Zen Coding has been around for a while — here's its author Sergey Chikuyonok's introduction in Smashing Magazine from last November — and it has now picked up support for more than a dozen editing environments, including Notepad++ and TextMate.

Comments

Vim?

[19061969]

There doesn't appear to be support for Vim but that already has another script called snipMate http://www.vim.org/scripts/script.php?script_id=2540

Re:Vim?

[vroom]

The official page doesn't mention vim support, but this script seems to match the functionality pretty closely http://mattn.github.com/zencoding-vim/

Check the TUTORIAL file in the repo to either turn on by filetype or globally

Re:Vim?

[ProdigyPuNk]

http://www.emacswiki.org/emacs/ZenCoding ...and here it is for emacs. I've only seen this mentioned once or twice before, but it does make things quite a bit quicker. Work a lot better than my highlight/middle click copy/paste method ;p

Re:Vim?

[MagicM]

Actually, the official page does mention it, under "Unofficial implementations":

Vim (crossplatform) - Sparkup, Zen Coding for Vim

don't mock the Notepad++

[MoFoQ]

don't mock the Notepad++....it's very powerful, yet lightweight and unbloated.

I'm sure many slashdotters here also live by the "Notepad++ code"....

Re:don't mock the Notepad++

[wmbetts]

Vim > emacs > Notepad++ Let the war begin!

Re:don't mock the Notepad++

[gfody]

I prefer emEditor

Re:don't mock the Notepad++

[EvanED]

Yeah, god forbid someone pay money for software they use and like.

Re:don't mock the Notepad++

[bit01]

Yeah, god forbid someone pay money for software they use and like.

The price and license are important software characteristics whether you like it or not. A non-zero price can make it a practical impossibility to use in many organizations because of the paperwork involved. A license that doesn't allow you to install it where ever you need it, as you need it can also be a problem.

Since their are many free alternatives available in this category it's easily possible that the pay software is more trouble than it's worth even if it is otherwise superior, as the GPP was implicitly pointing out.

---

Like software, intellectual property law is a product of the mind, and can be anything we want it to be. Let's get it right.

Re:don't mock the Notepad++

[EvanED]

A non-zero price can make it a practical impossibility to use in many organizations because of the paperwork involved.

But not always, and definitely isn't at home.

Since their are many free alternatives available in this category it's easily possible that the pay software is more trouble than it's worth even if it is otherwise superior, as the GPP was implicitly pointing out.

And apparently that's not true for the poster who originally mentioned it.

Re:don't mock the Notepad++

[simoncpu was here]

Why did you include an OS in this editor war?

Zen

[mindbrane]

Is there a better commentary on the west's general inability to grok zen than our endless bastardization of the word, zen?

Re:Zen

[istartedi]

Is there a better commentary on the west's general inability to grok zen than our endless bastardization of the word, zen?

ZEN is not a ticker symbol on the NYSE yet, so I guess not.

Re:Zen

[fractoid]

Is there a better commentary on the west's general inability to grok zen than our endless bastardization of the word, zen?

That's so ironic. *ducks*

Re:Zen

[chill]

The wise programmer is told about Tao and follows it. The average programmer is told about Tao and searches for it. The foolish programmer is told about Tao and laughs at it.

Re:Zen

[tpstigers]

The word zen means 'meditation'. Not real hard to grok. Nor is it difficult to understand why someone would consider coding to be a meditative process. Or were you actually referring to Zen?

Re:Zen

[Anonymous Coward]

Zen came to fruition the Tang Dynasty, at the height of development of Buddhism in China. It came as the highest practice, equivalent to Indian Prajnaparamita and Tibetan Dzogchen or Mahamudra traditions. The people who practiced it were those who already had great meditative ability and high capacity for understanding. Without a solid foundation, studying Zen (especially in the West) is simply nonsense. Without a background in the Buddhist sutras, you will likely just become confused or fool yourself into thinking it's just a mind game. From a real Zen master, Hsuan Hua:

The stupid transmit to the stupid,
One is teaching but neither has any idea.
The teacher goes to hell.
Where will the student end up?

Re:Zen

[Hurricane78]

Actually, I agreed with you, in having been ignorant about anything but the romantic western views on “zen”.
So I read up on the actual philosophies behind it. And now I just as much won’t to come near zen, as I don’t want to come near any other religious insanities. (Please bear with me. Or at least read the points, down there where it’s marked bold. Thank you. :)

See, the goal of Zen, as far as I see, is so get into a “total zero” state. One that they call “enlightement”, but that I call “no different from being a vegetable”. The goal is to seek less and less, and basically just sit there and get into absolute nothingness. Because apparently you don’t exist anyway, as existence is a only defined trough changes (true, but somehow you’re not thinking four-dimensionally, Marty! ^^)
So reaching Zen, is the art of killing your existence, without killing your body.
How in hell is that an ideal? It’s sick. And I don’t say that in a derogatory fashion. I say that, because that is an actual form of repression that mentally ill people use.

See, when we experience horrible things that we can’t fight, we humans tend to go in one of two directions:
1. Build up an inner imaginary world, and explain the horrible experiences trough it, giving it all a sense, and making it “OK” again. In a very mild form, we all have done this. In a medium form, it’s called “religion” (Christian, Muslim, Jewish, etc). And in the worst form, it’s called by its medical name: schizophrenia.
2. Run away and make it so that that part of reality and you never ever come into contact with each other again. Ever. And if we can’t physically run away, we do so, be hiding away in our mind itself. Blocking us from reality. Of course we all also have done a bit of this once in a while. But we learned to face it again, and came back. But what Zen does, is generalizing it, and making it an ideal. Going as far as physically possible. And thereby removing themselves from our reality. Which is, to us, equal to stopping to exist.

So: No thanks. :)

Re:Zen

[Hognoxious]

Zen has nothing to with "spirituality".

Oh come on, try to make an effort.

It should be "Zen has nothing to do with spirituality and everything to do with spirituality" or "The student asked about the spirituailty in Zen. 'Lemons', replied the master, and the student was enlightened".

Re:Zen

[mike260]

Mod parent "+mu, Has Buddha Nature"

Re:Zen

[Anonymous Coward]

It's mysticism, so it doesn't matter how "serious" you try to be, It's still dressed-up psychobabble in the vein of similar New Age practices. Just because it's old, doesn't mean it should automatically get belief or respect (see also: Christianity, Islam).

The lesser known Zen Coding koans

[Anonymous Coward]

such as:

* What is the sound of one interrupt flapping?
* If an exception gets thrown in an operating system, and no one is around to catch it, does it make a sound?

Re:The lesser known Zen Coding koans

[Anonymous Coward]

I prefer my koans with ice cream.

Let's see...

[oljanx]

When I "write HTML" I'm actually writing HTML, CSS, JavaScript, PHP and SQL queries at the same time. On a good day. What the hell, why not add another syntax?

Re:Let's see...

[pavera]

Please keep your SQL and HTML separate. Don't punish those who will come after you.

Re:Let's see...

[EvanED]

What the hell, why not add another syntax?

To be fair, the syntax is very much like CSS. Further, it's not like it stays in the file for those who come after; it's just that the editor expands things for you.

Re:Let's see...

[EvanED]

But again, with the instant feedback when it expands it for you, if that happens you can just hit undo and type it out yourself.

Re:Let's see...

[EvanED]

So it's kind of like Lisp macros, except that they are expanded in the source to make maintenance both more difficult and less efficient than just starting over from scratch.

If that's your attitude, feel free to go ahead and use Markdown or ASCIIDoc or one of the other markup lanugages that you can compile to HTML.

However, this is something you can use in documents that are already HTML, need to be HTML because that's what your employer or customer demands, etc. without affecting the end result. Saying "let's replace HTML with something better" is not exactly a realistic proposition.

Re:Let's see...

[eelke_klein]

Maybe you should make that, please keep your SQL, PHP, JavaScript, CSS and HTML seperate.

Re:Let's see...

[slimjim8094]

How do you suggest separating PHP, HTML, and JS? Sure, the bulk of your code - especially reused libraries - should be separate but how do you use them without inline JS? And if you're using PHP, what are you using it for if not writing HTML (with the aforementioned JS)? Your PHP, even if it calls stored procedures, will also have SQL in it - and do you really need a stored proc for every one-shot thing? Repeated code, sure, but... And do you make one-shot CSS classes or blocks for everything?

Half of what you say is impossible, and the other half is not always practical. I appreciate the spirit... but let's not go overboard

Re:Let's see...

[hgavin]

how do you use them without inline JS?

http://en.wikipedia.org/wiki/Unobtrusive_JavaScript

Re:Let's see...

[FredMenace]

It is trivial to have not a singe line of Javascript in your HTML, other than the link to the external Javascript file.

See, for instance, http://api.jquery.com/category/events/ for a set of jQuery methods for attaching events, using css-like selectors. (Most of these methods are special cases of "bind".)

To avoid mixing HTML and PHP, you can use a templating engine like Smarty (http://www.smarty.net/crashcourse.php). (I prefer those that use a different syntax from regular PHP to help enforce the distinction.) I do understand that PHP was originally a templating language itself, at a time when most hard-core back-end logic might have been in C/C++ and the PHP was for gluing that to the markup. But now that PHP is used for that same back-end code, it makes sense to separate it out of the HTML, so front-end coders don't need to wade around in back-end logic, programmers don't need to worry about markup and presentation, and each file to edit is clear and understandable in itself, partly by consisting of a single language and sticking to a single task. (The template language is designed to be as simple as possible, and only has the limited capabilities necessary to include dynamic content - generated elsewhere - in HTML markup.)

At the least, SQL should be in a separate data-abstraction layer. That layer may also be in PHP, but at least it's a special-case set of code just for accessing the data store (partly so that it can be replaced with a different data store if needed, without affecting any other code). Many frameworks use an object-relational mapping layer so you don't need to touch SQL at all.

It's also pretty easy to keep CSS completely out of HTML, and if well-designed, the number of special cases to apply to single paragraphs can be very minimal.

Yes, it can seem like all this is a lot of trouble when you're starting out or working on a very simple project, but as a project grows, it can very quickly become unmanageably complex otherwise. These are all tools for managing complexity and scale so that medium-sized projects are easily workable and large-sized projects are possible at all.

Not sheer genius

[MichaelSmith]

TFA shows how Zen lets you type in a terse message and have it expanded into a chunk of html code and describes it as sheer genius. Thats neat but I have nedit macros which do pretty much the same thing. They are time savers for sure.

But nothing which you couldn't do a thousand ways. With perl, awk or sed.

Nice... oh, maybe not

[damianpeterson]

When I first started watching the video demonstration linked to from the project page I though "nice" but after a while of watching obscure string after obscure string I realise that I'm probably better off just trying to memorise HTML instead of HTML *and* whatever the hell this is.

Zen Coding?

[i_frame]

In my case, Bluefish or Quanta Plus are more than enough, don't need to learn another syntax.

I nominate this for all-time...

[bcrowell]

...crappiest article ever to get frontpaged on slashdot.

It's a couple hundred words worth of "OMG!" with a code example.

Re:I nominate this for all-time...

[greg1104]

You should save your vote for when its dupe shows up in a couple of days.

Re:forgot to mention Notepad++'s line dup

[simcop2387]

GNU nano also has syntax highlighting, http://how-to.wikia.com/wiki/How_to_use_syntax_highlighting_with_the_GNU_nano_text_editor

Accelerator

[neoform]

an extremely well thought-out accelerator for anyone who codes HTML.

I don't think that word means what you think it means.

Here's the Emacs version

[patro]

Emacs users can find the relevant package here with screenshots and demonstration Youtube video.

for those ruby railers

[XaXXon]

I recommend sass and haml for doing css and html respectively.

http://haml-lang.com/

http://sass-lang.com/

Codes.... HTML... NOTEPAD?!

[Greyfox]

*head explodes*

The master told me

[goombah99]

The master told me to mediate on the sound of one parenthesis closing. I am ashamed that I don't know what this means. Or was that his point.

Why not go all the way?

[joost]

z0mg zen! As far as I am concerned it's a nice gimmick. If you are going to 'Zen' up your html, why not go all the way and switch to Haml? You actually code in this CSS-like syntax and let Haml compile it to html for you.

You don't "code" HTML

[Viol8]

You code in java,C++,javascript, but HTML is a formatting language - you do not code in it because it isn't a coding language. I know it makes fluffy web page designers feel like their playing with the big boys to talk about "coding" in HTML but you might was well talk about "coding" .ini files.

Re:You don't "code" HTML

[IRoll11!s]

Stop being so pedantic or I will hack your internets.

Re:You don't "code" HTML

[NecroPsyChroNauTron]

So what are you writing when writing HTML, and what shall I ask people to take a look at when I ask them to open a HTML document? "Open up that HTML document and take a look at the....stuff?"
"Code" is a pretty broad concept. Perhaps you should look at this: http://en.wikipedia.org/wiki/Code
Any asshat can substitute letters for their corresponding number in the alphabet, but does that make it less of a "code"?
No. Sorry but I am not convinced and this merely strikes me the same as when people argue the term "hacking".
Some can't accept/understand that language evolves, while others merely just want a foothold to create a meaningless sense of superiority.

Which one are you?
Funny thing is, I agree with you somewhat, snd also find other peoples limited perspectives of technology slightly comical, but I'm not about to narrow the definition of a word just to spite them.
Also, I second nebulus4's comment below and think it's more acceptable to call what you're speaking of, programming, and the result, a program, but I guess that words not quite exclusive enough either...

And uhhhh.......big boys? Come on man, seriously. No tech job/expertise makes you one of the "big boys". Try protein shakes.

Writing HTML is not programming

[Viol8]

HTML is a formatting language, not a programming language

So, you don't understand Zen.

[Kupfernigk]

I don't know what you have read, but you do not understand Zen. Satori is not a "total zero" state. It is what you experience when you suddenly realise that you have spent a whole day coding without distraction, that you have never been conscious of thinking about what you are doing, and the compiled program just works. Or when you realise that you have just driven from London to Birmingham (or your local equivalent) without ever thinking about it: it just happened. Satori is the state when you are "just doing", what programmers (and market traders) call being "in the groove". Zen training can help develop the mind to achieve this state.

Zen philosophy also has the principle of "nothing superfluous". You see something of this in the iPod, or an old Lotus sports car. No irrelevant decoration, no junk, just form fitting function as perfectly as possible.

Zen is not a religion; it is a way of life. Zen masters are famous for anti-religious statements, like the sermon that is said to have gone "What are the spiritual masters? The spiritual masters are a dirty toilet". You do not have to believe in and kind of God to follow Zen, but it helps if you can find an advisor who you relate to. Zen masters, like rabbis, will put off anyone who they think is not yet ready for teaching, or unsuited to their kind of teaching.

However, you show in your third paragraph that you don't have a clue what schizophrenia is either. My advice to you is to do the research, proper research, before posting bullshit. And until you start to overcome your childish and self-important prejudices, you are nowhere near ready even to approach Zen.

Re:Is there a point?

[grumbel]

It's not a format, its just special syntax that you type into your editor that will get expanded to the full regular HTML. It's just there to save you typing, not replace .html files.