วันพฤหัสบดีที่ 1 ตุลาคม พ.ศ. 2552

SE Project

วิชา Software engineering วิชานี้ทำให้ผมได้มีโอกาสเขียนเวปครั้งแรกในชีวิต(ถ้าไม่นับเวปSantanakarnตอนปีสอง) ไม่ก่อนไม่เคยคิดจะสนใจการเขียนเวปเลย ตอนนี้ก็พอสนอยู่บ้าง เพราะ 1.เมื่อก่อนไม่ถนัดดีไซน์ เพราะก่อนนี้เขียนเวปใช้Dreamweaverกัน คนที่ดีไซน์สวยจะได้คะแนนดีๆ ส่วนคนที่ไม่ถนัดอย่างผมก็ แล้วแต่ดุลยพินิจของอาจารย์ว่าจะเมตตาเท่าไหร่ แต่เด๋วนี้เป็นweb2.0แล้ว เป็นเวปแอปพลิเคชันหมด คนที่เก่งดีไซน์เวปมาใช่ว่าจะทำได้ ส่วนคนที่code โปรแกรมได้ เด่วนี้ก็เลยไม่ต้องเพิ่งดีไซน์เท่าไหร่ เพราะCSS3.0 ทำได้หมดแล้ว ดีกว่า dreamweaverอีก 2. ภาษาที่ใช้เขียนง่ายพอๆ(หรือง่ายกว่า)กับเขียนแอปบนdesktop เพราะมีภาษาให้เลือกเขียนเยอะ syntaxคล้ายกัน มีเครื่องมือช่วยเขียนช่วยดีไซน์เยอะ ด้วยเหตุนี้เองทำให้บอกใครต่อใครได้เพิ่มว่า เขียนอะไรทำอะไรเป็นมากขึ้น

มาดูตัวโปรแจกเลยดีกว่า โปรแจกผมทำกับเพื่อนอีกคนนึง ชื่อ V.i.P melody เป็นเวปแอปพลิเคชั่นที่ เอาไว้อัพโหลดเพลงไว้แชร์กันบนtwitter timeline โดยuser สามารถเข้ามาใช้ได้โดยใช้twitter account ของตัวเอง
หน้าแรกให้ล็อกอินด้วยทวิตเตอร์accountของตัวเอง แล้วตอนล็อกอิน เวปจะใช้twitterapi ไปเช็คว่ามีuser คนนี้อยู่ไหม ถ้ามีจะไปดึงรูปtwitter displaytของaccount นั้นมา แล้วก็จะมาหน้า uploadpage(ว่าจะเปลี่ยนชื่อเป็นhome ตั้งนานแล้ว ไม่ัทัน สั่งไปแล้ว) หน้านี้จะให้user uploadเพลงจากเครื่องแล้ว สามารถพิมพ์message twitterได้เพื่อที่จะtweetไปพร้อมกับlinkเพลงที่อัพ แล้วกดปุ่มupload เพื่ออัพโหลดเพลงและโพสบนtw ส่วนอื่นๆบนหน้านี้ก็จะมีเพลงที่userเคยuploadไว้ สามารถเลือกคลิกเพลงเพื่อฟังได้ รายละเอียดเช่นชื่อ ศิลปิน อัลบัม ปกอัลบัมและflash music play จะถูกแสดง เราสามารถเปลี่ยนรายละเอียดเพลงได้ทุกอย่าง โดยคลิกที่ชื่อ ศิลปิน หรือปก เพื่อเปลี่ยนแก้ไขได้ นอกจากนี้ ถ้าใส่ ชื่อเพลงและศิลปิน ได้ถูกต้อง จะมีรูปปกอัลบัมโหลดมาจากเวปlast.fm มาให้อัตโนมัติ หรือจะเปลี่ยนได้ โดยคลิกที่รูปปกแล้ว หาลิงค์รูปมาใส่ในช่วงที่กำหนดไว้ให้ ก้อจะเปลี่ยนรูปปกเป็นรุปปกนั้น นอกจากนี้ เราสามารถcomment เพลงได้ ในส่วนด้านล่างต่อจากข้อมูลเพลง ในส่วนเพลงที่user เคยโหลดไว้ userสามารถ เอาเพลงนี้มาtweetอีกก็ได้ เพียงกดปุ่ม twitter(รูปตัวTสีฟ้า) และสามารถลบเพลงได้ที่ปุ่มกากบาทสีแดง เมื่อ user อัพโหลดเสร็จ ในtwitter timeline จะปรากฏลิงค์เพลงและข้อความที่เราใส่ เมื่อคนที่followเราเห็นและคลิกเข้ามาฟังก็จะเข้ามาหน้าlisten
หน้าlistenนี้จะผู้ฟังสามารถฟังเพลง อ่านcomment เพิ่มcommentเพลงได้ โดยจะcommentได้ต้องมี twitter account loginก่อน commentทีcommentนี้ จะนำไปแสดงบนtwitter timelineด้วย ผู้ฟังสามารถเลือกฟังเพลงที่userคนที่uploadเพลงได้ทางlistด้านซ้าย ทุกเพลงผู้ฟังสามารถ tweetเพลงนั้นได้ พร้อมข้อความ โดยคลิกปุ่มtweet(ตัวTสีฟ้า) จะมีกล่องข้อความให้กรอก message สามารถtweetได้มากกว่า 1เพลง ต่อครัั้ง โดยกดเลือกได้เท่าที่ต้องการ โดยตัวอักษรรวมต้องไม่เกิน140ตัว
ทุกส่วนทุกฟังก์ชั่นของหน้าuploadpageและlisten จะแสดงในลักษณะของdynamic ไม่มีการrefreshหน้าเลย เป็นผลจากการให้Ajax เปลี่ยนข้อมูลเฉพาะหน้า ทำให้เราสามารถออกแบบการทำงานของเวปได้ตามที่เราต้องการ ความเร็วอาจจะเร็วกว่าหรือพอๆ กับการโหลดทั้งหน้า แต่ก็ช่วยให้หน้าเวปเรามีความยืดหยุ่นขึ้น น่าใช้ขึ้น
โปรแจกนี้ใช้เวลาทำจริงๆประมาณ1เดือน กับ2อาทิตย์ เริ่มต้นจากการเขียนPHPขั้นต้นจริงๆ ตามด้วย การใช้APIของ twitter ต่อด้วย การใช้Ajax และjavascriptเปลี่ยนข้อมูล หัดใช้CSSแต่งเวป ออกแบบDatabase เขียนโมดูลต่อและดึงข้อมูลจากDatabase พยายามให้เป็นMVCที่สุด สุดท้ายแล้วถึงจะบักเยอะไปหน่อย เช่น เพลงไทยอัพแล้วฟังไม่ได้ sessionยังงงอยู่ และอื่นๆเล็กน้อยๆ แต่ก็ได้เรียนรู้การเขียนเวปแอปไปไม่มากก็น้อยเลยทีเดียว เรายังต้องเรียนรู้อะไรอีกเยอะมากมาย เพื่อฝึกฝนให้ชำนาญ เป็นมืออาชีพ และทุกวันเทคโนโลยีก็ไม่ได้อยู่กับที่ ทุกๆวันมีการเปลี่ยนแปลงเสมอ และเราก็อยู่ในจุดที่ควรจะสนใจมันให้มากที่สุด เพราะไม่นานสิ่งที่เราทำอยู่ก็จะกลายเป็นสิ่งที่ล้าหลังอย่างรวดเร็วเพียงไม่กี่ปี

ไม่มีความคิดเห็น:

แสดงความคิดเห็น