Notes from the March second LV Ruby Meetup group. We built an 'IdeaShouter' app with haml, sass, and compass. By the end of these notes you should have built one too. Companion code can be had on github</a>.
Install RVM. Then you need to make sure you're using the latest Ruby build.
rvm use 1.9.2</code></pre>
Now that you're using the latest ruby build you should install the latest rails package.
gem install rails</code></pre>
Create a new rails project.
rails new ideashouter</code></pre>
cd ideashouter/</code></pre>
Create a .rvmrc file with the following contents. This will ensure that this project always runs with the right version of Ruby.
rvm use 1.9.2
rvm_default_project_rvmrc=1</code></pre>
Add the following lines to your Gemfile. We're going to need these. By default rails includes the sqlite gem. Make sure it's there just in case.
gem 'haml'
gem 'sass'
gem 'compass'</code></pre>
Install all the gems you'll need.
bundle</code></pre>
rails generate model Shout message:string upvotes:integer downvotes:integer</code></pre>
Have Rake set up the table for your new model—so you don't have to.
rake db:migrate</code></pre>
Set up Compass on your rails app.
cd ../</code></pre>
compass init rails .</code></pre>
Then answer yes to all questions posed by compass. Copy the %head portion to your clipboard.
cd ideashouter/app/views/layouts</code></pre>
Convert the default ERB layout to use HAML.
html2haml application.html.erb application.html.haml</code></pre>
Now you need to remove the old ERB layout template because Rails will use it instead of our fancy new HAML one.
rm application.html.erb</code></pre>
Now that you've created your HAML template you need to paste that %head code that you copied a few steps ago into it. It should look like the following now.
!!!
%html
%head
%title Ideashouter
= stylesheet_link_tag :all
= javascript_include_tag :defaults
= csrf_meta_tag
= stylesheet_link_tag 'compiled/screen.css', :media => 'screen, projection'
= stylesheet_link_tag 'compiled/print.css', :media => 'print'
/[if IE]
= stylesheet_link_tag 'compiled/ie.css', :media => 'screen, projection'
%body
= yield</code></pre>
Now generate a controller for our app.
rails generate controller Shouts</code></pre>
Add a default route for our controller to respond to. Open up your config/routes.rb and add the following code.
root :to => "shouts#index"</code></pre>
Create your root route view in views/shouts/index.html.haml.
%h1#shout @shout</code></pre>
This is where my notes stop. You'll still need to use IRB to set up some sample entries in your database. Then you'll later add a form to insert records. Some of the other guys from the Meetup might be able to help me finish up my notes. Please email me if you can share the rest of the steps.
Comments