Hashrocket Articles

Dotmatrix: The Hashrocket Dot File Repo

Tue, 21 May 2013 00:00:00 +0000

At Hashrocket we love our tools and pride ourselves on being good at using them. One way we go about getting good with these tools is by customizing them with some great configuration. Dot files are used by many programs to configure behavior and sharing these dot files on GitHub is a nice way for developers to have a consistent development environment.

We share our dot files in a project called Dotmatrix. Its been around for quite a while and been contributed to by many current and former Rocketeers. It's the distillation of the taste of quite a few very picky programmers. It's easy to install, upgrade and use all or just parts of it and there's lots of cool stuff in there even if you just want to read through it a little.

What is Dotmatrix?

Dotmatrix is really two things:

A vehicle for keeping a set of dot files in sync
Version history of the contents of these dot files

It's the thing you use to install and upgrade a set of dot files and it's also a git repo of those actual dot files. Some of it concerns the installation and upgrading of these files and the rest of it is those actual dot files.

Local Versions of A Dot File

Every program is different, but for the most part, they have a load order for their configuration. Most support both a config file and a local version. Take your Z shell config--its specified in this file: ~/.zshrc, but if you have a file called ~/.zshrc.local, that local file will get a chance to override the normal version.

The bottom line is that you can inherit configuration in the ~/.zshrc and then have your local modifications in ~/.zshrc.local.

Before You Install Dotmatrix

It's likely that you already have some configuration in your dot files, so before you install Dotmatrix, pull that configuration into a local version. Better yet, create a repo of those local dot files!

For example, if you already have some configuration in your ~/.zshrc file, but want to use Dotmatrix, then move your file to a local version:

$ mv ~/.zshrc ~/.zshrc.local

Take a look at the list of files in Dotmatrix and then look at your own configuration to see which files you'd like to maintain a local version of.

Installation

Installing Dotmatrix on a brand new machine is easy. Start by cloning the repo down, maybe in a ~/Project folder or something like that:

$ git clone git://github.com/hashrocket/dotmatrix.git

Then just go into that directory and run bin/install.

This installer script will respect local versions of dot files and then create symlinks to its set of dot files.

If a given dotfile already exists, then that particular file will NOT be over-ridden. On the one hand, this is nice because you can't accidentally lose something, but it also means that you wont get some of the goodies in dotmatrix if you unwittingly leave a dot file around, so pay attention to the output to ensure it's doing what you want.

Upgrading

To upgrade your dotmatrix install go back to the folder where you cloned it and run bin/upgrade. It will fetch the latest and greatest from the GitHub repo and then run the installer script all over again.

For Vim Users

Another big part of Dotmatrix is the Vim setup that's been built-in. To get this part, after an install or upgrade run this:

$ bin/vimbundles.sh

We use a LOT of Vim plugins and this will grab those and get you all set.

Partial Install

Maybe you'd like to just grab some of the files in Dotmatrix, maybe just our Git shortcuts, for example--no prob, just do a partial install!

This is great for those that are new to Dotmatrix and want to just check out some part of it, here are some partial installs that might work for you:

Just Git Config

Create a file called FILES in the Dotmatrix folder with just this line:

.gitconfig

This will get you our Git aliases and some other cool configuration.

Just Vim Config

To grab just the Vim parts of Dotmatrix, create that same FILES file in the Dotmatrix folder and have this in it:

.vim
.vimrc

And then be sure to run the bin/vimbundles.sh command.

Just ZSH Config

Maybe you've heard great things about Z shell and want to try it out--no prob, grab our ZSH config and you'll be glad you did. Put this in the FILES file:

.hashrc
.zsh
.zshrc

Don't forget to run chsh -s /path/to/zsh too--that's what switches your shell.

Under Active Development

So, that's Dotmatrix--give it a spin and I think you'll find some great stuff. One last thing to note is that this project is fairly active, so be sure to upgrade often for the latest goodies!

Start contributing to open source

Tue, 07 May 2013 00:00:00 +0000

Open source software can be an intimidating and scary world to the up and coming developer. You pop open a gem you’ve been using and try to follow along with the code but to no avail. It’s far too advanced (or poorly written) for your newly developed skill set. No worries, we were all there once and we still need your help.

Before you dive into your first open source project you should be familiar with Git. You probably had a brief introduction to Git while working through the Ruby on Rails Tutorial. As a refresher, CodeSchool has some excellent git intro courses. You should also checkout Hashrocket's video ‘Feature Development with Git Branching’. Once you have the basics down you're ready to jump in.

So where do you start? Browse Github. Look for something that you’re interested in. A gem that you used? A project you heard of? Something you’ve been wanting to try? Once on a projects Github page, click the ‘issues’ tab. Do you see any problems that you would like to tackle?

A couple great ways you can contribute are through documentation and tests.

Documentation

Did you run into any problems using a gem in your passion project? Was it because you didn’t understand how to configure something? Maybe the outdated documentation needs an update. Documentation is something that is always needed, appreciated and It’s a great foot in the door to the world of open source. Open the README (or similar file) and start adding the steps you had to complete to get the project working correctly.

Tests

Open source projects often start as toy’s with broken or insufficient testing. As the project’s grow in size from the addition of other user’s requirements, the need for better tests becomes more and more apparent. Testing other’s work is also a great way to understand bizarre looking code. The spec your writing will help you develop your programming skills and add value to the project. Now that you understand what the code is doing and have tests around it, are there places you could improve the code?

A few general things to remember as you are writing your code:

Make small, explicit git commits. Some projects will have contribution guidelines.Please read them and stick to them. If the project doesn’t have any contribution guidelines, look at older commits and try to follow the general pattern.
If you are writing code, please test it. No one likes to accept an untested pull request. It’s scary.

When you have completed your contributions on an appropriately named feature branch, push them up to Github and put in a pull request. Be ready to answer questions about your code from the original repositories maintainer. Explain the issue you ran into and how you went about fixing them. Don’t worry if your pull request isn’t accepted. Ask the maintainer if they have an idea for a better solution to fix the problem or what they didn’t find acceptable about the code you wrote. This is a learning process and because you have been using version control, going back and refactoring is a stress free process.

If you're looking for some projects to get started on then Hashrocket has numerous open source projects for you to look into. Decent Exposure, Fabrication, Authem and Paratrooper are a few of the currently maintained open source projects. If you are unable to find anything there then checkout RailsApps by Daniel Kehoe. He's put together quite a few example rails apps for people to use as they see fit. The repositories there are wonderfully well documented and most of the apps could be built upon or better tested. It’s the first place I got my hands dirty writing open source. Last but certainly not least is Code Triage. Code Triage has collected a large amount of open source projects looking for contributions.

Would you like some help on your own open source project? Please leave your Github url in a comment below.

Book Club with Sandi Metz

Fri, 03 May 2013 14:21:00 +0000

May is here and it's time for book club! Read Practical Object-Oriented Design in Ruby this month with the Rocketeers and submit your questions for a community-driven interview with author and Ruby Hero Sandi Metz! We're very excited to spend the month with Sandi's buzzworthy book and hope you are too.

What's this book all about?

From the POODR website:

Practical Object-Oriented Design in Ruby is about how to write object-oriented code. It was written by an everyday programmer and it explains object-oriented design (OOD) using realistic Ruby examples.

OOD is not a mysterious black art that’s impossible to understand, it’s just stuff you don’t yet know. POODR is a practical, readable, and understandable introduction to how OOD can lower your costs and improve your applications.

If your code is killing you and the joy is gone, POODR has the cure.

How do I submit my questions for the interview?

Write your questions in a Github gist. Tweet the gist URL to @hashrocket with the hash tag #hrbookclub. We'll publish the interview at the beginning of next month. Submit your questions now through Friday, May 24th 2013 for inclusion in the interview

We look forward to your questions and happy reading!

Using SASS To Be Responsive and Retina-Ready

Fri, 26 Apr 2013 15:00:00 +0000

Responsive design is much more than just a buzzword and a loosely-organized set of principles – it's a design technique that requires you to approach almost every problem differently than a traditional website. It's also a pain to code. We're neck-deep in a new Hashrocket site design that's fully responsive and uses retina assets – and from that project (and others like it) we've ended up with a pretty solid starting point for tackling those requirements:

Get iOS to Behave Responsively

There are two crucial lines of code you'll need to make pretty much anything responsive work properly: a meta tag and a webkit tag.

Put this in your <head>:

%meta(name="viewport" content="width=device-width, initial-scale=1")

This just tells the viewport to conform to your device width (so you don't have landscape mode appear larger than portrait mode, for instance) and scale properly. Some Googlings of this technique also might result in code recommendations to add in a maximum-scale value; this disables pinch-zooming and usually isn't necessary.

Put this in your Sass (or SCSS, whatever):

body
    -webkit-text-size-adjust: none

You probably know this one - it prevents iOS from sizing up your text for readability. If your site's properly responsive, you're taking care of font size with @media queries.

The Viewport Width Mixin

Here's our mixin for keeping ourselves sane in the world of media queries. (This one and others require a newer version of Sass that supports passing content blocks to mixins; you should be using that anyway.)

= max-width($width: 640)
    @media screen and (max-width: #{$width}px)
        @content

Easy as pie. Just set the $width value to whatever you decide is your primary site breakpoint, and add others as necessary. This lets us write rules quickly and read them easily:

.foo
    margin: 60px
    +max-width
        margin: 40px
    +max-width(480)
        margin: 20px

The Retina Mixin

Retina backgrounds are their own set of @media-based pain. Here are a pair of mixins that made our lives easier:

= retina
    @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-device-pixel-ratio: 2)
        @content
= retina_bg($filename, $dimensions: false, $ext:"png")
    background-image: image-url("#{$filename}.#{$ext}")
    +retina
    background-image: image-url("#{$filename}@2x.#{$ext}")
    @if $dimensions != false
        background-size: $dimensions

The retina mixin is just generally helpful; the retina_bg mixin is absolutely essential. With retina_bg, we can write our retina background image styles in one line:

.bar
    +retina_bg("logo", 100px)

Now non-retina devices use logo.png, while retina uses logo@2x.png, like the iOS filename convention. It's worth noting that background-size isn't always necessary, so it's behind a conditional and just doesn't assign if it's not specified.

Take Care Of Yourself Out There

I sincerely hope this post is useful to you and isn't just adding to the noise of @media tips that are out there these days. If you start with these pieces, you'll be well on your way to writing responsive styles that don't muck up the rest of your CSS and help you keep all those widths & ratios sorted.

Where In the World are the Rocketeers?

Mon, 25 Mar 2013 10:30:00 +0000

This year's conference schedule is in full swing and there are many opportunities to get engaged in the Ruby community both in the States as well as abroad. Whether you are looking to attend a regional conference, or want to venture a little further, you will most likely run into a Rocketeer or two. So get out, get engaged, we'd love to meet you!

Ancient City Ruby

April 4-5 | St. Augustine, FL

Hashrocket is organizing its first Ruby conference in sunny Florida, and we invite everyone to attend. The historic city of St. Augustine provides a unique setting to discover knowledge in the Ancient City. Attendees will be treated to a variety of perspectives on topics ranging from the philosophy behind software to Test Driven Development. The lineup includes notable speakers including Jim Weirich, Sandi Metz, Avdi Grimm and Russ Olsen. You don't want to miss this one so make sure to register before it's too late!

RailsConf

April 29 - May 2 | Portland, OR

In 2013, the largest gathering of Ruby on Rails developers in the world returns to Portland. RailsConf promises to be one of the highlights of the year as it spotlights the latest in innovations within the Rails community. The conference draws developers and companies from around the world to connect and learn about new products as well as the tools of the trade.

Rocketeers Attending

Scottish Ruby Conf

May 12-13 | Perthshire, Scotland

Scottish Ruby is a premier Ruby conference in the UK and provides a unique perspective on the techniques of the software craftsman. The venue has changed this year but the conference is guaranteed to deliver.

Rocketeers Attending

Cameron Daigle (speaking)

MagmaConf

June 5-7 | Manzanillo, Mexico

MagmaRails is now MagmaConf! MagmaConf is a web development conference that covers cutting-edge topics in Ruby, Ruby on Rails, frontend, and other web technologies. This is one of the most important web development conferences in Central America and it's a chance for engineers from around the world to meet and experience Mexico.

Rocketeers Attending

Johnny Winn (speaking)
Vic Ramon

Madison Ruby

August 23-24 | Madison, WI

Want to discover a hidden gem in the Ruby community? Madison Ruby is a showcase to the locals and a chance for visitors to experience a true gem of the community. On the 22nd attendees have a chance to partake in pre-conference workshops.

Rocketeers Attending

Check back later this summer to see where you'll find the Rocketeers in Fall 2013!