step 1 เริ่มต้น ใช้งาน codeigniter เริ่มเขียนจริง

บทความนี้ เล่าต่อจากบทความก่อนหน้า คือ step0 CodeIgniter ทำงานอย่างไร บทความนี้ จะเริ่มเขียนจริง เริ่มตั้งแต่ download มา จนเอามาเขียนหน้าเว็บ เพื่อแสดงผลได้เลยครับ

ผมจะแยกเป็นการติดตั้ง และการเขียนหน้าเว็บด้วย codeigniter เพื่อไม่ให้งงนะครับ แต่ไม่ต้องตกใจ เพราะว่า codeigniter ติดตั้งง่ายมาก config นิดเดียวเอง นิดเดียวจริงๆ ลองดูครับ

การติดตั้ง codeigniter เพื่อใช้งาน

1. download Codeigniter version ล่าสุด เลือก ที่เป็นปุ่มเทาๆ ด้านบนนะครับ จะเป็น version ล่าสุด ตอนที่เขียนบทความนี้คือ 2.1.0
2. แตกไฟล์ใส่ web root ของเรา(ผมถือว่าทุกท่านมี web host หรือ localhost แล้วนะครับ) อย่างเช่น web root ผมอยู่ที่ "T:\xampp\htdocs" ผมแตกไฟล์แล้วเอามาวางในนี้ จะได้ว่า "T:\xampp\htdocs\CodeIgniter_2.1.0" ซึ่งข้างในจะมี 3 แฟ้มกับอีก 2 ไฟล์ 
3. เปลี่ยนชื่อแฟ้ม CodeIgniter_2.1.0 เป็นตามที่เราต้องการ ผมจะเปลี่ยนเป็น ci210 นะครับ ดังนั้นผมจะได้ path เป็น "T:\xampp\htdocs\ci210" แต่สำหรับคนที่เอาไปใช้เป็นเว็บจริง จะเอาเฉพาะ ไฟล์ที่อยู่ในแฟ้ม(folder application, folder system, file index.php)ไปวางที่ root เลยก็ได้เหมือนกันนะครับไม่ต้องเอาแฟ้มบนสุดไป เวลาเปิดเว็บจะได้ไม่ต้องพิมพ์ชื่อแฟ้มครับ
4. เปิดหน้าเว็บทดสอบได้เลย อย่างของผมนี้ จะเปิดด้วย url http://localhost/ci210 ก็จะได้หน้าเว็บแบบนี้ 
   
   

เสร็จแล้วครับ การติดตั้ง ง่ายมั้ยครับ จริงๆมันไม่ได้เรียกว่าติดตั้ง มันเรียกว่า โหลดมาแตกไฟล์แล้วใช้เลยมากกว่า ทีนี้เราก็มาต่อกันด้วยการ เริ่มใช้งานมันบ้าง ขอให้ย้อนกลับไปที่บทความเก่า หากยังจำได้ก็คือ เราจะต้องเขียนแบบ MVC แต่ว่า เพื่อไม่ให้ งง ผมจะแนะนำเฉพาะส่วนของ VC คือ View กับ controller ก่อน

Controller คือส่วนที่ทำหน้าที่ควบคุมการทำงานของระบบ และหมายรวมไปถึง จะเป็นตัวที่สั่ง view ให้แสดงผลด้วย ดังนั้น เราจึงมักจะเริ่มต้นที่ Controller ก่อนครับ ดังนี้

เริ่มเขียน Controller ของ Codeigniter

1. เปิดแฟ้ม /application/controllers หรือว่าแบบเต็มๆจาก path ในเครื่องผมก็คือ "T:\xampp\htdocs\ci210\application\controllers" แล้ว copy ไฟล์ welcome.php มาตั้งชื่อใหม่ตามที่เราต้องการ เช่นผมจะตั้งว่า news.php 
2. เปิดไฟล์ที่เราสร้างในข้อที่ 1 (กรณีผมคือ news.php) เพื่อมาเปลี่ยน ชื่อ class ให้ตรงกับชื่อไฟล์ เราจะเห็นโค้ด เขียนว่า class Welcome extends CI_Controller { ก็เปลี่ยนให้เป็น class News extends CI_Controller { โดยข้อกำหนดของการเปลี่ยนชื่อ class นี้ก็คือ ตั้งชื่อให้ตรงกับชื่อไฟล์ แต่ว่าตัวแรกจะเป็นตัวพิมพ์ใหญ่(แต่ชื่อไฟล์เป็นตัวพิมพ์เล็กทั้งหมดนะครับ) อย่างผมใช้ชื่อไฟล์ news.php ก็ตั้งชื่อ Class ว่า News นั่นเอง
3. เปิดหน้าเว็บทดสอบ ด้วย /index.php/news อย่างของผมก็คือ http://localhost/ci210/index.php/news จะได้หน้าเว็บเหมือนตอนที่เปิดทดสอบแรก ถือว่าท่านทำถูกต้องแล้วครับ
4. หากต้องการทดสอบแก้ไขไฟล์แบบง่ายๆ ให้แก้ใน function index() ครับ โดยเนื้อใน function ก็เขียนง่ายๆว่า echo "test new file"; แล้วเมื่อเรียก URL อีกครั้งเราจะเห็นคำนี้ปรากฏที่หน้าเว็บด้วยครับ

จบแล้วครับ ง่ายๆ ไม่ยากเลย จะสร้างไฟล์ใหม่แล้วเขียน code เหมือนกันก็ได้ หรือว่าจะใช้การ copy paste แล้วแก้เอาแบบตัวอย่างผมก็ได้ครับ เราก็สร้าง controller ได้เหมือนกัน

ทีนี้ จะพูดเรื่อง controller ต่อเลย ก่อนที่จะไปเรื่อง view ก็คือ codeigniter จะทำงานสัมพันธ์กับ URL ด้วย จากตัวอย่างก็เห็นแล้ว ว่าผมสร้าง news เวลาเรียก url ก็เรียกแบบ /news ด้วย (ส่วน /index.php/ ขอกล่าวถึงทีหลัง) ทีนี้ สิ่งที่ท่านต้องรู้เพิ่มเติมก็คือหากเราเติม / หลัง controller มันจะทำหน้าที่เรียก function ใน controller นั้น ยกตัวอย่าง ไฟล์ news.php ที่สร้างเมื่อกี้ ให้ลองเขียน function ใหม่เพิ่มอีกดังนี้ครับ

public function myfunction(){
 echo "this is my function not index";
}

เมื่อ save และรันหน้าเว็บ เราจะเรียก function นี้ได้ด้วย /news/myfunction หรือตัวอย่างผมก็เรียกว่า http://localhost/ci210/index.php/news/myfunction ก็จะได้ข้อความตามที่เรา echo เป๊ะๆเลย แล้วด้วยความเข้าใจนี้ เช่นเดียวกัน ท่านจะเรียก /news/index ได้ด้วยเหมือนกัน(เพราะมี function index อยู่ก่อนแล้วในไฟล์) ซึ่งมันจะได้ผลเหมือน /news เพราะว่า default function จะถูกตั้งเอาไว้ที่ function ที่มีชื่อว่า index() ครับ ทำให้ได้หน้าเว็บที่เหมือนกับ /news/index นั่นเอง

อย่างน้อยตอนนี้ ท่านก็สามารถแยกสร้างระบบการทำงานย่อยๆ ออกจากกันได้แล้ว เหมือนเวลาที่เราสร้างไฟล์ใหม่ในแบบที่เขียน php เก่าๆนั่นล่ะครับ แต่ใน codeigniter เราใช้การสร้าง function เอา ชัดเจนสะอาดกว่ากันเยอะ เรื่องของ controller ก็คงต้องพักเอาไว้ก่อน ไปต่อกันที่เรื่องของ view เลย เพราะว่าอย่างที่บอก controller จะใช้ควบคุมการทำงานเท่านั้น เราจะไม่ใช้การ แสดงผลอะไรออกมาหน้าจอ (ตัวอย่างข้างต้นเป็นสิ่งที่ไม่ถูกต้องนะครับ คือ echo มาตรงๆจาก controller แต่ปกติเราจะใช้ view)

การเขียน view ใน codeigniter

1. เปิดแฟ้ม /application/view หรือว่าแบบเต็มๆจาก path ในเครื่องผมก็คือ "T:\xampp\htdocs\ci210\application\views" แล้ว สร้าง copy ไฟล์ welcome_message.php มาตั้งชื่อใหม่ตามที่เราต้องการ เช่นผมจะตั้งว่า news_myfunction.php
2. เปิดไฟล์ news_myfunction.php มาแก้ไข โดยแก้ไขอะไรก็ได้เต็มที่เลย ขออย่าให้แก้ไขจน error เท่านั้นก็พอ เพื่อเป็นการให้รู้ว่าเป็นไฟล์ที่เราสร้างขึ้นใหม่ครับ
3. เปิดไฟล์ controller ที่เราสร้าง (ของผมคือ news.php) แล้วแก้ไข function myfunction() จากเดิม echo "this is my function not index"; ให้เป็น $this->load->view('news_myfunction'); หรือมันคือชื่อไฟล์ใน view ที่เราสร้างในข้อ 1 นั่นล่ะครับ แต่ไม่มี .php
4. เปิดหน้าเว็บทดสอบที่เดิมคือ /news/myfunction หรือของผมคือ http://localhost/ci210/index.php/news/myfunction จะเห็นว่า ทุกสิ่งอย่างที่แก้เอาไว้ในข้อ 2 ปรากฏที่ตรงนี้หมด

จบแล้วครับ เรื่องของ view ง่ายมั้ยครับ ถ้าเราสังเกตุ ก็จะเห็นว่า ใน controller ไม่มีตัวหนังสือ ส่วนแสดงผลเลย เพราะว่าส่วนแสดงผล ไม่ว่าจะเป็น html code หรือข้อความต่างๆ ถูกย้ายลงไปอยู่ใน view ทั้งหมด

 ด้วยกระบวนการทั้งหมดนี้ คุณจะสร้างหน้าเว็บกี่หน้าก็ได้ ด้วยการ สร้าง function ใน controller ไปเรื่อยๆ เท่านั้นยังไม่พอ ยังสามารถสร้าง หน้าการแสดงผลในแต่ละ URL ได้หลายแบบอีกด้วย ด้วยการเปลี่ยน view ไปเรื่อยๆ (แต่คงไม่มีใครทำมั้ง เว้นแต่คนที่ทำระบบใหญ่ เค้าจะเอาไปทำระบบ customize theme ได้) และ url ที่ได้ก็สวยเลย ไม่มี .php ไม่มีตัวแปร

เรื่องของ URL ผมจะยังไม่กล่าวในบทความนี้ เพราะว่ารายละเอียดมันเยอะ และเอาทำงานกับมันได้อีกหลายรูปแบบเลย เอาเป็นว่าตอนนี้ให้ลองเล่น controller กับ view กันไปก่อนดีกว่า บทความต่อไป จะพูดถึง MVC แบบ full loop แล้วครับ จะได้เอาไปทำเว็บได้จริงๆแล้ว

*ภาคต่อของบทความนี้อ่านต่อได้ที่ step 2 codeigniter กับ database หรือ model