January 2012
2 posts
3 tags
Stylus gets @extend
@extend is a great little feature which originated in SASS, and now finds a home in Stylus. If you’ve ever written CSS like this, you know it can become quite the pain to maintain large lists of selectors:
.message,
.warning,
.error {
font-size: 14px;
padding: 5px 10px;
border: 1px solid #eee;
border-radius: 5px;
}
.warning {
color: yellow;
}
.error {
color: red;
}
@extend...
December 2011
1 post
4 tags
Why Stylus is the most CSS-like high-level... →
This short Vimeo screencast illustrates why Stylus is the most like CSS as a stylesheet “preprocessor”. More on Stylus here.
November 2011
3 posts
node "debug" module →
2 tags
Connect 1.8.0 - multipart support
Connect 1.8.0 is a tiny but substantial release because it adds multipart/form-data support via Felix Geisendörfer’s fantastic multipart parser formidable, it’s great and chances are you’re already using it!
The bodyParser() middleware now unifies multipart, json, and x-www-form-urlencoded parsing, providing the req.body object containing the parsed data. For security purposes...
Batman vs Pedophile (vigilante justice) →
September 2011
3 posts
Jade & Stylus 0.16.0 released
Jade 0.16.0
This release of Jade adds quite a few new features such block support for include, and template inheritance!
Extended grammar
Jade currently allows you to use JavaScript all over the place, rather than restricting a subset, or implement its own grammar. While this is flexible it tends to make templates look less like … templates! In an effort to make Jade more declarative...
3 tags
Stylus 0.15.1 - new property reference &...
Stylus 0.15.x adds a bunch of cool new functionality as well as some important bug fixes.
@keyframes fabrication
The new keyframes fabrication support automatically duplicates your @keyframes definitions to support vendor prefixes. Note that this is only a default, as shown below:
@-moz-keyframes foo {
0% {
color: #000;
}
100% {
color: #fff;
}
}
@-webkit-keyframes foo {
0%...
2 tags
Connect 1.7.0 - fast static file memory cache and...
Be sure to update Connect to the latest release 1.7.0 for the following goodies!
staticCache() middleware
1.7.0 now provides a new middleware named staticCache(), acting as a memory cache on top of the regular static() middleware. Older versions of Connect used to provide memory caching, however it was baked right into static(), bloating the middleware more than necessary.
Benchmarks
The...
August 2011
3 posts
3 tags
Game prototyping with JavaScript & CSS3
I wanted to share a quick few-hour game prototype to hopefully inspire a few people! The industry let-alone browser-based games seem very lacking in imagination and storytelling, or maybe I’m just not looking hard enough ;) but I miss games like Grim Fandango.
Below is a screenshot of the demo, consisting of several DOM nodes to represent parts of the main character, the birds, and the...
4 tags
commander.js - nodejs command-line interfaces made...
Commander.js is a small node.js module allowing you to define options and interacte with the user’s terminal in a simple and natural way, inspired by the Ruby library of the same name.
Features
self-documenting code
auto-generated help
combined short flags (“-abc” == “-a -b -c”)
option defaults
option coercion
command parsing
prompts
Example
A basic...
6 tags
Introducing Texty & Super Agent screencast
In this 20 minute screencast we dive into the full-text Redis search library reds for nodejs, an introduction to the canvas-only text editing library Texty, discussing how you can style canvas drawings with CSS, and the “ajax with less suck” library superagent.
July 2011
3 posts
3 tags
Reds - light-weight full text search for nodejs...
Reds (red-s) is a very small (~300LOC) light-weight full text search library for node.js.
I wrote reds with Kue in mind, a priority job queue for node. I wanted to add search capabilities so you can easily find jobs by any of the arbitrary data provided, names, emails, anything.
API
You can use reds for multiple isolated search indexes, which is why you must pass a key to reds.createSearch(),...
2 tags
Jade Mixins & Includes
The latest release of Jade 0.13.0 adds mixins and includes. Jade users have longed for some method of static include, so it’s (finally) here, and compliments mixins nicely, allowing you to store mixins in one or more separate files.
Mixins
A mixin definition takes the form mixin <name> [( params )] block, where params is identical to JavaScript function params, simply a list, as...
2 tags
The Luna programming language
A few weeks ago I started implementing Luna, an elegant, expressive, and embeddable language written in ANSI C, with performance as a primary focus. For now it’s just a side project, but I thought it would be fun to blog about the different aspects as they unfold, building languages is a really fun process.
Goals
The current goals of Luna are the following:
small, simple, expressive,...
June 2011
1 post
3 tags
Styling Canvas Drawings With CSS
Today I implemented an idea to style canvas elements with CSS, I’ve never personally seen this done, and it’s not always practical, but in some cases it would be very handy. For example a text selection api may be comprised of several “elements”, the text, the caret, the selection range rect etc.
Let’s say by default, our drawing will look the image below:
...
May 2011
2 posts
4 tags
node recap #2
JSONSelect
This first library is JSONSelect. This library allows you to query JSON using css selectors! this seems like an obvious one, but I haven’t personally seen any other implementations.
It’s not node-specific, however it is JavaScript, so naturally it works with nodejs as well, and over all it’s just a neat concept. Suppose we have the following JSON:
JSONSelect
...
1 tag
node recap
Figured I would whip up a quick blog post during lunch to mention some recent additions / releases to node projects.
Express Mongoose
Aaron recently released express-mongoose which is a fantastic plugin for any of you using Mongoose allowing you to pass query promises directly to res.render(), res.partial(), and `res.send() calls, deferring rendering until complete.
For example you may...
April 2011
4 posts
4 tags
Stylus vs SASS vs LESS error reporting
I was curious what SASS did as far as error reporting goes, so I tried the following snippet with SASS, LESS as well as Stylus.
body {
form input {
background: foo[fail];
}
}
LESS
The output from LESS was terrible:
Syntax Error on line 4
note: that for LESS I had to tweak the input to “foo[fail’]’;” since it simply consumes the input above
SASS
The...
3 tags
Cluster Live 0.0.1
cluster-live is a plugin for the Cluster server manager written for node. Cluster is similar to Ruby’s “Unicorn”, however is extremely extensible via a simple plugin system.
Cluster is built with the Express web framework, Jade for templates, Stylus for CSS, and Socket.IO for communication.
Below is a screenshot of cluster-live in action. Each worker process is represented by...
4 tags
Extend Sylus with a Nib
Today I am releasing Nib, an extensions library for Stylus, inspired by the SASS compass library. Nib is a very new library with a minimal feature set at the moment, however I need to get some of my semi-finished projects open-sourced to make way for bigger badder things, and I’m already finding this project quite useful so feedback and contributions are always welcome.
If you dont like to...
4 tags
Redis Implemented With Node
Nedis is a (partial) redis implementation written with node. Primarily for fun, however as our team grows larger, and as we add more non-technical team members over at LearnBoost I figured it would be nice help prevent the need for compiling development dependencies.
Nedis is an old side project I had going, and is no where near complete, but it does work, so I figured I would open-source it....
February 2011
3 posts
3 tags
Stylus 0.4.0 released
Stylus for those who are not familiar with it, is a dynamic language which compiles down to css, written with JavaScript for node.js.
CSS Syntax Support
Previously Stylus only allowed the use of our indented grammar, which may deter designers that are not comfortable learning or using a new syntax. For this reason and to aid in copy/pasting of css stylesheets I have added support for optional...
3 tags
Stylus 0.4.0 released
Stylus for those who are not familiar with it, is a dynamic language which compiles down to css, written with JavaScript for node.js.
CSS Syntax Support
Previously Stylus only allowed the use of our indented grammar, which may deter designers that are not comfortable learning or using a new syntax. For this reason and to aid in copy/pasting of css stylesheets I have added support for optional...
stylus: Expressive, robust, feature-rich CSS... →
thechangelog:
This isn’t the first time we’ve covered the latest fresh and new creation from LearnBoost.
Stylus is an expressive, dynamic, robust CSS pre-processor for Node.js. If you are familiar with Sass.js, Sass or Less.js … Stylus is kind of similar, but from what we’ve heard from TJ Holowaychuk they’ve taken it pretty far in a new direction.
At first glance, Stylus looks a lot like...
December 2010
1 post
3 tags
Introducing Tobi
A few days ago we released another small test related project named Tobi for nodejs. Tobi is similar to Ruby tools such as Capybara or Webrat in fulfilling the need for headless acceptance testing. Tobi utilizes jQuery and node’s jsdom to give you an expressive foundation for testing your application in a familiar way.
Motivation
For those of you who follow our work at LearnBoost we have...
November 2010
1 post
4 tags
node-canvas open sourced
Today we open sourced our latest LearnBoost project, node-canvas, a canvas implementation for nodejs. The project is certainly a work in progress but we implement a large portion of the api, as well as node-specific additions such as Canvas#toBuffer() and Canvas#createPNGStream().
Introduction Screencast
Github page
Examples
Shown below is the test suite running side by side with the browser...
September 2010
3 posts
2 tags
Jade Templates Introspection
The Jade Template Engine for Node now have the ability to manipulate themselves based on the parse tree constructed from a nested block. This has extreme potential, in that developers can now alter jade templates dynamically, constructing their own syntactic sugar.
One of my favorite (but not only) use-cases for this functionality, would be that of a database record edit form. Typically your...
3 tags
C Indentation Based Language Lexer Tutorial
C Indentation Based Language Lexer Tutorial
In this tutorial I wanted to show you how you can start your own programming language, starting by creating what is commonly referred to as a lexer or scanner. The grammar for our “language” will be indentation based much like Python, however will implement a tiny subset of tokens for illustration purposes. If you prefer, you may also jump...
2 tags
C Insertion Sort
So I wanted to investigate different sorting algorithms for a few personal projects, and I thought while I was doing so that I would write little tutorials for each algo :) why not! First we have one of the most basic sorting algorithms, the Insertion Sort.
Explanation
As illustrated by this video, the insertion sort works much like you might sort a deck of cards laying infront of you on a...
2 tags
"Mastering Node" - Open Source NodeJS eBook →
August 2010
4 posts
3 tags
Jade Screencast - Template Engine For NodeJS
Introduction
This screencast covers an introduction to the Jade Template Engine for Node. Jade is an indentation based template engine inspired by Haml, with added support for the popular Express web development framework.
Iteration, Conditionals, and Debugging
Learn how to iterate objects and arrays, template conditionals, the debug option and how Jade’s error reporting works in this...
3 tags
nDistro Screencast - NodeJS Deployments In Seconds
I decided to take some time and go screencast-happy today, the first screencast is an introduction to my nDistro nodejs distribution toolkit. nDistro allows you to create node deployments in a matter of seconds.
Ps. Dont mind my annoying bird! here is the screencast
2 tags
Getting Started With Express
In this short tutorial for Node Knockout we will be creating a small application using the popular Express framework.
Express is a light-weight Sinatra-inspired web development framework. Express provides several great features such as an intuitive view system, robust routing, an executable for generating applications and much more.
Installation
To get started with Express we first have to...
July 2010
4 posts
2 tags
nDistro - Node distribution toolkit
nDistro is a small bash project that allows you to define, and install node distributions within seconds. This means no GIT dependency, no compiling node from source with Make, no need to install node then install npm (node’s package manager).
nDistro distributions are easy to create, share, and install. Before we get into the details lets install nDistro:
$ cd /usr/local/bin &&...
2 tags
Express 1.0beta
Yesterday I released Express 1.0.0beta, a Sinatra inspired Node web development framework.
The beta is a near re-write consisting of roughly 300 commits, introducing new features,
removing legacy code, and improving documentation. Express now runs on the Connect middleware framework, which replaces the
previous concept of a Plugin. The performance of express has also been optimized and can
now...
5 tags
Node JavaScript Test Coverage
Today I released Expresso 0.4.0, a TDD framework for node which uses my node-jscoverage project to instrument your library, providing optional test coverage reporting when the —cov flag is used.
Expresso
If you dont know anything about expresso, it executes tests in parallel, so even ~1000 assertions against live http servers can execute in less than a second. By doing so we unfortunately...
3 tags
Jade - Haml killer for nodejs
Last night I open sourced my latest project Jade, a template engine for node, focusing on readability, error handling and performance. Jade spawned from several needs, first I was tired of debugging poor JavaScript template implementations, or finding work-arounds for common issues, secondly I love haml’s syntax, however I feel it could be revamped to provide a more enjoyable experience, and...
June 2010
3 posts
3 tags
Connect vs JSGI
Last week Kris Zyp posted JSGI vs Connect, claiming that Connect is slower than JSGI.
Another claim is that JSGI is far more intuitive, which I consider false. First of all the library does not follow common nodejs idioms, and the configuration also causes the “boomerang effect”, although in the end only the community will decide what they want.
Krisbenchmarks generally consisted...
3 tags
Connect - Middleware For NodeJS
Yesterday myself and Tim Caswell open-sourced
the first Ext JS nodejs project, Connect.
Connect is an abstraction layer, providing node developers with an effective, high performance solution
for rapid development using interchangable components called “middleware”.
Middleware
Middleware provides node developers with simple “plug and play” modules,
which may be stacked...
2 tags
Expresso - TDD Framework For NodeJS
A few days ago I rolled out a new TDD framework for Node. Although node has many BDD and TDD frameworks to offer, I wanted a simple, fast, and thin layer built upon node’s core assert module. Among other features I wanted an executable that I could re-use for my future node projects, this project is named expresso.
Performance
Although expresso stands short in the reporting department,...
May 2010
1 post
V8 Development Introduction →
April 2010
8 posts
8 tags
Express vs Sinatra Benchmarks
So I have been setting up benchmark scripts for Express today, and so far some of the results have been quite interesting! The numbers shown should be taken lightly, however they consistently show that Express is quite fast.
If you are interested in benchmarking your own web applications you might want to read my last article ApacheBench Gnuplot Graphing Benchmarks.
All of the following...
4 tags
ApacheBench GnuPlot Graphing Benchmarks
In this post I am going to be showing you how you can get set up creating http benchmark graphs using Gnuplot and ApacheBench. The ApacheBench or ab executable is packaged with Apache’s httpd, however it can be installed stand-alone as well from Google Code.
The Application
First things first, below we have an insanely simple NodeJS application, that will respond with the string Hello...
2 tags
NodeJS Package Manager
If you use node you may have heard of the Kiwi Package Manager, if not its simply a package management system for node modules. Although development of kiwi is still early, its already 100% usable and available to the community.
Installing Packages (seeds)
Kiwi’s packages aka seeds, are simply tarballs abstracted using the extension “.seed”. Installing the latest version of a...
3 tags
V8 Cookbook →
How I Made $2000 Writing An eBook
Roughly one month ago I wrote Advanced JavaScript, a $4, 60 page eBook written using XML and DocBook.
The main reason I went with DocBook was because I could control syntax highlighting for code snippits, however there are other benefits as well such as outputting several formats like ePub, PDF, etc. I would recommend against this unless you have large snippits of code, because it can take some...
2 tags
Node Version Manager Preview
The Node Version Manager or nvm is a bash script for installing, and switching releases of NodeJS so that you can test your libraries (or deploy) using any release you need.
Tim (creationix) just started this library earlier today, so I forked away and started adding features and refactoring existing code. Currently to use my changes you have to clone my refactor branch:
$ git clone...
4 tags
Express 0.9.0 released
A few minutes ago Express was released, packed with tons of bug fixes and features.
Installation
As always Express can be installed via the Kiwi package manager for NodeJS using one simple command:
$ kiwi install express
Alternatively you can Download a tarball, or install via Git:
$ git clone git://github.com/visionmedia/express.git
$ cd express && git submodule update...
Holy Fuck I Have A Blog!
Well I officially have a blog now, for those of you who have no clue who I am my name is TJ Holowaychuk and I work for Ext JS. I love open source! I have over 170 followers on Github and roughly 50 open source projects ranging from JavaScript, Ruby, PHP, to C and C++.
Currently my most popular open source libraries are the following:
JSpec JavaScript BDD framework
Express NodeJS web...