Joining TechStars

Only 1% of the companies that apply to TechStars get in, and this year Sandglaz was one of those lucky ones. It's our first week and we already feel that it's going to be a great opportunity and an awesome experience. We are meeting great people everyday. It is incredibly cool to be able to sit down and discuss our ideas and strategy with top CEOs, VCs, mentors and advisors.

The story of how we got in.

We applied. We didn't know anyone at TechStars and their website said they get 1000 applications and pick only 10. After doing the math we concluded our chances and slim to none. So we decided to put a maximum of 2 hours on the application and get back to work. We were already in business for more than a year, we had traction and early revenue. So even though we didn't put much effort into the application, we probably still had a lot of the right answers. We knew how to think of the startup, and our progress proved we can execute.

It was good enough to get their attention and to get invited to a TS4AD (TechStars for a day) event. They invited us on a Friday to an event taking place the following Wednesday in Seattle. We live in Toronto, we're poor and flights are expensive. We also had a new hire starting on Monday. After discussing it a bit, we decided one of us should fly there and the other can take care of the new hire. Zaid had air miles and I didn't so that pretty much made the decision. TS4AD is an optional event, but my guess is if Zaid didn't make it to the event and if he didn't meet Andy Sack in person, we wouldn't have been invited to the finalist interview.

TS4AD gave us the opportunity to discuss the business with key people, espeically areas of concern. This is really good, because it gave us the chance to see their reactions to different ideas and follow up with them. Every business has challenges, but I think it was important for TechStars to see that we know what our challenges are and have a logical approach of tackling them. We followed up with e-mails. TS4AD made us expand our idea and focus on a specific area.

A few days later we got invited to the finalist interview in Las Vegas. 40 companies got invited to the finalist interview and they select around 10. Our chances went up from 1% to 25%. Now it was worth it to drop everything and focus on the interview. We remembered the feedback we got on TS4AD, we researched the market of our "new" idea. We practiced with advisors in Toronto and we talked to several TechStars alumni. We prepared as much as we knew how.

The interview went well, and so we're here. It went well both ways, they liked us and we liked them. I left the interview thinking these people know what they're doing. Not all startup accelerators are the same. If you're thinking of joining one, assess them.

My first week

I love it. It's been one week, and its already everything I expected and more. The size and quality of the mentor network is unmatched. All the other startup teams have strong ideas and lots of passion; I look forward to getting to know them better. If I have any complaints, it would be we need more girls in the founding teams. This year there is 2 of us, which is an improvement from 0 in last years. At least we're moving in the right direction!

Only time will tell for sure, but I think TechStars will be good for Sandglaz. I will try to blog throughout the coming months. If you're thinking of applying to TechStars and want to hear more, subscribe to the blog.

Extracting Names and Email Addresses from a String

A common way for users to enter multiple email addresses is in a format like this:

emails = "first last <email1@example.com>, email2@example.co.uk, Name <email3@example.com>, <email4@example.com>"

One way to parse it is using a regex to identify all email addresses in the string. This will not validate the format, and it will ignore people's names:

matches = emails.scan(/(\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b)/i)

But say you want to extract the names too or guess them when they're not provided. For example, the emails below will be parsed as such:

first last <email1@example.com>
{:name => "First Last", :email => "email1@example.com"}
john.smith@example.com
{:name => "John Smith", :email => "john.smith@example.com"}
mary@example.com
{:name => "Mary", :email => "mary@example.com"}

def names_and_emails_from_multiple_addresses(emails)
   addresses = emails.split(',')
   addresses.collect do |address|
     next if address.blank?
     matches = address.strip.scan(/(\w[^<\>]*)<(\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b)\>\z|\A?\z/i)
     if matches[0] && matches[0][1]
       email = matches[0][1]
       name = matches[0][0]
     elsif matches[0] && matches[0][2]
       email = matches[0][2]
       name = matches [0][3]
     end
     if email.blank? || name.blank?
       return nil
     else
       {:email => email.downcase.strip, :name => name.gsub(/\./, ' ').titleize.strip}
     end
   end
 end

By design, it returns nil if the format is incorrect, and it's forgiving if you have extra colons.

Migrating from Webrat to Capybara

This post is a collection of tips and hints on how to migrate from Webrat to Capybara. I am assuming RSpec syntax in the examples.

Installation

gem install capybara

or add

gem capybara 

to your Gemfile and run 'bundle'.
Complete instructions are provided here

Changes in syntax

Selectors for the content of an element

before:

response.should have_selector("title", :content => "My Title")

after:

response.body.should have_selector("head title", :text => "My Title")

Update response is not a capybara object but an RSpec one used in controller specs, use page for integration tests.

Value of an input field

before:

response.should have_selector("input", :value => "input field value")

after:

response.body.should have_selector("input[value='input field value']")

Link with url and content

before:

response.should have_selector("a", :href => "/url/path", :content => "Link text"

after:

response.body.should have_link("Link text", :href => "/url/path")

Selectors cannot be nested

Instead you can use

within("div.container") do
  response.body.should have_link("Link text")
end

or just combine selectors one after the other in one big string

response.body.should have_selector("div.container a[href='/url/path']")

Note from Jonas Nicklas

If there are multiple divs with class container on the page, this will not work as you expect. within in Capybara differs from Webrat in that it only matches on the first found element, not on all found elements.

Annoyances and pitfalls

- failing specs don't show actual output instead you get a generic 'expected to return something'
- view specs completely ignore attributes such as "text" and "href". Embed the attributes directly in the selector instead.

Why Capybara

Capybara offers a lot more flexibility in what can be tested and how. It gives you the ability to choose drivers that can run javascript so you can test your web application end to end. I will include my favourite tips below

save_and_open_page

in your specs to view the page at any point in your spec execution as it is

Mobile driver

Capybara.register_driver :mobile do |app|  
   Capybara::RackTest::Driver.new(app, :headers => {'HTTP_USER_AGENT' => 'Mobile'})
end

now all you have to do is flag your spec with

:mobile => true

and they will run with the mobile driver.
Note:mobile => true will only work with RSpec. Use :driver => :mobile for all other cases.
_____________________
Thanks to Jonas Nicklas for clearing up some points.

jQuery tip: sanitize input fields

Many forms or web applications have some rich text inputs that allow some basic formatting using <b>, <i> and <p> tags for example. It would be a good idea in such cases to sanitize the input. Luckily jQuery makes it easy to come up with an elegant solution to this problem. Here's a recursive jQuery function that sanitizes the html contents of any DOM element:

$.fn.sanitizeHTML = function() {
  var $children = $(this).children();
  $children.each(function() {
    if ($(this).not("b").not("i").not("p").not("br").length > 0) {
      $(this).replaceWith($(this).text());
    } else {
      $(this).sanitizeHTML();
    }
  });
  return $(this);
}

Rails Tips: Friendly form error messages.

One of my pet peeves with the default display of error messages in Rails is the way everything is lumped together at the top of the form. What I would ideally like to see is the error shown right next to the field that has the data validation failing. This reduces the amount of scanning the user has to do. Thankfully this is easily fixed using a partial.

Let's first define a partial to display the error messages for a single field:

<%- object.errors[field].each do |e| %>
  - <%= e.titleize %>
<%- end %>

Now for each field in our form we can render this partial right above it. For example if we are rendering a form for an object of the Resource model and would like to display the error messages for resource.name, we would end up with the following:

<%= f.label "Name" %>
 <%= render 'shared/error_messages_for', :object => resource, :field => :name %>
 <%= f.text_field :name %>

Finally, we can add a message at the top of the form to indicate that the form has some errors requiring a user's attention:

<%- if object.errors.any? %>
  
Please correct the <%= pluralize(resource.errors.count, "error") %> below and resubmit.
  
<%- end %>

Time Management Series: How we manage our product backlog

In the previous post, I talked about the Urgent/Important grid in Software development. I also mentioned that inspired by it, we developed a new technique to manage our backlog, and I promised more details about it.

Recently, we published those details in a blog post here. Hope you enjoy the read!

Time Management Series: The Urgent Important Matrix in Software Development

Being great at time management means that you spend most of your time on the important things and not just the urgent. Important things are those that get you closer to your goals. They are things like spending time with the family, taking care of your health and working towards a career. Urgent things are those that require immediate action; they are things that stress you out but don't necessarily get you any closer to your goals.

The urgent important grid is a popular tool in time management that helps visualize the distinction. As urgency and importance are not correlated, you can divide your to-dos into 4 quardant; Important/Urgent, Important/Not Urgent, Not Important/Urgent and Not Important/Not Urgent as shown in the diagram.

This tool has wide applications, however since a good percentage of the audience of this blog come from a software development background, I will be drawing my examples from this field.

Important / Urgent Quadrant:

This is the quadrant of urgent bug fixes. Strive to keep this quadrant empty. Otherwise you will spend your time in a firefighting mode, and end up crashing into the Not Urgent/Not Important quadrant later on. In this quadrant you are patching code and not creating good quality software, and this will only cause you to spend more time here in the future. It is a vicious cycle!

Important / Not Urgent

This is where you want to spend most of your time. Working on what is important and having the time to do it properly. In here, you have the time to refactor code, to TDD, and to write some elegant designs. If you spend more time here you will spend less time putting together quick and dirty fixes for an important deadline (i.e. in the Important / Urgent Quadrant). This is where you are stress free, happy and productive.

Not Important / Urgent

Sense of urgency, but no real value. It includes some phone calls, some meetings, fake deadlines, and someone else's priorities. In many traditional companies, management would pull deadlines from thin air thinking this will motivate employees to work. However in practice it motivates them to do a half complete job that they will have to redo later.

Not Important / Not Urgent

After spending too much time in the Important / Urgent quadrant, you release stress with mindless activities. This includes surfing the net aimlessly, gossiping or watching television shows you normally don't follow. Leisure does not belong in this quadrant. On the contrary it belongs in the important / not urgent quadrant, because things like picking up a hobby and spending time with family and friends are important things that gets you closer to your personal goals.

Sandglaz is the only todo's web app with great support for this time management tool. The app starts you off with a 2x2 grid where you easily jot down your todo's in accordance to their importance and urgency, and it also allows you to create multiple grids in different sizes. You can check it out in private beta

Inspired by the important/urgent grid, we developed a new technique to managing a software product's backlog. In the next post I'll talk about how we do that. Stay tuned!