Octopress blog post format look like this:

---
layout: post
title: "Setting ComVisible"
date: 2005-01-19 14:46:00
comments: true
categories: 
---

** This is my post using Markdown**

My BlogEngine.Net was configured to use xml files to store posts. Which look like this:

<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<post>
  <author>SebastienLachance</author>
  <title>Building a new app - Introduction</title>
  <description>The introduction</description>
  <content>This is ...

At first, I wanted to move each post individually whenever I could. After a week and pretty much nothing converted, I created a little .Net tool to make the conversion/migration much easier.

It’s a pretty basic windows form application that takes a path and output a bundle of simili-markdown (because the original posts are html, but, since markdown accept html, it’s fine) files that are compatible with the Octopress format.

It’s also generating a redirection.rb file that contains necessary code to be used by rack-rewrite to make necessary 301 redirection. It can be useful if you don’t want to write it all manually.

use Rack::Rewrite do

    r301 %r{^/post/The-surprising-science-of-motivation-by-Dan-Pink.aspx?$}, '/blog/the-surprising-science-of-motivation-by-dan-pink'
    r301 %r{^/post/Building-a-new-application-Introduction.aspx?$}, '/blog/building-a-new-application-introduction'
    r301 %r{^/post/tight-deadlines.aspx?$}, '/blog/tight-deadlines'
    r301 %r{^/post/no-such-file-to-load-cucumberrailsactive_record-(LoadError).aspx?$}, '/blog/no-such-file-to-load-cucumberrailsactive_record-(loaderror)'
    r301 %r{^/post/Buying-games-on-Steam.aspx?$}, '/blog/buying-games-on-steam'
    r301 %r{^/post/AlternativeToNet-review.aspx?$}, '/blog/alternativetonet-review'
    r301 %r{^/post/Excellent-post-by-Uncle-Bob.aspx?$}, '/blog/excellent-post-by-uncle-bob'

You can grab the source here : BlogEngineToOctopres

Jeudi dernier, avait lieu l’événement Startup Camp Québec.

Je ne suis pas un habitué de ces événements même si j’ai ma propre compagnie et ait participé à quelques coktails et diners aux homards (j’aime pas le homard). C’était quand un monde nouveau avec de nouvelles personnes.

Il y avait 8 startups qui présentaient leur produits. J’ai bien aimé les présentations, et j’ai beaucoup accroché sur quelques projets. Particulièrement le projet Trapèze École de MX4. Ils ont créer une manière de gérer les horaires dans les écoles, et ca, c’est ce que j’appelle trouver des solutions à un problème.

Mais le grand gagnant de cette édition est FateCraft, qui développe des jeux sociaux.

Je n’ai malheureusement pu rester jusqu’à la fin et voir la remise des prix. Mais je souhaite quand même bonne chance à toutes ces jeunes entreprises et puissent-elles continuer malgré toutes les embuches qui peuvent se présenter devant elles.

Basics

Previous experience:

I have no real hands-on experience. Only watched some screencasts.

I decided to create a little Todo app with Rails to make sure I understand the basics concepts correctly.

gem 'rails-backbone'
gem 'jasminerice'

bundle install

rails g backbone:install

In the spec/javascripts/spec.js.coffee, add the following:

#= require jquery
#= require underscore
#= require backbone
#= require backbone_rails_sync
#= require backbone_datalink

Creating a model

I created a todo.js file in the app/assets/javascript/backbone/models directory.

window.Todo = Backbone.Model.extend({});

Pretty straightforward.

Creating a collection

window.TodoList = Backbone.Collection.extend({
    model: Todo 
});

Testing to ensure everything is fine

To use jasminerice, start the rails server.

rails s

Go to localhost:3000/jasmine.

Creating a view

To define a view, you call the extend method on Backbone.View.

window.TodoList = Backbone.View.extend({});

A view is used ot render a model so we need to override the render method.

window.TodoList = Backbone.View.extend({
    render: function() {
      //the interesting part happens here.
    }
});

The view is represented by an html element, I believe it’s a div you don’t specify it explicitely like this:

window.TodoList = Backbone.View.extend({
    tagName: "section" //use a <section> tag
});

And a test to make sure it behave like I want:

it("should be a section tag", function() {
  var view = new TodoListView();
  expect(view.el.nodeName).toEqual("SECTION");
});

el represent the current view element.

In the render method, this is where you build the view markup, by appending one or more elements to the el.

render: function() {
  $(el).html('<h2>Todos</h2>');
}

//test

it("should render an h2 title', function() {
  var view = new TodoListView();
  view.render(); 
  expect(view.el.innerHTML).toEqual('<h2>Todos</h2>');
}); 

But this is not really doing anything really exciting. I would like to display each todo in this view. We will need a view for individual Todo model.

window.TodoView = Backbone.View.extend({
  tagName: 'li',
  render: function() {

  }
});

But how do we get a model into this view?

When you create an instance of the view you can pass a the model you will want to display. It will automagically added to the model property on the view.

describe("TodoView", function() {
  it("initialization accept a model", function() {
    var todo = new Todo();
    var view = new TodoView({ model: todo });
    expect(view.model).toEqual(todo);
  });
});

Now I’m pretty sure I can render something in my TodoView render method.

window.TodoView = Backbone.View.extend({ 
  tagName: 'li',
  render: function() {
    $(this.el).append(this.model.get('description'));
    return this;
  }
});

Now in my TodoListView I will loop through each Todo, render a view for each and appending them to the root element.

window.TodoListView = Backbone.View.extend({
  tagName: 'section',
  render: function() {
    $(this.el).html('<h2>Todos</h2><ul class="todo-items"></ul>');
    var listContainer = $(this.el).find('.todo-items'); 
    this.collection.each(function(todo) {
      var view = new TodoView({model:todo}); 
      listContainer.append(view.render().el);
    });
    return this;
  }
});

Next post: Adding and removing todos.

I have now officially started the development for my new web application. I will not go into details right now, since everything is to be made, and a lot of very important decisions are to be made.

What I can say is that it will be a Web Application running on Rails. I’m still struggling on whether to use PostgresSQL, MySQL or MongoDB.

One of the big design decision was the choice of the client-side framework. I know I wanted a rich and fast user experience and to use Javascript heavily. So, I decided to go with Backbone. And I have no experience with it apart from the Peepcode screencasts.

I have no idea how to apply it to my application domain. It will be hard, but worth it.

What is Backbone?

Backbone is a framework to create data-driven application in Javascript.

As much as I love CoffeeScript, I will not use it to learn Backbone.

I will use Jasmine for testing.

Why Backbone and not Knockout or any other javascript framework?

From what I heard, Backbone is hard to learn, but from those who use it, it’s totally worth a try. And I heard so much great things from a lot of different developers. They couldn’t be all wrong.

So let’s get coding. Expect another blog post later for the first impressions.

When we first made the Guide des Commerces, we didn’t anticipated we would need to adapt to other devices so soon. In fact, it we know it was for this year but we though it would be a completely different application for iPhone, Android or a new website.

A month ago we had a discussion with a Facebook expert and talked about adding the Guide to our existing page (just an iframe with the app). The problem is that we use fixed width everywhere and Facebook iframe has only 520px. It would not be wise to develop another site only for Facebook and another one only for mobile device. We needed another solution.

It occured to me that we could hit three birds with one stone (a lot more actually). We only have to use a responsive desig<

I tried various css framework and settled down for Skeleton. It provided me with everything I needed and I can almost use it as-is without any modification. It use Media Queries (link here) to adapt to various screen size (tablet, mobile, iOS, etc.).

If you don’t know Skeleton, it’s basically a grid framework with sixteen column totally a width of 960 pixel.

Suppose you have a div that you want to take 100% of the page.

<div class="sixteen columns">
</div>

You can also have a three column layout very easily:

<div class="one-third column">
</div>

<div class="one-third column">
</div>

<div class="one-third column">
</div>

When you resize your browser, everything just resize nicely.

I am almost 5 hours in now, and I’ve struggled a little but the result is amazing. And I frankly don’t regret the framework choice at all.

Stay tuned for more…

couldn't parse YAML at line 182 column 9 (Psych::SyntaxError)

As I understand it, there is an issue with the locale file (locale/en.yml) of ActiveSupport.

Just by adding

require 'yaml'
YAML::ENGINE.yamler= 'syck'

at the beginning of the boot.rb file should take care of this issue.

More info here and here

public class Category
{
    public virtual int Id { get; set; }
    public virtual string Name { get;set; }
    public virtual Category Parent { get;set; }
    public virtual IList<Category> Childs { get;set; }
}

And an action that return a list of categories as JSON :

public JsonResult Categories 
{
    return Json(GetCategories(), JsonRequestBehavior.AllowGet);
}

I know that it’s not pefect to use an NHibernate class instead of a view model, but it’s a very very small application and I’m trying to keep things clean.

Solution :

return Json(GetCategories().Select(c => new { c.Id, c.Name }), JsonRequestBehavior.AllowGet);

public class MessageMap : ClassMap<Message>
{
    public MessageMap()
    {
        Table("messages");
        Id(x => x.Id);
        ...
        Map(x => x.Order, "`Order`");
        ...
    }
}

no such file to load -- cucumber/rails/active_record (LoadError)

A simple fix is to simply reinstall cucumber :

rails generate cucumber:install

parseInt(‘’) == NaN //return false

isNaN(parseInt(‘’)) //return true

bundle install

I need to start somewhere and while it may not be the most informative post ever, I’ll try to cover this feature as much as I can. Everything here is already described in the Rails Api so it should be a great idea to keep it as a reference. I’ll also try to add what I have learned 

There are 4 methods in the sanitize helper.

strip_tags

Remove any html tags from your the input provided. If you truncate, you may see <a. strip_tags before you truncate.

strip_links

Remove any links from your markup and return only the text of the link

But while trying to download a file though it, I have encountered this error :

XML Parsing Error: undefined entity
Location: chrome://mozapps/content/downloads/unknownContentType.xul
Line Number 30, Column 18:    <description>&intro.label;</description

After a lot of googling I have managed to resolve this issue. This is what I have done :

1. Use XULRunner 1.9.0.4 or newer

If you’ve followed some tutorials you may have ended up using 1.9.0.0. Use 1.9.0.4

2. Use the Profile Directory

var profileDirectory = Application.StartupPath + @"\EmbeddedFirefoxProfile";
if (!Directory.Exists(profileDirectory))
{
    Directory.CreateDirectory(profileDirectory);
}
Skybound.Gecko.Xpcom.ProfileDirectory = profileDirectory;

3. Copy the chrome folder from the GeckoFX package into the chrome directory of XULRunner.

This will add 2 files to the existing chrome folder.

4. Add a bunch of preferences to greprefs/all.js

pref("browser.download.useDownloadDir", true);
pref("browser.download.folderList", 0);
pref("browser.download.manager.showAlertOnComplete", true);
pref("browser.download.manager.showAlertInterval", 2000);
pref("browser.download.manager.retention", 2);
pref("browser.download.manager.showWhenStarting", true);
pref("browser.download.manager.useWindow", true);
pref("browser.download.manager.closeWhenDone", true);
pref("browser.download.manager.openDelay", 0);
pref("browser.download.manager.focusWhenStarting", false);
pref("browser.download.manager.flashCount", 2);
//
pref("alerts.slideIncrement", 1);
pref("alerts.slideIncrementTime", 10);
pref("alerts.totalOpenTime", 4000);
pref("alerts.height", 50);

Conclusion

I hope it works for you. Happy GeckoFX programming!

For $47 you get :

• 60$ at Heroku
• 30$ at twilio
• 6 months of SendGrid’s Silver package (479$)
• 75$ credit at Recurly
• 4 months at HopToad
• 2 month at New Relic (400$)
• 60$ credit at MongoHQ
• 20 free hours of testing at SauceLabs
• 4 months at Infochimps
• And the best one : 60$ credit at Linode (which I buyed a subscription 2 days ago)

I am a big fan of Evernote. I used to put everything from personal notes to ebook in it. But, it became so slow it was a pain to open it just to add a little something.

But they released version 4 with a very BIG performance improvement. I will now be able to resume my Evernote’s normal usage.

I choose a Linode 512 (with Ubuntu 10.04 LTS) because we are not ready for full-scale deployment yet and did not wanted to pay for something we will not use fully for some time. The beautiful things is that we will be able to upgrade with no problems later on.

Installing everything and got everything running in less than 2 hours. And I was pretty new to deploying a Rails application with mysql on linux.

XP has a known issue when you are searching for text contained in files. Hopefully, there is a solution: http://support.microsoft.com/default.aspx?scid=KB;EN-US;309173