Le Wagon Rails Introduction

1. Alex
Ruby on Rails
for Beginners

2. Ruby Intro

3. Types of Objects
String
Integer
Floats
Array
Hash
“london”
12
3.14
[“london”, “paris”]
{first_name: “alex”, last_name: “benoit"}

4. cities.each do |city|
# …
end
cities = [“london”, “paris”, “new york”]
cities.length # => 3

5. Class Instances
OOP

6. class Car
end
car.rb
Car.new
Car.new
Car.new
OOP = Data + Behaviour

7. MVC

8. Building a Web Product

9. Mockup

10. Let’s mockup the product!

11. Database Scheme

12. users
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io

13. users products
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io
id name url user_id
1 LovelyHood lovely-hood.com

14. users products
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io
id name url user_id
1 LovelyHood lovely-hood.com 2

15. users products
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io
id name url user_id
1 LovelyHood lovely-hood.com 2
2 Kudoz getkudoz.com 1
3 uSlide uslide.io 3
4 Freshest frshst.com 2

16. users products
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io
id name url user_id
1 LovelyHood lovely-hood.com 2
2 Kudoz getkudoz.com 1
3 uSlide uslide.io 3
4 Freshest frshst.com 2
a user has many products
a product belongs to one user
1..N relationship

17. users products
id username email
1 olivier olivier@kudoz.com
2 edward ed@lovelyhood.com
3 vincent vincent@uslide.io
id name url user_id
1 LovelyHood lovely-hood.com 2
2 Kudoz getkudoz.com 1
3 uSlide uslide.io 3
4 Freshest frshst.com 2
primary key primary key foreign key

18. Let’s model the database!

19. Rails Intro

20. History
Created in 2003 by David Heinemeier Hansson (DHH), while working on Basecamp.
Extracted and released it as open source code in July of 2004

21. Motto
Convention Configurationover

22. Ruby community
+100k gems on rubygems.org

23. Rails new
$ rails new app_name
$ rails new app_name -T --database=postgres

24. Create the database
$ rails db:create

25. Launch server
$ rails server
http://localhost:3000

26. Let’s create the new Rails app!

27. .
├── app
│ ├──
│ ├──
│ └──
│
└── config
controllers
models
views
└── routes.rb
MVC

28. config/routes.rb
Router
HTTP
request
MVC

29. config/routes.rb
Router
app/controllers
Controller
HTTP
request
routed
to controller
MVC

30. config/routes.rb
Router
app/controllers
Controller
app/models
Model
PostgreSQL
database
HTTP
request
routed
to controller
Get data
from model
MVC

31. config/routes.rb
Router
app/controllers
Controller
app/models
Model
app/views
View
PostgreSQL
database
HTTP
request
routed
to controller
Get data
from model
Inject it
in view
MVC

32. config/routes.rb
Router
app/controllers
Controller
app/models
Model
app/views
View
PostgreSQL
database
HTTP
request
routed
to controller
Get data
from model
Inject it
in view
render HTML
MVC

33. Rails app
config/routes.rb
Router
app/controllers
Controller
app/models
Model
app/views
View
PostgreSQL
database
1 2
3
4
5

34. Rails Routing

35. HTTP request?
some link
submit

36. HTTP basics
A protocol to transfer resources
Based on a system of request / response
Between 2 machines, a client and a server

37. HTTP request is MORE THAN a URL

38. HTTP request is 4 things
1 - HTTP verb (GET / POST / PATCH / DELETE)
2 - URL
3 - headers
4 - body (not always)

39. Rails routing
GET /products
get “home” => “pages#home”
get “about” => “pages#about”
get “products” => “products#index”
post “products” => “products#create”
PagesController
ProductsController
def index
…
end
def create
…
end

40. PagesController
def home
…
end
def team
…
end
views/pages
home.html.erb
team.html.erb
Action/View convention

41. ERB
+ =
Embedded Ruby

42. file.html
<h1>…</h1>
< >
+
file.html.erb
<%= %>
< >
< >
< >
< >
<h1>…</h1>
< >
< >
< >
<%= %>

43. PagesController
def home
end
pages/home.html.erb
<%= @time %>
<h1>…</h1>
< >
< >
< >
@time = Time.now
Instance variables

44. Let’s build the pages and product controller!
pages#home pages#about products#index

45. Active Record

46. app/models
Model Database
ActiveRecord

47. $ rails g model Product name:string

48. class Product < ActiveRecord::Base
…
end
ActiveRecord Model

49. class CreateProducts < ActiveRecord::Migration
def change
create_table :products do |t|
t.string :name
t.timestamps null: false
end
end
end
ActiveRecord Migration

50. $ rails db:migrate
Run Pending Migrations

51. $ rails console
Play with your Model

52. All
> Product.all
SELECT * FROM products

53. New & Save
> kudoz = Product.new(name: “kudoz”, url: “getkudoz.com”)
> kudoz.save
INSERT INTO products (name, url)
VALUES ('kudoz', 'getkudoz.com')

54. > Product.find(1)
SELECT * FROM products
WHERE id = 1
Find

55. > Product.find_by_name(“kudoz”)
SELECT * FROM products
WHERE name = “kudoz”
Find By

56. Validations
class Product < ActiveRecord::Base
end
presence: true, uniqueness: truevalidates :name,

57. Associations
class Product < ActiveRecord::Base
end
belongs_to :user

58. Let’s build our Product Model!

59. Rails Params

60. 1 - dynamic URL
GET https://www.facebook.com/:user_name
GET https://www.facebook.com/romainpaillard
params[:user_name] => “romainpaillard”

61. 2 - query string
GET https://www.airbnb.com/s/roma?checkin=02/17/2016
params[:checkin] => 02/17/2016

62. 3 - POST request
POST https://www.lewagon/apply
params[:first_name] => “Boris”
{
“first_name": “Boris",
“last_name”:”Paillard"
} } request
body

63. Good news !
params
dynamic URL query string POST request body

64. Let’s build the show view of a product!
products#show

65. Rails CRUD Routes
We already built index and show actions!

66. What’s CRUD?
C
Create
R
Read
U
Update
D
Delete

67. We always need same actions
As a user, I can CRUD a flat
As a user, I can CRUD a tweet
As a user, I can CRUD a post
As a user, I can CRUD a product

68. get “products” “products#index”=>
get “products/:id” “products#show”=>
get “products/new” “products#new”=>
post “products” “products#create”=>
get “products/:id/edit” “products#edit”=>
patch “products/:id” “products#update”=>
delete “products/:id” “products#destroy”=>

69. resources :products

70. $ rails routes

71. Let’s rebuild our Routes
but this time using resources!

72. Rails Helpers for Links
<%= link_to “New Product”, new_product_path %>
<a href=“/products/new”>New Product</a>

73. Let’s put links in our website
links to home, to product index, to product show

74. Rails CRUD Routes
Let’s build the new and create actions

75. get “products/new” “products#new”=>
So that user can create new product…
post “products” “products#create”=>
resources :products, only: [:new, :create]

76. class ProductsController
def new
@product = Product.new
end
def create
…
end
end

77. <%= form_for @product do |f| %>
<%= f.text_field :name %>
<%= f.text_field :tagline %>
<%= f.submit %>
<% end %>
<form action="/products" method="post">
<input type="text" name="product[name]" id=“product_name”>
<input type="text" name="product[tagline]" id=“product_tagline">
<input type="hidden" name="authenticity_token" value=“HJYkH..”>
<input type="submit">
</form>

78. params.require(:product).permit(:name, :tagline)
Strong params (whitelisted)

79. class ProductsController
def new
@product = Product.new
end
def create
safe_params = params.require(:product).permit(:name, :tagline)
product = Product.new(safe_params)
product.save
redirect_to products_path
end
end

80. Let’s implement those actions
products#new, products#create

81. Rails CRUD Routes
Let’s build the edit and update actions

82. get “products/:id/edit” “products#edit”=>
So that user can edit an existing product…
patch “products/:id” “products#update”=>
resources :products, only: [:edit, :update]

83. class ProductsController
def edit
@product = Product.find(params[:id])
end
def update
…
end
end

84. <%= form_for @product do |f| %>
<%= f.text_field :name %>
<%= f.text_field :tagline %>
<%= f.submit %>
<% end %>
<form action="/products" method="post">
<input type="text" name="product[name]" id=“product_name” value=“Product Hunt”>
<input type="text" name="product[tagline]" id=“product_tagline” value=“Great Website!”>
<input type="hidden" name="authenticity_token" value=“HJYkH..”>
<input type="submit">
</form>

85. params.require(:product).permit(:name, :tagline)
Strong params, again

86. class ProductsController
def edit
@product = Product.find(params[:id])
end
def create
safe_params = params.require(:product).permit(:name, :tagline)
product = Product.find(params[:id])
product.update(safe_params)
redirect_to products_path
end
end

87. Let’s implement those actions
products#edit, products#update

88. Rails CRUD Routes
Let’s build the destroy actions

89. delete “products/:id” “products#destroy”=>
So that user can delete a product…
resources :products, only: [:destroy]

90. class ProductsController
def destroy
product = Product.find(params[:id])
product.destroy
redirect_to products_path
end
end

91. Let’s implement that action
products#destroy

92. Let’s save this website

94. Let’s host this website

96. What about my users?

97. There is a gem for that!