March 10th, 2009

เริ่มต้นกับ Ruby On Rails ตอนที่ 2 Hello World With Rails

No Comments », RoR, by nolifelover

2-rails-create-projectก่อนที่คุณจะเริ่มการสร้าง Hello World Application โดยการใช้ Rails นั้นคุณต้องลง Rails เรียบร้อยแล้วซึ่งหากว่าคุณยังไม่ได้ลงสามารถหาอ่านได้ที่ เริ่มต้นกับ Ruby On Rails ตอนที่ 1 Install Rails on Windows แต่หากว่าได้ทำการติดตั้งแล้ว เรามาเริ่มต้น rails application ตัวแรกด้วย Hello World กันเลยครับ

ขั้นที่ 1 สร้างโปรแจค Rails Application

เริ่มแรกให้เราเข้าไปยัง folder ที่ต้องการเก็บโปรแจคนี้เอาไว้ครับในที่นี้ผมต้องการเก็บไว้ที่ E:Tutorialrails> จากนั้นให้พิมพ์คำสั่ง
rails hello

โดยคำสั่งนี้คือการสร้างโปรแจคชื่อว่า hello ขึ้นมา โดยจะมีการสร้างไฟล์ที่จำเป็นสำหรับโปรแจคนี้หลายไฟล์โดยมีรายละเอียดดังนี้

2-rails-hirachyเมื่อสร้างโปรแจค hello จะพบ folder ใหม่ใน rails คือ folder hello วึ่งเป็น folder ของโปรแจคโดยโครงสร้างของ folder จะมีดังนี้ครับ

1. app เป็น folder สำหรับเก็บ controller,helper,models และ views ที่ใช้ในการแสดงผล
- controllers จะเป็นส่วนที่จัดการในการโปรเซสทั้งหมดของ rails
- helpers จะเก็บ coding ในส่วนของกรณีที่ต้องการเขียนโค้ดใน view แต่สามารถมาเขียนเพิ่มใน helper แทน
- models เป็น code ที่มีการติดต่อกับฐานข้อมูลโดยใช้ active record
- views จะเป็นส่วที่เก็บ .erb สำหรับใช้ในการแสดงผล

2. config  เป็น folder ที่เก็บไฟล์การตั้งค่าต่างๆ ของโปรแจค

3. db เป้น folder ที่ใช้ในการเก็บ schema ของฐานข้อมูล

4. doc ส่วนที่เก็บ doc ในกรณีที่สั่งให้ rails สร้าง document ของโปรแจค

5. lib เป้น library ที่เขียนขึ้นเองนอกเหนือจาก rails core

6. log ใช้สำหรับการเก็บ log การทำงานของ server

7. public สำหรับเก็บรูปภาพ javascript และ stylesheets

8. script เป็นตัวช่วยในการ generate ส่วนต่างๆ ของ rails application

9. test เป็นส่วนของการใช้งาน function ในการทดสอบโปรแกรม

เมื่อสร้างโปรแจคเสร็จแล้วให้เราลองเริ่มการทำงานของโปรแจคโดยการเข้่าไปยัง root directory ของโปรแจค

cd hello
ruby script/server

จากนั้นให้ลองเปิด browser ไปยัง http://localhost:3000 จะได้หน้าตาดังรูป

2-rails-server-start

ขั้นที่ 2 สร้าง Controllers

หลังจากที่ได้สร้างโปรแจคขึ้นมาแล้วขั้นต่อไปจะทกลองสร้าง controller ขึ้นมาโดยให้ชื่อว่า say โดยการใช้คำสั่ง
ruby script/generate controller say
2-rails-genreate-say-controller
เมื่อสร้าง controller แล้วให้ลองใช้ text editor ตัวไหนก็ได้เปิด ไฟล์ที่อยู่ใน appcontrollersay_controller.rb ขึ้นมา

1
2

class SayController < ApplicationController
end

ขั้นที่ 3 สร้าง Action แรกชื่อว่า hello

เมื่อเราได้สร้าง controller ขึ้นมาแล้วตามหลักของ rails เราจำเป็นต้องมี action ในการเข้าถึงโดยในที่นี้จะทำการสร้าง action ที่มีชื่อว่า hello

1
2
3
4

class SayController < ApplicationController
	def hello
	end
end

จากนั้นให้ทำการ start rails server ขึ้นมาใหม่โดยการใช้คำสั่งด้านล่าง
ruby script/server
ทดสอบโดยการไปที่ http://localhost:3000/say/hello เมื่อเราเข้าไปจะเกิด error เนื่องจากว่ายังไม่ได้มีการตั้งค่าให้กับการ connection กับฐานข้อมูลซึ่งใน version 2.2.2 นี้จำเป็นต้องมีการตั้งค่าการเชื่อมต่อกับฐานข้อมูลเลย

ขั้นที่ 4 การตังค่า database.yml ให้ติดต่อกับ mysql

สำหรับในส่วนของการสร้างฐานข้อมูลผมคงไม่อธิบายในที่นี้นะครับ โดยผมได้สร้างฐานข้อมูลชื่อ hello_development ขึ้นมาแล้วในส่วนการตั้งค่าให้เข้าไปยัง helloconfigdatabase.yml โดยแก้ไขตามดังต่อไปนี้ (แก้เฉพาะส่วน development)

10
11
12
13
14
15

development:
  adapter: mysql
  database: hello_development
  username: rails_tutor
  password: rails
  host: localhost

จากนั้นให้ทำการบันทึก database.yml ที่ได้รับการแก้ไข และให้ลองเริ่มการทำงานของ rails ใหม่และไปที่ http://localhost:3000/say/hello หากทุกอย่างถูกต้องจะพบกับหน้า template missing
2-rails-template-missing

ขั้นที่ 5 สร้าง View ให้กับ action hello ใน controller say

เพื่อเป็นการแก้ไขกรณีที่ template missing เกิดขึ้นเนื่องจากว่า เมื่อมีการเรียก http://localhost:3000/controller/action rails จะทำการหา view ที่ชื่อ action.html.erb โดยอัตโนมัติ โดยในกรณีนี้จะชื่อว่า hello.html.erb ซึ่งจะอยู่ใน helloappviewssayhello.html.erb ซึ่งเมื่อเราเข้าไปเราจะไม่พบไฟล์นี้ให้สร้างไฟล์นี้ขึ้นมาและให้เพิ่มโค้ดนั้นด้วย

1
2
3
4
5
6
7
8

<html>
  <head>
    <title>Hello, Rails!</title>
  </head>
  <body>
    <h1>Hello from Rails!</h1>
  </body>
</html>

จากนั้นให้ทดสอบโดยการเข้าไปยังที่อยู่เดิมอีกครั้ง เราจะพบกับ html ธรรมดาที่ได้เขียนไว้ในส่วนของ hello.html.erb

ขั้นที่ 6 สร้าง action เพิ่มเติมชื่อว่า bye

ในส่วนนี้ผมจะทำการสร้าง action เพิ่มเติมขึ้นมาโดยให้ชื่อว่า bye โดยจะทำการเชื่อมต่อกันระหว่างหน้า hello กับหน้า bye โดยผมต้องทำการเพิ่มโค้ดในส่วนของ controller ดังนี้ครับ

1
2
3
4
5
6

class SayController < ApplicationController
	def hello
	end
	def bye #lฃส่วนนี้คือส่วนที่เพิ่มเข้ามา
	end
end

หลังจากนั้นจะทำการสร้าง view สำหรับ action นี้โดยไปสร้างไว้ที่ helloappviewssaybye.html.erb

1
2
3
4
5
6
7
8

<html>
  <head>
    <title>Bye, Rails!</title>
  </head>
  <body>
    <h1>Bye from Rails!</h1>
  </body>
</html>

จากนั้นให้ลองเข้าไปที่ http://localhost:3000/say/bye เราจะพบกับ action ใหม่ที่เราได้สร้่างไว้คือ bye

ขั้นที่ 7 สร้าง linking ระหว่าง action

สำหรับในส่วนนี้จะสร้างการเชื่อมต่อระหว่าง action แต่ละ action โดยการใช้ a href และการใช้งาน link_to method ซึ่งใรการเพิ่มเราสามารถทำได้ทั้ง 2 แบบ แต่ผมแนะนำแบบหลังดีกว่าเนื่องจากว่าในกรณีที่ app ของเราไม่ได้อยู่ใน root directory ของ host จะได้ไม่เกิดปัญหาครับ แก้ไขโดยการเพิ่มโค้ดในส่วนของ say.html.erb

1
2

    <a href="/say/bye">Good Bye with a href</a>
    <%= link_to "Good bye with link_to",:action=>:bye%>

โดยทั้ง 2 แบบจะให้ผลเหมือนกันแต่ในกรณีที่ app ของเราไม่ได้อยู่ใน root directory วิธีแรกจะอ้าง path ในการเข้าถึงผิด อย่างเช่น app ของเราอยู่ที่ http://localhost/rails/hello เมื่อเราใช้วิธีแรกจะเป็นการเรียกไปยัง http://localhost/say/bye แต่หากเป็นวิธีที่ 2 rails จะเรียกไปยัง http://localhost/rails/say/bye ซึ่งเป็นที่อยุ่ที่ถูกต้อง
ไฟล์ hello-tutorails-2.rar

115 views

Tags: , , , ,

Leave a Reply