We recently started work on a new iPhone app and wanted to promote the app and find out who is interested in trying it out. Now that we’ve made progress on the app privately, it seemed like a good time to start collecting email addresses from the public. Having a landing page with a simple form that collects email addresses is not new, however I looked for a Ruby implementation and didn’t find one. Having a application like this would be useful to me and others so it seemed like a good fit for an open source project. Wufoo or Google Docs forms are an option as well, but offer less control over the presentation.

I asked my business partner and if he’d be interested in designing a generic version, then another we’d customize for Bus Brain. I had in mind making a short and sweet Sinatra 2-screen app to deploy on Heroku and start collecting email addresses. We built the idea, named it “Notify Me” and Notify Me is now available on GitHub! We customized “Notify Me” for our own use with Bus Brain and maintain that code as a fork of the original. Both the example site for Notify Me and the Bus Brain version are live and running on Heroku.

Sinatra

Sinatra is a great Ruby framework that is very fast to develop with and easy to deploy on Heroku. I decided to store the addresses in a traditional RDBMS (as opposed to Redis for example) since storage in the DB is free on Heroku, and the technology is well-understood. I used the Sequel ORM to make the code a little cleaner and avoid writing SQL that didn’t work with both SQLite and PostgreSQL. There is even a basic test for the project that uses Rack::Test to hit a couple controller actions and look for specific markup or text.

Haml and Sass

Haml and Sass are great replacements for Erb and CSS. Originally Notify Me used both of these with separate haml and sass source files. I decided that as an open source project that prioritizes simplicity, Notify Me may be used by more people if it used plain HTML and CSS, and kept the layout and templates in the same Sinatra app file. Other than images and JavaScript, the model, view, and controller code for Notify Me is in a single file.

Design

My colleague Nate made great designs for both the generic version and the Bus Brain versions. For building the designs, we tried to use as much CSS3 as possible to avoid images and make customizations easier. We’re using CSS3 for buttons thanks to ZURB, and for shadows and highlights. We published the Photoshop document for the generic version as well.

Heroku

Heroku is really the secret sauce since it allows anyone to make a server and host Notify Me for free. I had Heroku in mind from the beginning and worked on writing detailed instructions on the project README to make development and deployment as easy as possible. Heroku has great documentation on creating servers, deploying, and adding free add-ons like custom domains.

While not related to the project directly, I created a GitHub organization for our new company, added my business partner, then forked my original Notify Me repo to the organization. After adding the original repository as a remote (GitHub forking guide) to the fork, I can now easily fetch changes from the original and merge them in. Ownership of the fork is controlled by team members of our Organization. The Organizations feature mapped really well to how we wanted to manage the code in the real world.

I hope you can use Notify Me on your new project. Contact me if you have any questions about it. There are several forks with different back-ends such as Mailchimp. Please send pull requests or other suggestions if you have them.