JavaScript Editing & Emmet Integration

Last week we pushed an update that brings JavaScript and CoffeeScript editing directly into the source editor. Custom JavaScript is an important stepping stone toward interactive components and exciting new features on our roadmap. To check it out click the "Source Editor" button and select the "JS" tab from the editor menu.

Divshot automatically includes jQuery on every page so you can easily write code to handle page behavior. It's great for binding events and manipulating the DOM in your prototypes. In the screenshot below I'm toggling an alert on a click event:

More good news! Our source code editor now supports structural markup (HTML), presentation (CSS), and behavior (JS) for fully customizable pages with more improvements in the pipeline.

One such improvement just released is Emmet integration for HTML and CSS. Emmet speeds up your editing workflow by combining CSS-like expressions with TextMate-style snippets. It allows you to type a CSS selector, press the tab key, and instantly generate HTML.

For more info check out the docs and watch Emmet in action: