เขียนเว็บและใช้ source code control

เขียนเว็บและใช้ source code control

จริงๆแล้ว การทำ source code control มักไม่นิยมกันในคนที่ไม่มืออาชีพ เพราะว่าเห็นว่ามันไม่มีความสำคัญ และไม่มีความจำเป็นต้องใช้ ยอมรับภาระเสี่ยง เพื่อแลกกับความสะดวก คล่องตัวต่างกันเล็กน้อย (ซึ่งเค้าคิดเองว่าคุ้ม)

วันนี้ ก็จะมาขายของ(ฟรี) ด้วยการทำ SVN แบบมืออาชีพ ที่เค้าใช้งานกัน รวมทั้งการใช้ server จริงๆด้วยครับ จริงๆแล้วการทำ SVN server เราสามารถมาจำลองใส่ในเครื่องตัวเองได้ แต่ว่าเราไม่นิยม เพราะว่าเวลาไปทำงานทีอื่นมันเข้า access ไม่ได้นั่นเอง เราจึงข้ามไป (แตกต่างจากการทำ localhost นะครับ)

ทำความเข้าใจ SVN

ตามที่เล่าให้ฟังไปก่อนแล้ว ว่า SVN ต้องมีสองส่วนคือ server กับ client (อ่านเพิ่มเรื่อง source control) โดยส่วน client นั้น ให้ download program Tortoise SVN client มาใช้ http://tortoisesvn.tigris.org/ จริงๆ มีหลายตัว แต่คนส่วนใหญ่นิยมตัวนี้ เพราะว่ามันใช้งานง่ายครับ  โดยเมื่อเรา download มาติดตั้งแล้ว ไม่ต้องหาโปรแกรมนะครับ (เหมือนผม 555) เพราะว่าตัว tortoise นี้ มันจะแทรก ในคลิกขวาของเราครับ สังเกตุจากเวลาที่เราคลิกขวาที่ folder ใดๆ จะมีเมนูส่วน tortoise svn เพิ่มขึ้นมา ใช้งานจากตรงนั้นนั่นล่ะครับ


ตอนนีถือว่าทุกท่านได้ ติดตั้งเรียบร้อยแล้วนะครับ(ถ้ายังก็ download มาติดตั้งนะครับ เดี๋ยวตามไม่ทัน) แต่ยังขาดอีกองค์ประกอบนึง จึงจะเริ่มใช้งานได้ นั่นก็คือ ส่วนของ server แนะนำให้หาของฟรี โดยผมก็หามาให้อีกแล้วเช่นกัน นั่นคือที่ http://www.xp-dev.com/register เมื่อเปิดมาแล้ว ก็กรอกข้อมูลเพื่อสมัครได้เลยนะครับ อ้อ ไม่ต้องตกใจนะครับ เพราะว่าฟรีครับ อ่านได้ที่นี่ http://www.xp-dev.com/pricing โดยเราจะได้พื้นที่เก็บงานของเรา 200 MB และเก็บงาน private  ได้ 2 งาน(งานที่เราไม่ต้องการเปิดเผย source code สู่สาธารณะชน) และมี user เข้าใช้งานร่วมกันได้ไม่จำกัด

เมื่อเราสมัครแล้วเรียบร้อย เราก็จะมี server กับ client ที่เราได้ติดตั้งไปก่อนหน้านี้พร้อมเริ่มการทำ source code control กันแล้วนะครับ

ให้เราเริ่มต้นด้วยการสร้าง project ใน xp-dev.com ก่อนเลย โดยการ login แล้วเข้าไปที่หน้า dashboard จะมีเมนูที่เขียนว่า project แล้วเราก็กดเข้าไป จากนั้นกรอกรายละเอียดที่ด้านล่างได้เลย ตั้วชื่อตามใจ แต่งดใช้ อักขระพิเศษ หรือ ภาษาไทยครับ

จากนั้น เราจะมีที่เก็บ project ของเราแล้ว ขั้นต่อไป เราจะเปิดการทำ source control สำหรับ project นี้ โดยคลิกที่เมนู source control  และคลิกที่ enable Source Control โดยให้เราตั้งชื่อ เหมือน project ก็ได้ และงดใช้ภาษาไทย หรืออักขระพิเศษ


โดยเสร็จแล้วเราจะได้หน้าที่แสดงรายละเอียดการทำ source control ของเราแล้ว เราจะเริ่มการเชื่อมต่อ ระหว่าง เครื่องเรา (ที่ถือว่าเป็น client) และ xp-dev.com (ที่ถือว่าเป็น server) โดยการจะเชื่อมกันได้ เราจำเป็นต้องใช้ URL ของ project เรา (เค้าเรียกว่า Repository URL)  ดังที่ปรากฏในภาพ  อย่างของผมคือ http://svn2.xp-dev.com/svn/meewebfree/


กลับมาที่เครื่องเราครับ ให้เราสร้างแฟ้มเปล่าขึ้นมา 1 แฟ้ม โดยจะใช้ชื่อเดียวกับ project ที่เราสร้างหรือไม่ก็แล้วแต่เรา จากนั้นคลิกขวา แล้วเลือก >> SVN Checkout จากนั้น จะปรากฏหน้าต่างถามข้อมูล เราก็กรอกลงไป โดย URL ให้ใส่ตามที่แต่ละคนได้รับมานะครับ และระบบจะเด้งมาถาม username password เราก็กรอกไปเหมือนตอนที่เราสมัครเลย


เมื่อเสร็จแล้วเราก็จะได้หน้าตาแบบนี้เลย จบกระบวนการเริ่มต้นใช้งาน SVN แล้วครับ โดยเราจะเห็นได้ว่า แฟ้มที่เราเก็บงานนั้น จะปรากฏมี icon สีเขียวกับเครื่องหมายถูกที่ด้านหน้า นั่นแปลว่า update ล่าสุดแล้วเรียบร้อยครับ เราก็เริ่มเอาเว็บมาใส่ หรือสร้างเว็บภายใต้แฟ้มนี้ตามปกติได้เลย


โดยผมจะเริ่มด้วยการสร้าง index.html ขึ้นมา จะเห็นว่า หน้าตาไฟล์ขึ้นเป็นเครื่องหมายปริศนาสีน้ำเงิน ซึ่งเป็นที่รู้กันว่า เครื่องหมายนี้หมายถึง ไฟล์นี้ ยังไม่มีในระบบของ Source control ดังนั้น เราก็ต้อง add เข้าระบบ source control ด้วยการคลิกขวาเลือก Tortoise SVN >> Add


เมื่อเสร็จแล้วเราจะพบว่าไฟล์เปลี่ยนเป็นเครื่องหมาย + นั่นแปลว่า ไฟล์นี้ เป็นไฟล์ที่ถูกเพิ่มใหม่นั่นเอง โดยทุกไฟล์จะมี icon เป็นแบบสื่อความหมายแบบนี้เหมือนกันหมดนะครับ


เมื่อแก้ไขจนพอใจแล้ว ต้องการให้ระบบจดจำการแก้ไขครั้งนี้ไว้ จะทำได้ด้วยการ commit ซึ่งเป็นสิ่งที่ต้องทำเสมอครับ หลังจากที่เราแก้ไขงานเสร็จ เป็นส่วนๆตามที่เราต้องการแล้ว

การ commit ทำได้ด้วยการคลิกขวา แล้วเลือก SVN commit โดยการ commit จะทำเป็นไฟล์ หรือว่าทำที่แฟ้มด้านนอกสุดครั้งเดียวก็ได้ (ส่วนใหญ่จะนิยม commit ที่แฟ้มด้านนอกครั้งเดียว เพราะว่ามันจะ commit ทุกไฟล์)

โดยการ commit แต่ละครั้งจะเป็นเหมือนกับการ check point เป็นจุดๆไป โดยเราจะใส่ comment ได้ เพื่อให้รู้ว่า ณ จุดนี้เราได้ทำอะไรไปบ้างแล้ว ไปเรื่อยๆ ซึ่งเราสามารถดูพวกนี้ย้อนหลังได้ทั้งหมดเช่นกัน (ดูได้ตามจุดที่เราได้ commit ไว้)

โดยทุกครั้งที่ มีการแก้ไขไฟล์ใดๆก็ตาม ไฟล์นั้น จะปรากฏเป็นเครื่องหมายตกใจสีแดง เพื่อเป็นเครื่องบอกว่า ไฟล์มีการแก้ไข และยังไม่ถูก commit ให้เราทำการ commit มันด้วย

สำหรับบางคนอาจจะมีข้อสงสัย ว่าเราต้อง commit บ่อยแค่ไหน ทุกครั้งที่ save ไฟล์ หรือว่า วันละครั้ง หรือว่า สัปดาห์ละครั้ง อันนี้เป็นคำตอบที่ตอบเจาะจงได้ยากมากครับ แต่ผมอยากให้มองงานที่เราทำอยู่แตกมาเป็นส่วนย่อยๆ โดยเมื่อเราเขียนส่วนย่อยๆนั้นเสร็จ และ test หรือทำ unit test เรียบร้อยแล้ว เราจึง commit ก็น่าจะดีครับ แต่ถ้าจะมากกว่านี้หรือน้อยกว่านี้ก็ไม่มีใครว่านะครับ ไม่ต้องกลัวว่า commit บ่อยแล้วเค้าจะว่า (เพราะว่ามันก็แค่ทำให้เปลืองพื้นที่เก็บไฟล์เท่านั้นเอง) เอาตามความเหมาะสมและความพอใจครับเพราะว่า commit บ่อย ก็เปลืองพื้นที่ และเวลาที่เราจะย้อน version ก็จะคุ้ยเยอะแยะครับ หายากอีก แต่ถ้า commit ห่างมาก เวลาย้อน version มันจะต่างกันไปเยอะมากๆ

ต่อที่เรื่องการ ย้อน version สมมุติ ไฟล์ index.html ของผม ตามตัวอย่างเมื่อกี้มีเนื้อหาดังนี้ 

ซึ่งเป็น reversion ที่ 3 แล้ว แต่ผมแก้ไขผิด อย่างย้อนไปเป็น version ที่1 ก็ทำได้ด้วยการ คลิกขวา เลือก TortoiseSVN >> Update to revision  แล้วเราจะได้หน้าต่างถาม version ที่เราต้องการ หากเราจำไม่ได้ ก็กดปุ่ม show log เพื่อดูในแต่ละ version ได้ เราพอใจที่จุดไหนก็เลือกเอามาใช้ได้เลย (นี่ละครับ ทำให้ commentมีความสำคัญ)



หรือถ้าอยากรู้ว่า version ที่เราทำงานอยู่ตอนนี้ กับ version เก่าๆ นั้นต่างกันตรงไหนก็ทำได้ ด้วยการ diff โดย คลิกขวาที่ไฟล์ >> TortoiseSVN >> Diff with previous version จะได้หน้าต่างแบบนี้เลย โดยฝั่งซ้ายคือ version เก่า ฝั่งขวาคือ version ปัจจุบัน

โดยเหลืองๆฝั่งขวาคือสิ่งที่เราเพิ่มเข้าไปนั่นเอง 


หลายคนอาจจะสงสัย ว่านี่เราต้องทำอะไรยุ่งยากเหล่านี้ด้วยหรือ คำตอบคือ ไม่จำเป็นเสมอไป หากว่างานที่คุณทำเป็นแค่หน้าเว็บ HTML ที่ไม่ได้สำคัญอะไรมาก และไม่มีผลกระทบต่ออะไร หรือ ใคร หากว่ามีการเปลี่ยนแปลงใดๆเกิดขึ้น ทั้งนี้เป็นเพราะว่าหน้าเว็บ HTML ธรรมดา มันไม่ได้มีความซับซ้อนอะไรในตัวมันเองเลย รวมทั้งเป็นการทำงานที่ อิสระต่อไฟล์อื่นๆ หรือระบบใดๆด้วย ดังนั้น ไม่จำเป็นต้องเอา SVN มาใช้ให้เสียเวลา 

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

หรือวันที่เกิดเหตุไม่คาดฝันกับคอมพิวเตอร์ที่คุณทำงาน เช่นกำลังนั่งทำเว็บมานาน 1เดือน โดยเทสแต่ใน localhost เครื่องตัวเองอย่างเดียวโดยตลอด ทำงานมาคนเดียวอยู่ตั้งนาน แล้วมาวันหนึ่ง Harddisk เกิดอาการหัวอ่านหลุด (นั่นแปลว่า ข้อมูลสูญหายแบบกู้คืนไม่ได้ทั้งหมด หากไม่ซ่อมหัวอ่าน ซึ่งไม่มีใครเค้าทำกัน) แล้วงานที่ทำมาตลอด จะทำอย่างไร..... ใครจะช่วยอะไรได้บ้างไหม.... คำตอบคือไม่มีนะครับ หากเราไม่วางแผนช่วยเหลือตัวเองในอนาคตก่อน ก็คงไม่มีใครช่วยอะไรได้

หลายคนอาจจะสงสัยว่า แล้วการทำ SVN เนี่ย มันต่างจากการที่ backup ด้วยการ copy และ paste เพิ่มมาอีก 1 แฟ้ม แล้ว rename ให้เป็น version 1 2 3 .... กันตรงไหน คำตอบก็คือ ต่างกันตรง ปริมาณ พื้นที่ ที่ใช้จัดเก็บ และความชาญฉลาดครับ เพราะว่าการ backup โดยใช้การ copy นั้นทำได้เร็ว แต่หากว่าเว็บมีเป็นหมื่นไฟล์ล่ะ คุณจะรู้ได้อย่างไร ว่า version ที่ 1 กับสอง กับสาม ต่างกันตรงไหน? แล้วไฟล์ที่ไม่เคยถูกแก้ไขเลย ตั้งแต่ version ที่ 1 ทำไมต้องถูกทำซ้ำขึ้นมาตั้งสามชุดด้วยล่ะ? หรือ บางคนอาจจะแก้ไขด้วยการ copy backup เฉพาะไฟล์ ก่อนเริ่มแก้ไขไฟล์นั้นๆ คำถามก็คือ ถ้าเราแก้ไข 10 รอบ แฟ้มที่เราทำงาน ไม่เต็มไปด้วยขยะไฟล์เหล่านี้ รกสกปรกไปหมดหรือ? เพราะว่าผมเคยเจอมาแล้ว ที่เว็บหนึ่งมี index สิบกว่าไฟล์ในชื่อที่แตกต่างกันไปเรื่อยๆ เช่น indexx iindex -index --index index2 index-3 ฯลฯ

ถามว่าคุ้มค่าหรือไม่ ที่จะเสียเวลาใช้ ก็คงตอบได้แค่ว่า ท่านชอบแบบ ไม่เห็นโลงศพไม่หลั่ง น้ำตา หรือ กันไว้ดีกว่าแก้ ล่ะครับ

อ้อ เกือบลืมแน่ะ อีกปัญหานึง ที่ท่านจะเจอได้ ก็คือการ เอาเว็บจากเครื่อง ขึ้นบน server โดยอาศัย FTP อาจจะเป็นความลำบาก เพราะว่ามันจะติดแฟ้มที่เป็น hidden file ชื่อว่า .svn ขึ้นไปด้วย  แต่ปัญหานี้แก้ไขได้ด้วยการไปตั้ง filter ในโปรแกรม FTP ที่ท่านใช้งานครับ  แต่สำหรับ FileZilla version ล่าสุดก็มองไม่เห็นอยู่แล้วครับ จึงไม่ต้องกังวลว่าจะติดไปตอน upload ด้วย

ทั้งนี้ อย่างที่ผมได้เล่าให้ฟังไปแล้วตั้งแต่ตอนต้นเลย ว่าทุกอย่าง ต้องแก้ที่ความคิดก่อนครับ หากเรายังไม่แก้ที่ความคิดของเรา เชื่อผมเถอะครับ ใช้ได้แค่เดือนเดียว(หรือน้อยกว่านั้น) ก็เลิกใช้แล้ว

ท้ายนี้ถ้าสงสัยส่วนใดหรือข้อมูลจุดใดไม่ถูกต้องก็สามารถพูดคุยกันได้ที่ด้านล่างเลยครับ

Create: Modify : 2010-10-11 10:04:48 Read : 6890 URL :