Metalsmith: a static site generator with lots of potential #

Segment.io’s Metalsmith doesn’t excite me because it’s a static site generator. It excites me because its everything-is-a-plugin philosophy turns it in to a potential swiss army knife for any project that manipulates a directory of files.

It could be a project scaffolder. It could be an e-book generator. It could be a build tool. It could be a documentation tool. It could be something I’ve never even heard of before.

Check out their examples to whet your imagination.

#113: Scale npm with Isaac Schlueter and Charlie Robbins

Adam talks with Isaac Schlueter and Charlie Robbins — Isaac is the creator of npm and maintainer of Node.js, and Charlie is the Co-Founder and CEO of Nodejitsu. We talk about the “crashyness” of npm recently and the community fundraiser they are starting to ask the community to support npm and to keep it running.

Scale npm. Keep it running. Keep it awesome. #

The npm Registry needs your help.

The npm Registry has had a 10x year. In November 2012 there were 13.5 million package downloads. In October 2013 there were 114.6 million package downloads. We’re honored to have been a part of sustaining this growth for the community and we want to see it continue to grow to a billion package downloads a month and beyond.

Recently the npm registry got “crashy.” Many were not able to install, publish, or otherwise write code on npm. That’s bad.

Nodejitsu is gracefully taking the blame, and have shared the technical details on the Node.js blog. Since May 2013, when they acquired IrisCouch, Nodejitsu has operated the npm registry for the community. They’ve also taken on considerable costs in the process.

We’re a startup. We run npm because we love node and we’re very well qualified for the job. But in the last year, npm has become a giant beast of a project. We run it lean, both from an engineering and hardware perspective, because it’s just too expensive to do otherwise.

We wondered, how could we possibly get the money for the hardware and engineers to do this the right way and keep it free for the community?

That’s where you come in.

Please show your supportDonate at scalenpm.org

#111: Hoodie, noBackend and offline-first with Caolan McMahon

Andrew and Adam talk with Caolan McMahon from Hoodie to talk about very fast web development where you can build complete web apps in days, without having to worry about backends, databases or servers (with Hoodie). We discuss noBackend and the idea behind offline first.

#101: npm origins and Node.js with Isaac Schlueter

Andrew and Adam talk with Isaac Schlueter about the origins of npm, building an asynchronous web with Node.js, and how to get paid to open source. Mastering modern payments using Stripe with Rails. isaacs (Isaac Z. Schlueter) Foo Hack » Isaac Schlueter on Web Development isaacs (izs) on Twitter isaacs/npm Install Node.js and NPM using […]

Mantri.js is a new JavaScript Dependency System #

Thanasis Polychronak has released a new JavaScript Dependency System called Mantri. You may be asking yourself, why create yet another JavaScript Dependency System? Well, straight from the home page:

Medium to Large web applications require a robust system to manage their dependencies. While module loaders excel at interoperating with external libraries, they can become difficult to work with when used as dependency systems. A new system should allow the code to be easily tested, debuged and get out of the way after the build process. Meet Mantri!

A few quick points:

  • It leverages Namespaces
  • It’s written in Node and is available in the npm registry
  • There is a grunt plugin (although it’s recommended to install the CLI)
  • Mantri leaves no footprint in production
  • … And more!

Instead of writing up another Getting Started, I would rather point you to the website for Mantri! He did a great job writing a getting started article, as well as documenting the API.

As usual, you can view the homepage or view the source on GitHub.

Install Node.js and npm using Homebrew on OS X

If you’re looking for an easy to follow guide on installing Node.js and npm on OS X, the default method is to download a pre-built installer for your platform, install it, and make sure it’s on your $PATH. But, if you’re a Homebrew fan like me and prefer to install all of your packages with […]

voxel.js brings Minecraft-style games to the open web #

voxeljs

You’ve likely heard of Minecraft. If not, it’s this game about placing blocks to build anything you can imagine. It can also be about adventuring with friends or watching the sun rise over a blocky ocean (still neat). Needless to say it has a cult-like following.

After purchasing 2 copies of Minecraft for his nephews to play, Max Ogden started looking into the modding community of Minecraft to see how feasible it would be to do things like hook Minecraft up to OpenStreetMap.

Sadly, Max had this say about his findings.

I was disappointed to find out that not only is Minecraft closed-source but it also hasn’t shipped an official API (these are used to extend a programs functionality). Instead, if you want to change the way Minecraft works, you have to decompile the Java program that Mojang distributes and then reverse engineer it to make it do what you want. Despite these technical hurdles, due to the success of Minecraft there is still a huge modding community.

And this.

I have grown accustomed to the automated installation of modules that NPM provides and wondered if anyone had tried to make a package manager for Minecraft plugins. There are a few out there, but quite frankly they all reeked of Java (too many abstract interfaces, lots of boilerplate and hard to use build tools. Java was the first language I learned so I may very well be scarred from the experience) and were limited by the nature of decompiling as a workaround to Minecrafts lack of an API.

And this.

At this point I had decided that decompiling Java wasn’t in my future, so as any JavaScript programmer would do I decided to rewrite the entire thing in JavaScript. The fun part is that at the time (3.5 weeks ago) I had zero experience programming games. But I had google search and free time.

With that free time, Google, GitHub, an obscure subreddit called voxelgamedev, James Halliday (@substack) and his girlfiend Jessica Lordvoxel.js was born.

Instead of making a giant game framework, voxel.js is split into a bunch of small building blocks called modules. Modules can be installed with npm, which is much easier than the Java way Max mentioned earlier in his findings with Minecraft.

Here are some modules they’ve started working on:

  1. voxel-engine – this is the main module for building voxel games – you can plug any voxel module into the engine.
  2. voxel – the logic that generates voxel world data and compresses voxel data so that it can be efficiently rendered in 3D. voxel-engine uses this.
  3. voxel-mesh – takes voxel data from the voxel module and turns it into a three.js 3D Mesh that can be displayed in a game. voxel-engine also uses this.

There’s a ton of addons, tools and utilities listed on the voxel.js homepage as well as details on making your first game.

For the full story, read Max’s intro post on voxel.js, check out the voxel.js homepage, follow @voxeljs on twitter, and also hop into #voxel.js on freenode and say hi!

JWalk, a command-line JSON inspector #

Sometimes inspecting JSON files can be a huge pain, which is exactly why Nate Kohari is created JWalk, a tiny NPM package that makes JSON inspection incredibly simple. First we will need a file to work with, if you don’t have one, simply run this at the command line to get some of our tweets @thechangelog in JSON format.

> curl -G -d count=5 -d include_rts=1 http://api.twitter.com/1/statuses/user_timeline/thechangelog.json > sample.json

You will need node.js and NPM installed to use JWalk, but the setup process is simple:

> npm -g install coffee-script
> npm -g install jwalk

After installing jwalk, start up an interactive session (using our sample JSON file):

> jwalk sample.json

The command set is limited, but it amounts to exactly what you need for inspection:

  • cd: jump into a specific node
  • ls: view the contents of the current node
  • exit: leave the session

For example, if you want to see the text of the first tweet returned from our cURL:

> cd 0
> cd text
> ls

Bower is a package manager for the web #

I have yet to use this, considering I just found out about this project this evening. I had actually stumbled onto this project after stumbling onto Nicolas Gallagher’s little collection of utility CSS classes called SUIT.

When looking at SUIT, I noticed something different in its installation instructions bower install suit-utils which I found a bit odd cause SUIT is just a CSS library, not a Ruby Gem or something dynamic … so why the CLI install instruction?

Similar to Ruby’s Gemfile or Node’s package.json

Bower is a package manager for the web. But what does that mean? Similar to Ruby’s Gemfile or Node’s package.json, with Bower you can create a component.json file in your project’s root, specifying all of its dependencies.

Right now, when you are managing dependencies in your projects, such as JavaScript libraries, it’s all manual. Bower aims to change that.

Basically, Bower is a generic tool which resolves dependencies and locks down packages to a version. It runs over Git, and is package-agnostic. A package may contain JavaScript, CSS, images, or whatever and it doesn’t rely on any particular transport and lets you easily install those assets and manages dependencies for you.

Usage

Bower can install packages by name, Git endpoint, URL or local path. Here are a few examples:

bower install jquery
bower install git://github.com/maccman/package-jquery.git
bower install http://code.jquery.com/jquery-1.7.2.js
bower install ./repos/jquery

Build Status

For more details checkout Bower’s homepage or dive into the source code.

Jam – JavaScript package management for the browser #

Caolan McMahon, the creator of Async, has released a new project called Jam. After using this project for a short while, I can say this project has huge potential. It is a package management tool that allows you to install, use and compile (minify) JavaScript libraries. Jam is a browser-focused project that uses RequireJS (AMD Modules) to load your website’s requirements.

Installation is simple:

npm install -g jamjs

Likewise, installing libraries is easy:

jam install jquery

Finally, you use the RequireJS to include the libraries:

<script src="jam/require.js"></script>
<script>
  require(['query'], function($){
    console.log("jQuery loaded!");
  });
</script>

One of the coolest features is the compilation, which will package all (optionally a specific set) of your libraries with RequireJS and allow you to load the optimized library as one optimized file.

jam compile jam/compiled.min.js

Then include compiled.min.js instead of require.js, the rest works like before:

<script src="jam/compiled.min.js"></script>
<script>
  require(['query'], function($){
    console.log("optimized jQuery loaded!");
  });
</script>

If you have a library you would like added as a package, feel free to fork the project and add it in. If, in the process, you run into conflicts or issues with NPM’s package.json, Caolan wants to hear about it!

Head on over to the project page or browse the source on GitHub.

node-imageable: Image resizing middleware for Node.js #

Nifty image resizing middleware for Node.js that lets you manipulate remote images on the fly like so:

# resize an image with keeping ratio

http://localhost:3000/resize?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&size=200x200

# resize an image to given size without keeping the ratio

http://localhost:3000/fit?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&size=200x200

# crop a specific area of an image

http://localhost:3000/crop?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&crop=200x200%2B20%2B40

# crop a specific area and resize it with keeping the ratio

http://localhost:3000/crop?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&crop=200x200%2B20%2B40&size=100x50

# if secret is provided in config/config.json, all urls must have a hash following the resize method (see Hashing)

http://localhost:3000/fit/-hash-?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&size=200x200

# use the magic hash code that is valid for all requests, e.g. for testing

http://localhost:3000/fit/-magic-hash-?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&size=200x200

# append any fancy name for nice looking urls and image downloads

http://localhost:3000/fit/-hash-/Fancy-Ignored-Name.gif?url=http%3A%2F%2Fwww.google.com%2Fintl%2Fen_ALL%2Fimages%2Flogo.gif&size=200x200

The middleware ships with some basic logging and request tracking which you can extend with callbacks in your app. Check out the README or sample app for more.

node-querystring: Nested querystring parser for Node.js #

If you’re missing the Rails or Rack style nested query string parsing removed from Node.js in 0.3.x, check out the latest project from TJ Holowaychuk.

Node-Querystring can be installed via npm:

npm install node-querystring

Now you can handle those nested query strings with parse:

require('querystring').parse('user[name][first]=Elmer&user[name][last]=Fudd');
// => { user: { name: { first: 'Elmer', last: 'Fudd' }}}

A small module, but quite convenient. If you’re a user of Express or Connect, TJ just updated those projects to include the new bits.

[Source on GitHub]