Wednesday 16 May 2012

Ruby on Rails / How to use Slidedown to make HTML5 slides in Markdown

Last weekend I attended a railsbridge session which was hosted by newcontext at their amazing office; Desi from Devchix, along with many other helpers guided a roomful of girls through a workshop on building and deploying our first Ruby on Rails app. I think its great that they have female-focused programming classes because there are really not so many girls doing programming! And it was good because I needed that little push to get me over the main hurdle (ie: INSTALLING RUBY ON MY MAC) and then the rest was really a breeze. I'm excited to build more things in Ruby and to get more acquainted with running things on the command line on my mac!

For more information on railsbridge check out:
- Installfest Guide - how to install ruby
(do note that for mac 10.6.8 the instructions are slightly outdated, you will only need GCC-10.6 instead of Xcode)
- Railsbridge Curriculum - the lessons we went through

My own notes are here.

I noticed that they were using an interesting html/jquery based presentation tool which was called Slidedown, and since I will be teaching a workshop in Mexico next week I thought I should try to use that instead of using Prezi or some other random desultory method.

I went to Slidedown on github, downloaded the package, and puzzled for quite some time over what to do with it. HOW WOULD ANYONE NEW TO THIS EVER FIGURE THIS OUT WITHOUT THE INTERNETS! Anyways, the inside of this package didn't look exactly like the file structure of the Suggestotron example that we built during the class (as the package came without a Gemfile). But there was a .gemspec file inside, which was the clue that I googled for. And this is eventually what I figured out:



How to install a gem in ruby


Screen shot 2012-05-16 at PM 06


If there is a gemspec file inside the folder, this is what you should run in terminal:

gem build gemname.gemspec
gem install gemname-version.gem
slidedown yourtalk.md

That was just an example. Replace gemname with the actual name of your gem. So, in my case, after downloading the slidedown gem from github, this is what I actually typed in (VERBATIM):

gem build slidedown.gemspec
gem install slidedown-0.2.0.gem
slidedown mytalk.md

After I installed it, it generated my html for me inside the command.

Screen shot 2012-05-16 at PM 06


I hope this post will help someone who might be sitting at their computer puzzling over this embarrassingly noob question that also stumped me... "HOW DOES I INSTALL A RUBY GEM???"



I love editing my wiki, which has a pared down mediawiki text format as well, but Markdown is even simpler and nicer - so I find it most excellent fun to make my presentation in Markdown before creating it in HTML. So simple and clean! This is the example of what the Markdown syntax looks like when you create something in Slidedown.

!SLIDE

# This is my talk

!SLIDE

## I hope you enjoy it

!SLIDE code

    def foo
      :bar
    end

!SLIDE

Google is [here](http://google.com)

!SLIDE

# Questions?

Click here to view Slidedown Example


No comments:

Post a Comment