Slide 1

Slide 1 text

Programming, ! Web Applications ! and Ruby on Rails Marco Schaden! @donschado Saturday 24th May 2014

Slide 2

Slide 2 text

Buzzwords! Web Application Ruby Rails Programming HTTP MVC Model View Controller Request Response Server Protocol ? ? ? ? ? ? ? HTML all the stuff in 30 minutes

Slide 3

Slide 3 text

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

"It’s a boy’s thing"

Slide 6

Slide 6 text

http://en.wikipedia.org/wiki/Women_in_computing

Slide 7

Slide 7 text

http://en.wikipedia.org/wiki/Women_in_computing

Slide 8

Slide 8 text

"You need a Ph.D. in mathematics"

Slide 9

Slide 9 text

Not necessarily, but… communication: express your thoughts! and ideas properly passion: care about what you’re doing ! and be curious how things work research: read documentation, ! consult others or! just google it! problem solving: read the error messages ! and be hungry to solve issues + patience

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

programming: ! ! is telling a computer what to do! ! (no magic involved)

Slide 12

Slide 12 text

step-by-step instructions = program

Slide 13

Slide 13 text

3.times0do0 0 print0"Hello0World!"0 end

Slide 14

Slide 14 text

Ruby A PROGRAMMER’S BEST FRIEND https://www.ruby-lang.org/

Slide 15

Slide 15 text

imagine all the programming languages Ruby

Slide 16

Slide 16 text

Why Ruby? Yukihiro Matsumoto ! (Matz) Ruby is designed to be human- oriented. It reduces the burden of programming. It tries to push jobs back to machines.! ! You can accomplish more tasks with less work, in smaller yet readable code. "Matz is nice so we are nice"

Slide 17

Slide 17 text

Later we will learn more about Ruby…

Slide 18

Slide 18 text

Web Application ? "A web application is a program that is displayed in a web browser. * Web applications are usually stored (and executed) on a web server. They can be accessed through the Internet   via a communication protocol such as HTTP. "   – Wikipedia

Slide 19

Slide 19 text

HTTP? Hyper Text Transfer Protocol http://weheartit.com/entry/17157559

Slide 20

Slide 20 text

HTTP Request Cycle In 4 Easy Steps (or how the internet works)

Slide 21

Slide 21 text

your computer! running a browser of your choice a web server ! somewhere on the internet! running a web application

Slide 22

Slide 22 text

Hey$can$I$get$the$ railsgirls$website? 1 http://railsgirls.com/cologne

Slide 23

Slide 23 text

Hey$can$I$get$the$ railsgirls$website? http$request$ get,$post,$put,$delete,… 1

Slide 24

Slide 24 text

let$me$check…$. 2

Slide 25

Slide 25 text

$ok,$here$it$is http$response$ generated$data,$HTML,$static$files,$images,… 3

Slide 26

Slide 26 text

4 Yay!

Slide 27

Slide 27 text

GOT IT!

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

David Heinemeier Hansson! (DHH) Why Rails? Rails is an attempt to mold the beauty and productiveness of Ruby into a framework for web applications. Rails emphasizes principles such as:! • convention over conﬁguration! • don't repeat yourself (DRY)! • model - view - controller architecture (MVC) http://contributors.rubyonrails.org/ http://rubyonrails.org/ *over 3000 people have contributed:

Slide 30

Slide 30 text

MVC? Model - View - Controller http://weheartit.com/entry/17157559

Slide 31

Slide 31 text

No content

Slide 32

Slide 32 text

Data$+$Logic Presentation Intermediary

Slide 33

Slide 33 text

WHY…?!?!

Slide 34

Slide 34 text

w/o MVC: http://media0.faz.net/ppmedia/aktuell/wirtschaft/777415979/1.1528426/default/wo-ist-noch-mal-die-rechnung-ein-buero-mit-sehr-kreativem-chaos.jpg

Slide 35

Slide 35 text

with MVC: http://blog.meine-moebelmanufaktur.de/wp-content/uploads/2014/02/bunte_ordner_buero.jpg

Slide 36

Slide 36 text

/ Example MVC Web Application https://github.com/DonSchado/facebook-lite

Slide 37

Slide 37 text

/ Example MVC Web Application Layout View Post https://github.com/DonSchado/facebook-lite

Slide 38

Slide 38 text

URL localhost:3000/ (remember the request cycle?)

Slide 39

Slide 39 text

GET /! Request

Slide 40

Slide 40 text

Router  get "/" => "welcome#index"!

Slide 41

Slide 41 text

Controller  class WelcomeController < ApplicationController! def index! $$@posts0= Post.all ! end! end!

Slide 42

Slide 42 text

Model  class Post < ActiveRecord::Base! end!

Slide 43

Slide 43 text

Database * create_table "posts" do |t|! t.text "content"! t.integer "user_id"! t.datetime "created_at"! t.datetime "updated_at"! end!

Slide 44

Slide 44 text

Model  class Post < ActiveRecord::Base! end!

Slide 45

Slide 45 text

Controller  class WelcomeController < ApplicationController! def index! $$@posts0= Post.all ! end! end!

Slide 46

Slide 46 text

View 

Das neuste aus ...$

! !

[email protected]

$ $$<%=$image_tag(post.user.avatar)$%>$ $$<%=$post.user.name$%>$ $$<%=$post.content$%>$

Slide 47

Slide 47 text

$ $$$ $$$$$Facebook$Lite$ $$$$$<%=$stylesheet_link_tag$$$$"application",$media:$"all"$%>$ $$$$$<%=$javascript_include_tag$"application"$%>$ $$$ $$$ $$$$$ $$$$$$<%=$yield$%>$ $$$$$ $$$ Layout 

Slide 48

Slide 48 text

Response (HTML)*  ! ! Facebook Lite! ! ! ! !

Das Neuste aus dem ganzen Netzwerk

! !
Liane19 Nov 20:32
!
Ich bin hier!!!
!
! !
Marco19 Nov 20:02
!
Hallo, ist da wer?
!
! !
Marco19 Nov 19:02
!
Hallo Welt!
!

! !

Slide 49

Slide 49 text

URL localhost:3000/

Slide 50