Rails Intro

Introduction to web development
Ruby on Rails

Goal for today

Create a web-app and make it available on the Internet

... you will

  • Try out the tools of the trade
  • Get a feeling for the steps involved
  • See that you can too

... hopefully get interested enough to continue

How is it going to work?

No prior experience required

Mixed audience
If the going is easy, move along - or help thy neighbour

Ask away, type away

Groups for OS X, Windows, Linux
Use the coaches!
At your own pace

Browse presentation online

Note the 2D layout
There is a dictionary and reference list at the end
Note the links

From zero to full stack and deployed app in one evening?

Not quite...

We do assume some installed software...
And we will ignore the most important bit: testing...
And we will use a clever learning strategy ...

Blinkers!


Exactly what are we going to do?


Tutorial



Tutorial
Key concepts


Preparation

Tutorial
Key concepts

Preparation

  • What is a web app anyway?
  • Verify your environment
  • Ruby basics

Classic web app


Classic web app properties  

  • Many clients (duh...)
    • Sharing information
  • Browser clients (HTML)
  • Dumb clients, Server does everything
    • ( but session state on client )
  • Entire page reloaded every time
  • Separate database server

Verify Tools

Git, RVM, Ruby, Rails, Database, Heroku

Open Terminal

You find it in applications folder:
'Other' or 'Utilities' or 'Verktygsprogram' etc
Or find with spotlight (⌘+space)

If something seems wrong - grab help!

Verify Git

$git --versiongit version 1.8.3.4 (Apple Git-47)

Mac installer
https://code.google.com/p/git-osx-installer/git-1.8.3.2-intel-universal-snow-leopard.dmg

Verify RVM

$type rvm | head -1rvm is a function
$rvm -vrvm 1.22.17 (stable) by Wayne E. Seguin ...

$\curl -L https://get.rvm.io | bash -s stable

Verify Ruby, Rails

$rvm list<list of rubies>$irb2.0.0-p247 :002 > 2+2
 => 4 
2.0.0-p247 :005 > require 'active_support/all' => true 2.0.0-p247 :006 > 1.day.ago => 2013-10-16 17:49:11 +0200

<GemSet, Gems>

Verify Database

Sqlite3
$sqlite3
SQLite version 3.7.12 2012-04-03 19:43:07
Enter ".help" for instructions
Enter SQL statements terminated with a ";"
sqlite> .quit

Verify Heroku

$heroku version
heroku-toolbelt/3.0.0 (x86_64-darwin10.8.0) ruby/1.9.3$heroku login
Enter your Heroku credentials.
Email: gdj@sent.com
Password (typing will be hidden): 
Authentication successful.

(heroku ruby version not relevant - use Gemfile)

Ruby basics

Objects, Methods, Variables, Classes

Objects

There are numbers ...
> 6 => 6 
> 6.5
 => 6.5  
and text ...
> Bob
NameError: uninitialized constant Bob
	from (irb):45
	from /Users/gdj/.rvm/rubies/ruby-2.0.0-p247/bin/irb:16:in `'
> "Bob"
 => "Bob" 
> :Bob
 => :Bob
and many more things of course

Methods

You can talk to objects using a dot...
> 6.even? # Ruby ignores anything after '#' => true 
> 6.5.even? # Ruby understands first dot is decimalNoMethodError: undefined method `even?' for 6.5:Float
	from (irb):50
	from /Users/gdj/.rvm/rubies/ruby-2.0.0-p247/bin/irb:16:in
> 6.+( 7 ) # Method with argument  => 13  > 6.5.+ 7 # You can add integer to float. And skip par.  => 13.5  > 6 + 7 # This is the same as 6.+( 7 )  => 13
... and methods like "even?" and "+". 
Methods can take arguments

Variables, Assignment, Values


> x
NameError: undefined local variable or method `x' for main:Object
	from (irb):31
	from /Users/gdj/.rvm/rubies/ruby-2.0.0-p247/bin/irb:16:in 
> x = 6  => 6  > x  => 6  > x = 7 # x is changed to a different value (x is a variable)  => 7  > x + 6  => 13  > recipient = "Bob"  => "Bob"  > recipient + "@gmail.com"  => "Bob@gmail.com"

Lists

aka Arrays
> ingredients = ["milk", "eggs", "flour", "oil" , "salt"]
 => ["milk", "eggs", "flour", "oil", "salt"] 
> ingredients.first
 => "milk"
> ingredients[4] # This is just a method call. Looks funny.
 => "salt"

Dictionaries

aka Hashes
> recipe = {:milk => "2dl", :eggs => 2, :flour => "1hg"}
 => {:milk=>"2dl", :eggs=>2, :flour=>"1hg"} 
> recipe.size
 => 3 
> recipe[:eggs] # This is also a method call 
 => 2 

Classes

Numbers:
'> 6.class
 => Fixnum 
> 6.5.class
 => Float
Text:
'> "Bob".class
 => String 
> :Bob.class
 => Symbol
Lists:
'> ingredients.class
 => Array 
> recipe.class
 => Hash

Objects themselves can change

(Some can, some cannot)
> recipient
 => "Bob" 
> recipient.concat "@example.com"
 => "Bob@example.com" 
> recipient
 => "Bob@example.com"> recipe[:salt] = "1pinch"
 => "1pinch" 
> recipe
 => {:milk=>"2dl", :eggs=>2, :flour=>"1hg", :salt=>"1pinch"}

Use variables...

in 'formulas'
> fahr = 90
 => 90 
> celsius = (5.0/9.0) * (fahr - 32)
 => 32.22222222222222 
> fahr = 80
 => 80 
> celsius = (5.0/9.0) * (fahr - 32)
 => 26.666666666666668 

Create a reusable 'formula'

(function, method)
> def fahr_to_celsius( fahr )
>   (5.0/9.0) * (fahr - 32)
> end
 => nil 
> fahr_to_celsius 80
 => 26.666666666666668 
> fahr_to_celsius 70
 => 21.11111111111111

Create a Class and Methods

<CHANGE - BAD EXAMPLE>
'> class Temperature
?>   def initialize( fahr )
?>     @fahr = fahr
?>     end
?>   def to_celsius
?>     (5.0/9.0) * (@fahr - 32)
?>     end
?>   end
 => nil 
'> fahr = Temperature.new 60  => #<Temperature:0x007fc8b38481f8 @fahr=60><0x007fc8b38481f8>  '> fahr.to_celsius  => 15.555555555555557 

Tutorial

Tutorial

<Motivation fo our example goes here, mission statement>
<Like: "We want to organize meetings and communicate topics for the meetings>

Terminal Basics

Create a directory (folder) to work in
And move around the directory tree 
pwd (print working directory)
ls (list files)
cd <directory name> (change directory - .. (two dots) to move up)
mkdir <directory name> (make/create directory)


There is more about Terminal at the end of the presentation

Create an empty app

Use the terminal - organize folders as you please
$ rails new notify --skip_bundle
      create  
      create  README.rdoc
...$ cd notify
$ bundle install...Your bundle is complete!
Check what happened - also use finder and tutorial page
And then start rails in server mode...
$ ls app
assets controllers helpers mailers models views
$ rails s...

Store in Git

$ git init
Initialized empty Git repository ...
$ git status
...
$ git add .
$ git commit -m 'Added all auto-created files'
[master (root-commit) 592573a] Added all auto-created files
 53 files changed, 821 insertions(+)
 create mode 100644 .gitignore
... 

Check what happened (in your app folder)
$ ls -al...
.git is a folder


Add features to your app

$ rails generate scaffold topic title:string description:text
      invoke  active_record
      create    db/migrate/...


( structure of storage - database )

Concepts

MVC, Router, Database

MVC

MVC is one* way to split up our work into smaller parts.
So we don't have to think about all parts all the time.

*Everyone has their own idea exactly what MVC is and how it should be done

MVC

  • Model: Concept + Save objects
  • View: What user sees
  • Controller: What user does

MVC

remember the web app?

Full Rails stack means MVC all on the Server

Router


Database

Changing structure: Migration

Create and change tables and columns
<Remove or improve?>

Database

ActiveRecord magic

Database tables and fields get connected to our models
Automatically
<Remove or improve?>

Dictionary - URL

Syntax

scheme://domain:port/path?query_string#fragment_id

Examples

https://www.google.se/maps/preview?hl=sv
http://localhost:3000/topics/1

path is used by rails routing
query is used for many purposes

domain is also called host, port is 80 by default

Dictionary - Programs

program: 1. Text (code) in files 2. Running process
terminal: Program for interacting directly with your computer
(where you type commands, start programs)
server: Running program that responds to queries
client: Running program that sends queries (browser)
database: Server that saves to/restores from disk
web server: Server that runs (your) application code
(available on the Internet, connects to a database)
editor: Program for editing files (programs or normal text)

Dictionary - Programming, tools

programming language: Rules for writing instructions (code)
Ruby: A useful programming language, a 'swiss army knife'
HTML: A specialized language for displaying web pages
ERB: Template for HTML pages (that uses Ruby)

irb: Terminal program for running snippets of Ruby
Gem: Package of ruby code (library, API)
RubyGems: Built-in tool for managing gems
RVM: Ruby Version Manager, handles rubies and gems (dev)
Gemset: Group of gems handled by RVM
Bundler: Gem that also handles groups of gems... and versions
Gemfile: File used by Bundler to define set of gems and versions

Dictionary - more tools...

Git: Program for managing versions of your code
GitHub: Web app for coordinating git in a team
Rake: A program to run special Ruby programs (tasks)
Rails: A set of gems for building web apps
    - ActiveRecord: Gem for modelling + database storage
    ActionPack: Gem for controller and view code
    ActionSupport: Mixed bag of helpers


The Terminal

Lets examine an example of a UNIX command:
 $ls -al ~
$: "prompt", printed by computer. May include useful info such as time, username, current directory
ls: The program, in this case "ls" for "list files"
-al: Options/Flags, in this case "a" means "include dot-files" and "l" means "long format". Options are optional
~:  Argument(s), in this case ~ means "User's home directory". Some commands - like ls - do not require arguments.
On windows use "dir" instead of ls

By the way, terminal is also called Command Line Interface (CLI)

Common Unix commands

cd <directory>: change directory
pwd: print working(current) directory
mv <file> <new location/name>: move (rename) file or directory
cp <file> <new file>: copy file 
rm, rmdir <file>: remove file, remove directory
mkdir <directory>: create directory
touch <file>: create empty file or change update time of existing file
cat, less, tail <file>: print out content of file. cat: entire file, less: beginning*, tail: end (use with -f to monitor)
man <program>: manual of a program*. Note: this is your help. Try for ex "man cp"
which <program>: location of program. To verify exactly which ruby (for example) you are using
open -e <file>: Mac/OS X special to open file in an editor
*Navigation: space/b to move page down/up and q to exit

Resources


Railsbridge tutorial (our example)

tryruby.org (lighthearted intro)
ruby-doc.org (everything from intro to api)

Stockholm Ruby


@sthlmrb, #sthlmrb

Ruby on Rails Intro - long version

By Gunnar Djurberg

Ruby on Rails Intro - long version

Introduction to Ruby on Rails and web application development in general

  • 562