npm install coffeecupThis is a clone of @mauricemach CoffeeKup.
I am renaming and trying to keep this project alive.
CoffeeCup is a templating engine for node.js and browsers that lets you to write your HTML templates in 100% pure CoffeeScript.
It was created in celebration of whyday, as an application of the concept used in Markaby ("Markup as Ruby", by Tim Fletcher and why the lucky stiff) to CoffeeScript.
Here's what a template written for CoffeeCup looks like:
doctype 5
html ->
head ->
meta charset: 'utf-8'
title "#{@title or 'Untitled'} | A completely plausible website"
meta(name: 'description', content: @description) if @description?
link rel: 'stylesheet', href: '/css/app.css'
style '''
body {font-family: sans-serif}
header, nav, section, footer {display: block}
'''
script src: '/js/jquery.js'
coffeescript ->
$(document).ready ->
alert 'Alerts suck!'
body ->
header ->
h1 @title or 'Untitled'
nav ->
ul ->
(li -> a href: '/', -> 'Home') unless @path is '/'
li -> a href: '/chunky', -> 'Bacon!'
switch @user.role
when 'owner', 'admin'
li -> a href: '/admin', -> 'Secret Stuff'
when 'vip'
li -> a href: '/vip', -> 'Exclusive Stuff'
else
li -> a href: '/commoners', -> 'Just Stuff'
div '#myid.myclass.anotherclass', style: 'position: fixed', ->
p 'Divitis kills! Inline styling too.'
section ->
# A helper function you built and included.
breadcrumb separator: '>', clickable: yes
h2 "Let's count to 10:"
p i for i in [1..10]
# Another hypothetical helper.
form_to @post, ->
textbox '#title', label: 'Title:'
textbox '#author', label: 'Author:'
submit 'Save'
footer ->
# CoffeeScript comments. Not visible in the output document.
comment 'HTML comments.'
p 'Bye!'
Interactive demo at coffeekup.org.
- One language to rule them all. JavaScript is everywhere, thus so is CoffeeScript. Servers, browsers, even databases. If extending this to rendering logic and UI structure (server and client side) is desirable to you, CoffeeKup is your friend.
- More specifically, one _outstanding_ language. CoffeeScript is one hell of a clean, expressive, flexible and powerful language. It's hard to find such combination, especially if you need it to run in the browser too.
- Not yet another specialized language to learn. Transferable knowledge FTW.
- Embed your templates in CoffeeScript nicely. Templates are just functions, so they don't lose syntax highlighting and syntax checking when embedded in CoffeeScript apps.
- Embed CoffeeScript in your templates nicely. In the same manner, you can write the contents of
This is one of many browser deployment possibilities, pre-compiling your template on the server to a standalone function. To see all serving suggestions, check out regular, decaf and crème.
Command-line:
$ coffeecup -h
Usage:
coffeecup [options] path/to/template.coffee
--js compile template to js function
-n, --namespace global object holding the templates (default: "templates")
-w, --watch watch templates for changes, and recompile
-o, --output set the directory for compiled html
-p, --print print the compiled html to stdout
-f, --format apply line breaks and indentation to html output
-u, --utils add helper locals (currently only "render")
-v, --version display CoffeeKup version
-h, --help display this help message
See /examples for complete versions (you have to run cake build first).
Please note that even though all examples are given in CoffeeScript, you can also use their plain JavaScript counterparts just fine.
- Issues
- IRC: #coffeekup on irc.freenode.net
- A Beginners's Introduction to CoffeeKup
- html2coffeekup - Converts HTML to CoffeeKup templates.
- htmlkup - Another HTML converter, stdin/stdout based.
- ice - CoffeeKup and Eco in Rails (screencast).
- coffee-world - Tool to watch and compile HTML with CoffeeKup, CSS with coffee-css and JS with CoffeeScript.
- cupcake - Express app generator with CoffeeKup support.
- ck - "a smaller, faster coffeekup": Alternative, barebones implementation.
- ckup - "Markup as Coco": Similar engine but for Coco ("Unfancy CoffeeScript").
- Eco - "Embedded CoffeeScript templates": "EJS/ERB" for CoffeeScript.
- timbits - "Widget framework based on Express and CoffeeScript".
- coffee-css - "More CSS for CoffeeScript".
- ccss - "CoffeeScript CSS".
Latest version tested with node 0.4.9 and CoffeeScript 1.1.1.
- Jeremy Ashkenas, for the amazing CoffeeScript language.
- why the lucky stiff, for the inspiration.