Other Pages

Expand All

intro-to-rails.step

message <<-MARKDOWN
### Goal

To teach you Ruby on Rails we are going to use a "Real World"
example. You've decided to create a voting system for you and your
friends to play with. You've decided at a minimum, you'd like to
allow users to:

* view the topics sorted by number of votes
* vote on topics
* create, edit, and destroy topics

You've sketched up an initial screenshot of what you want it to look like:

![Browser window with topic titles that can be voted on, ordered by number of votes](img/finished_app.png)

### Meta-Goal

When you have completed today's goal of getting the basic
application online you should understand:

* Basic Ruby syntax
* How to try your Ruby code (irb)
* How to go from requirements to a new working Rails application
* How to get your application online
* The basic tools a RoR developer uses (source control, editor, console, local server)

### Schedule

* 1-ish hour of ruby
* 4-ish hours of rails, broken up in 1-ish hour steps

This is just a rough guideline, not a mandate. Some steps you'll go
over and some you'll go under. It'll all work out by the end of the
day... unless I really screwed something up. :D

### Requirements

We're going to be working with:

* ruby 2.5.0
* rails 5.1.5
* bundler
* sqlite
* sublime text 3 or the text editor of your choice

Everything should be set up the night before during our
install-fest. Please ensure you have everything working _before_ you
show up for RailsBridge on Saturday.

You can verify that you have everything working by trying this out in your terminal:

<div class="console terminal">
  <div class="wrapper">
    <span class="label">Terminal</span>
    <pre>
$ cd ~/Desktop/railsbridge
$ vagrant up
$ vagrant ssh
$ irb
>> 1 + 2
=> 3
>> require "active_support"
=> true
>> exit
$
</pre>
  </div>
</div>

<i class="fa fa-cloud"></i> On Cloud9:

<div class="console terminal">
  <div class="wrapper">
    <span class="label">Terminal</span>
    <pre>
$ irb
>> 1 + 2
=> 3
>> require "active_support"
=> true
>> exit
$
</pre>
  </div>
</div>

If you can do that, you are probably good to go.
MARKDOWN

insert 'working_effectively_and_efficiently'

message <<-MARKDOWN
### Format

Each lesson will look like this:

<div style="background: white; border: 1px solid black; padding-left: 4em;">
  <h1 class="doc_title" style="margin-top: 0em;">Step Title</h1>
  <div class="goals">
    <h1>Goal:</h1>
    <p>Description of the current step.
    <p>Red because big goals are scary.
  </div>
  <div class="steps">
    <h1>Steps:</h1>
    <pre class="term">steps to take.</pre>
    <div class="console irb">
      <div class="wrapper">
        <span class="label">IRB</span>
        <pre>
def code_to_write
  1 + 1
end</pre>
      </div>
    </div>
    <p>Yellow because we've gotten it done, but we have no clue what's going on.</p>
  </div>
  <div class="explanation">
    <h1>Explanation</h1>
    <p>Details of what the steps actually did... spell out the cause and effect.
    <p>Green because we can tie everything together now.
  </div>
</div>
MARKDOWN

next_step "ruby_language"