A tool to check your site for The Heartbleed Bug #

A very nasty OpenSSL bug called Heartbleed was made public yesterday. Millions of websites around the world are leaking private information despite using SSL/TLS.

Is your site vulnerable? Find out with Filippo Valsorda’s Heartbleed Test.

Here’s a link to our test for thechangelog.com. We run on Ubuntu so we followed these update instructions and in 3 minutes we were fixed.

Remediation steps differ depending on operating system, but with Heartbleed Test we can all make sure we’ve patched up properly. Thanks Filippo!

UPDATE: Filippo provides a web-based tool to check your site, but we suggest downloading the source and running the tool from your own trusted host. Here’s a How To if you need help! (Thanks to AndrĂ© Wendt for the suggestion and Jan Lenhardt for the gist)

ngxtop: real-time metrics for nginx server #

ngxtop is shaping up to be one of those tools that I didn’t even know I needed, but now I won’t know how I ever lived without it.

ngxtop parses your nginx access log and outputs useful, top-like, metrics of your nginx server.

Need we say more? Check the readme for some nice examples of what this Python script is capable of.

Increase Productivity by Building Your Muscle Memory

If you’re learning Git, Vim, the infamous command-line, or a new syntax — the early stages of learning can seem frustrating. Typically, the challenge is not having an understanding of the core concepts of what you’re learning. End that frustration and learn to grow your muscle memory.

8 Sass mixins you must have in your toolbox #

Regardless if you’re using Compass, Bourbon, or you’re going full vanilla — these 8 Sass mixins are certainly among the top mixins needed.

Some of the mixins are included in Compass, but since I prefer not to use Compass in my projects, I decided to write them myself. So, here are the 8 mixins I think every developer should have in their toolbox.

Setting a rem font size with pixel fallback is priceless.

Keep an Eye on your processes #

If you aren’t happy with the current process monitoring tools out there, check out Eye. It uses Celluloid to provide multi-threaded process monitoring that behaves very similarly to Bluepill. One valuable addition is the ability to get more information about the processes running:

$ eye i(nfo)
test
  samples
    sample1 ....................... up  (21:52, 0%, 13Mb, <4107>)
    sample2 ....................... up  (21:52, 0%, 12Mb, <4142>)

Other bonus tools include debugging configurations and tailing the logs of the processes being monitored.

Wry brings App.net to the command line #

Ever wish you could keep tabs on your App.net stream but hate the thought of having one more client to check? What if you could keep up right from your terminal window?

----------
Rob Warner (@hoop33) (258)  You
I'm working on PM support for Wry this weekend :-) #wry
ID: 5557218 -- 2013-05-11T12:04:10Z
----------

Wry is a command-line tool for Mac OS X 10.7+ that solves that problem by bringing App.net to the command line. Installing Wry couldn’t be easier especially if you’re using homebrew.

First run this to make sure everything is up to date.

$ brew doctor

Next, simply type:

$ brew install wry

In seconds you’ll have Wry installed and can add authorization

$ wry authorize

Copy and paste your authorization code from the App.net website and you’re done. Yes, it’s that simple. You can also download and install the zip file yourself.

Once it’s installed, type wry to see a list of supported commands.

The wry commands are:
   authorize   Authorize with App.net
   block       Block a user
   commands    List available commands
   delete      Delete a post
   download    Download a file
   find        Finds users
   follow      Follow a user
   followers   List the users following a user
   following   List the users a user is following
   global      Display the global stream
   help        Display help
   ls          Get a file listing
   mentions    Display the mentions for a user
   mute        Mute a user
   muted       List the users that a user has muted
   post        Create a post
   posts       Display a user's posts
   read        Read a post
   replies     Display the replies to a post
   reply       Reply to a post
   repost      Repost a post
   search      Search for hashtag
   star        Star a post
   stream      Display the current user's stream
   unblock     Unblock a user
   unfollow    Unfollow a user
   unified     Display the current user's unified stream
   unmute      Unmute a user
   upload      Upload a file
   user        Display information about a user
   users       Manage the users you've authorized on this computer
   version     Display version information

The list of commands supported by Wry is impressive. After reaching out to Rob, to let him know how much I enjoyed using it, he told me that private messaging and patter room support was released with version 1.5. Just an added bonus to an already great tool.

Check out Wry on github and follow author Rob Warner (@hoop33) on App.net or Twitter.

Special thanks to Dennis Keefe, writer of The Common Geek, for pointing it out.

Xray-rails reveals which files are being rendered in your view #

When I pair with Railsbridge attendees or new developers, I often wish I had a visual way to let them see the connection between the files in the codebase and what’s rendered in the browser. Today Ruby 5 featured Xray and a number of friends contacted me about checking it out. In no time I knew I’d found the solution.

I gave it a test drive on one of the student apps and it took 5 minutes, at most, to get up and running.

Just drop this in your Gemfile:

group :development do
  gem 'xray-rails'
end

Bundle and delete the cached assets:

$ bundle && rm -rf tmp/cache/assets

Restart your app, visit it in your browser, and press cmd+shift+x

xray-rails

By far the best feature in Xray is the fact that it allows you to actually click on the overlay and go straight to the file or partial being rendered. It defaults to Sublime, which is easy for new users, but is simple enough to customize to another tool for seasoned pros.

Xray is great for:

  • Helping new Rails developers while pairing to get clearer understanding of views
  • Gaining quick insight into complex views
  • Debugging templates, partials, and backbone views

See Xray in action

Right now Xray is a tool for the Rails framework but there are plans to expand and make it available for any framework. You can check it out on Github.

Groundkeeper removes forgotten console and debugger statements from your JavaScript files #

If you’re like me, you forget things. It happens.

More specifically, when working on my JavaScript skills I forget to remove console.log statements used for testing in development when pushing code to production. groundkeeper removes all those forgotten console and debugger statements from your code for you.

Here’s a simple before and after…

Before:

function helloWorld () {
  // Log out to console
  console.log("Hello world!");  
}

helloWorld();

After:

function helloWorld () {
  // Log out to console

}

helloWorld();

Check out the source for installation and usage details.

Deploy Meteor apps to your own server with Meteor.sh #

Meteor.sh is a nice little tool to setup a meteor server and deploy to it. It was written by Simon Ernst because:

Deploying to custom servers should be as simple as everything else in Meteor.

It’s really easy to use, just move meteor.sh into your projects directory. Next, open it up in your favorite text-editor and change the APP_NAME and APP_HOST variables. That’s it! You can now run the shell script from your command line to deploy your code!

Checkout the source or Discuss this on HackerNews.

SlowmoJS executes JavaScript in slow motion #

Atul Varma describes his SlowmoJS as “an attempt to make learning JavaScript and computational thinking easier by making the execution of JS code more transparent.”

You give SlowmoJS a chunk of code and it shows each logical step of the code executing while highlighting the interesting bits and displaying the results.

I pasted in Ed Spencer’s FizzBuzz in a Tweet (slightly modified for brevity) and the resulting display is pretty cool. See for yourself.

The project’s source code, design notes, and implementation notes are available on GitHub.

Multi-user tmux made easy with wemux #

Two of the many things in the development community that are growing in popularity are remote work and pair programming. Traditionally, pairing meant you had two people looking at the same computer and one person doing the typing. This is great, as long as you are in the same room.

What about those developers, like myself, who rarely (if ever) find themselves in the same room as their coworkers? Enter wemux by Matt Furden, the tmux tool that makes it simple for multiple users to connect to the same tmux session so you can see the same thing.

The only requirement, according to the README, is tmux >= 1.6. Installation is simple, with the preferred method being Homebrew:

>> brew install https://github.com/downloads/zolrath/wemux/wemux.rb

After installation, you — the host — would start a new wemux server:

>> wemux start

At this time, anyone else — the clients — could connect with any of the following three commands:

  • wemux mirror – attach to the server in read-only mode.
  • wemux pair – attach to the server in pair mode, where both the client and the host can control the terminal.
  • wemux rogue – attach to the server in rogue mode, where the client and host can work independently of eachother.

There are plenty of other features, from listing users to running multiple wemux servers at once. Once you get the hang of it, pairing while working remotely becomes much simpler than screen sharing on Skype!

You can find out everything you need to know in the README or discuss this post on HackerNews.

On GitHub and Workflows #

One of the best things about git is that it allows you to do whatever you want.

One of the worst things about git is that it allows you to do whatever you want.

This has lead to a bunch of different ‘workflows’ for managing an open source project. I remember when “Git Flow” hit the scene, and everyone was mega-excited by it. Then, GitHub themselves fired back with “GitHub flow,” which was a bit simpler and talked about how they handle things.

Here’s Yet Another Entry into this ongoing saga: “On GitHub and Workflows” Basically, it’s somewhere in between the two: you have three branches, representing production, staging, and development. On top of development, you work like GitHub Flow, and when things go from development -> staging and staging -> production, there’s an opportunity for a last code review.

As a bonus, there’s a little script at the bottom for making pull requests from the command-line with hub. Neat! We originally saw this from this tweet by @moo9000.

Scriptular is an interactive editor for JavaScript regular expressions #

Rubular fans, rejoice! Jonathan Hoyt has ported the much-loved Ruby regular expression editor to JavaScript.

The result is Scriptular, which provides a simple way to test JavaScript regular expressions as you write them. Scriptular shares many of Rubular’s features. It:

  1. Lets you test multiple strings at once
  2. Displays match results
  3. Includes a handy quick reference
  4. Provides shareable permalinks

Jonathan describes Scriptular as a clone of Rubular, but this clone boasts a killer feature that the original does not: it is open source and MIT licensed!

Give the tool a try or check out the repo on GitHub.

Ghost means never having to touch ssh/config again (either) #

As a throwback to our original coverage of Ghost back in 2010, I wanted to share a hidden feature I just discovered in Ghost.

Two years ago Felipe Coury submitted a pull request to add ghost-ssh to manipulate ~/.ssh/config files. If it weren’t for Google pointing me to this pull request, I would have never known ghost-ssh existed. The readme says nothing about it!

This is what Felipe had to say when he submitted his patch:

I had a need to manipulate ~/.ssh/config file the same way I can manipulate my hosts entries, so I made this change.

Not sure if it will be useful for the upstream project, but be welcome to merge if you like.

An intro to ghost-ssh

Just like with ghost on the command line, ghost-ssh has basic list, add, and delete options, as well as an import operation to import files.

To save you some time, here’s the contents of ghost-ssh --help:

$ ghost-ssh --help
USAGE: ghost-ssh add <host> <hostname> [--user=<user>] [--port=<port>]
       ghost-ssh modify <host> <hostname> [--user=<user>] [--port=<port>]
       ghost-ssh delete <host>
       ghost-ssh list
       ghost-ssh empty
       ghost-ssh export
       ghost-ssh import <file>

An example of adding a new entry to your ssh/config might look something like this:

$ ghost-ssh add tclprod xxxxxx.gridserver.com --user=tcladmin
  [Adding] tclprod -> xxxxxx.gridserver.com

You can confirm the entry was added to ssh/config by running the ghost-ssh list command:

$ghost-ssh list                                             
Listing 1 configs(s):
  tclprod -> tcladmin@xxxxxx.gridserver.com:22

Now that I have this new entry in place, I can easily ssh into the server by running ssh tclprod and boom goes the dynamite!

Checkout the source for Ghost on GitHub for install and usage details.

Discuss on Hacker News if you’d like.

Using ImageOptim with guard-shell

For the uninitiated, ImageOptim is a great Mac app that uses several well-known image optimization tools to compress images and help keep file sizes down and Guard is “a command line tool to easily handle events on file system modifications.” If you’ve never tried Guard, I’d encourage you to take some time and check it […]

dom-monster: Cross-browser bookmarklet to analyze your DOM, improve performance #

Thomas Fuchs, JavaScript pro featured recently on Episode 0.3.9 has teamed up with his wife Amy Hoy to bring you the DOM Monster, a cross-browser bookmarklet that analyzes your markup and offers tips to improve page performance.

Screenshot

Other tools such as Y! Slow provide similar analysis and integrate with Firebug, but the DOM Monster aims to be a cross-browser solution. Got ideas to improve the project? Check out the project source and submit a patch.

[Source on GitHub] [Homepage]

Cloud9: Node.js-powered IDE in the Sky #

Cloud9 screenshot

The Ajax.org Team has finally unveiled Cloud9, their much anticpated IDE-in-the-sky. Cloud9 runs on a stack of Node.js, HTML5, and their own Ajax.org frameworks which Ruben and Rik discussed in Episode 0.1.6.

Features

Although an early alpha, Cloud9 looks polished and includes a number of cool features:

  • Easy hackability for Javascript developers
  • At least as good as existing IDE’s and text editors with help from the latest browsers
  • Local and remote file and repository integration
  • Debugging support for Chrome / NodeJS
  • Test and deploy your code in the cloud

To kick the tires yourself, you’ll need Node.js installed. You can then clone the repo and run the install script for your version:

$ bin/cloud9-osx64
$ bin/cloud9-lin32
> bincloud9-win32.bat

On the Mac, the script automatically starts the server and opens Cloud9 at http://localhost:3000.

[Source on GitHub] [Homepage] [Follow Cloud9IDE on Twitter]

terminitor: Automate your terminal workflow on OSX #

As developers, we live in the terminal, often in several tabs per project for tasks like application consoles, database interfaces, or monitoring test output.

If you’re on OSX, Arthur Chiu from the Padrino team wants to make your life a bit easier. Terminitor lets you define workspaces and workflows for projects, allowing you to script the setup of Terminal.app tabs that automagically unfold when you sit down to work on a project.

Terminitor is installed via RubyGems

$ gem install terminitor

You can then set up your environment and set up your .terminitor folder in your $HOME folder.

$ terminitor setup

To define a new workspace, use the open command

$ terminitor open my_app

Which you can then edit in your system editor:

# ~/.terminitor/my_app.yml
# you can make as many tabs as you wish...
# tab names are actually arbitrary at this point too.
---
- tab1:
  - cd ~/projects/my_app
  - rails c
- tab2:
  - mysql -u root
  - use my_app_development;
  - show tables;
- tab3:
  - cd ~/projects/my_app
  - open http://thechangelog.com
  - autotest

Git Extras: Helpful tools for Git #

If you’ve ever been working heavily on a project that uses git, you’d know, that sometimes it’s good to have a few extras to help you out, and that’s what TJ Holowaychuk’s recent project git-extras provides!

Currently git-extras includes:

  • git summary
  • git changelog
  • git commits-since
  • git count
  • git delete-branch
  • git delete-tag
  • git ignore
  • git release
  • git contrib
  • git repl

Most cover tasks such as counting commit contributions, or viewing commits based on time, others include changelog generation based on commits and quickly adding items to the .git-ignore file. The extras are also quite easy to install, just clone the repository, then [sudo] make install.

[source on github]

GithubFinder: JavaScript-powered Github repo browser #

For those times you need to quickly browse a GitHub repo but don’t want to clone it locally, check out GitHubFinder from Alex Le.

Screenshot

Modeled after the Mac OSX finder, GitHubFinder provides a familiar drill-down navigation to browse all the files in a given repo. The project has a plugin-based architecture for extensibility and includes keyboard navigation, file diffs, basic syntax highlighting, and a resizable, panel-based interface out of the box.

Written in JavaScript as part of the 10K Apart Contest, the app uses the same JSONP API we use here on The Changelog and weighs in at just 8.5KB compressed. Bravo, Alex!

[Source on GitHub]

Lemonade – Generates sprites on the fly with Compass and Sass #

One of the best ways to optimize your stylesheets and improve your site performance is to use CSS sprites. A CSS sprite is the technique of stitching together many images into a larger image and managing the placement using CSS background positioning. The upside is you save many network calls for your image assets. The downside is the complexity of creating the sprite.

Enter Lemonade from Nico Hagenburger. Lemonade is a Compass plugin that creates CSS sprites on-the-fly without Photoshop or ImageMagick.

To install, just install the gem:

sudo gem install lemonade

and then add the plugin to your Compass config:

# in config.rb
require 'lemonade'

You’re then all set to start creating sprites in your Sass:

.logo {
  background: sprite-image("lemonade/lemonade-logo.png");
}
.lime {
  background: sprite-image("lemonade/lime.png");
}
.coffee {
  background: sprite-image("other-drinks/coffee.png") no-repeat;
}

which yields

.logo {
  background: url('/images/lemonade.png');
}
.lime {
  background: url('/images/lemonade.png') 0 -26px;
}
.coffee {
  background: url('/images/other-drinks.png') no-repeat;
}

Nifty. Check out some advanced features on Nico’s blog post.

Technically, a better name might have been Lymonade, but this project is refreshing just the same.

[Source on GitHub]

JSCouch – Learn CouchDB queries in your browser #

Part CouchDB interactive query console, part tutorial, JSCouch is a neat way to learn CouchDB’s map/reduce functions right in your browser. You can provide some sample JSON (or use the default demo data), write your map and reduce functions, and execute them to see sample results.

JSCouch also includes some sample functions for those learning CouchDB. Just choose a function from the list and read the explanation provided.

Hat tip: Will Leinweber

[Source on GitHub] [Demo]

Snapbird – Twitter search on steroids #

If you’ve ever spent time looking for a long lost tweet and have gotten frustrated by the short window that tweets are indexed by Twitter Search, then check out Snapbird from Remy Sharp of jQuery for Designers fame.

Snapbird lets you search someone’s timeline, favorites, or your own direct messages without the 7 day Twitter Search restriction. It even lets you permalink favorite queries.

Snapbird also uses Twitterlib, Remy’s JavaScript Twitter API wrapper.

Snapbird is open source so you can either use the hosted version or fork the project and run your own.

[Source on GitHub] [Homepage]