SlideShare a Scribd company logo
1 of 51
Download to read offline
เว็บแอพพลิเคชัน มิวสิ ค โซเชียล
                                ่

                           Music Social




                               โดย

              นายคมสัน        ไผ่งาม รหัส 52018096

              นายปิ ยกุล      รุ่ งแกร รหัส 52026730




  โครงงานนี้เป็ นส่ วนหนึ่งของการศึกษาหลักสู ตรวิทยาศาสตร์ บณฑิต
                                                            ั
สาขาวิชาเทคโนโลยีสารสนเทศและการสื่ อสารคณะเทคโนโลยีสารสนเทศ
                          มหาวิทยาลัยศรี ปทุม
                              พ.ศ.2554
ก
                                   มหาวิทยาลัยศรี ปทุม
                                 คณะเทคโนโลยีสารสนเทศ



                                          โครงงาน
                                            ของ

                          นาย คมสัน         ไผ่งาม รหัส 52018096
                          นาย ปิ ยกุล       รุ่ งแกร รหัส 52026730



                                            เรื่ อง
                              เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล
                                        (Music Social)

   ได้รับการตรวจสอบและอนุ มติให้เป็ นส่ วนหนึ่งของการศึกษาตามหลักสู ตรวิทยาศาสตร์ บณฑิต
                           ั                                                       ั
                     สาขาวิชาเทคโนโลยีสารสนเทศและการสื่ อสาร

                               เมื่อ วันที่ 23 กันยายน พ.ศ. 2555

ประธานกรรมการ                                            _____________________________
                                                        (                              )

กรรมการ                                                 _____________________________
                                                        (                             )

กรรมการและอาจารย์ที่ปรึ กษา                             _____________________________
                                                        (                             )

กรรมการและเลขานุการ                                     _____________________________
                                                        (                             )
ข


บทคัดย่อ       ระบบเว็บไซต์สังคมเพลง มิวสิ ค โซเชียล
               (Music Social, จานวน 40 หน้า)
โดย            นายคมสัน        ไผ่งาม         รหัส 52018096
               นายปิ ยกุล      รุ่ งแกร       รหัส 52026730
อาจารย์ทปรึกษา อาจารย์ชฎาพร เกตุมณี
        ี่

         โครงงาน ระบบเว็บไซต์สังคมเพลง มิ วสิ ค โซเชี ย ล มี จุดประสงค์ในการจัดท าเพื่ อเป็ น
เว็บไซต์เพื่อศึกษาระบบ เว็บแอพพลิเคชัน และเป็ นการพัฒนาทางด้านการให้บริ การอีกทางด้านหนึ่ ง
                                         ่
ของโซเชียล เน็ตเวิร์กที่ช่วยให้ผที่สนใจในการหาสังคมใหม่ๆ ที่สามารถแชร์ เสี ยงหรื อเพลง รู ปภาพที่
                                ู้
ตัวเองมีให้ผอื่นได้ฟังได้ดู ได้แลกเปลี่ ยนความคิดเห็นเป็ นสังคมออนไลน์ที่เข้ามาเป็ นส่ วนหนึ่ งใน
             ู้
ชี วิต ประจ าวัน ของใครหลายๆคนในปั จ จุ บ ัน เหมื อนเป็ นโลกอี ก โลกหนึ่ ง ที่ ใ ช้ใ นการแสดง
ความสามารถแชร์ให้ผอื่นได้
                      ู้

        เว็บไซต์ที่ได้พฒนาขึ้นมานี้ เป็ นการทางานผ่านทางอินเตอร์ เน็ต โดยใช้ภาษา Ruby ในการ
                       ั
เขียนโปรแกรม ซึ่งสามารถเชื่อมต่อกับฐานข้อมูล SQLite ได้

           ในการจัดทาโครงงานนี้ได้นาโปรแกรมสาเร็ จรู ปมาใช้ในการเขียนโปรแกรม เช่น Ruby on
Rails, SQLite เข้ามาช่วยในการพัฒนาระบบซึ่ งประกอบไปด้วย 2 ส่ วนคือ ส่ วนแรก จะนาโปรแกรม
สาเร็ จรู ปมาช่วยในการออกแบบหน้าจอ (Webpage) ที่ใช้ติดต่อกับผูใช้ ส่ วนที่สอง ตัวโปรแกรมของ
                                                              ้
ระบบนาเอาภาษา HTML, Ruby มาช่วยในการเขียนโปรแกรมในส่ วนต่างๆ เช่น การเข้าสู่ ระบบ การ
อัพโหลดรู ปภาพ การแสดงความคิดเห็นต่างๆ เป็ นต้น ซึ่งสามารถทาการติดต่อกับฐานข้อมูลได้อย่าง
สมบูรณ์และมีประสิ ทธิภาพ

      จากการพัฒนาโครงงานนี้ ทาให้สามารถให้บริ การแก่ผูใช้งานด้านความบันเทิงทางสังคมบน
                                                      ้
โลกออนไลน์ ได้อย่างสะดวกและรวดเร็ ว ระบบสามารถตอบสนองความต้องการของผูใช้งานได้
                                                                          ้
ค
                                    กิตติกรรมประกาศ
        ผูจดทาโครงงาน เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล (Music Social) จะเกิดขึ้นไม่ได้ถาหาก
          ้ั                                                                            ้
ขาดการสนับสนุนจาก บุคคลหลายท่าน ผูจดทาโครงงานจึงใคร่ ขอขอบคุณท่านต่างๆ ดังนี้
                                  ้ั
        ขอขอบพระคุณอาจารย์ทุกท่านที่มีส่วนให้โครงงานนี้ ผานไปได้ดวยดี รวมถึงความรู้ในทาง
                                                         ่       ้
วิชาการและประสบการณ์ชีวตในด้านต่างๆ
                       ิ
        ขอขอบพระคุณอาจารย์ อาจารย์ชฎาพร เกตุมณี อาจารย์ที่ปรึ กษาสาหรับโครงงาน ที่คอย
ช่วยเหลือ ให้คาแนะนาต่างๆ จนทาให้โครงงานประสบความสาเร็ จไปได้ดวยดี
                                                              ้
        ขอกราบขอบพระคุณบิดามารดา ครอบครัว รวมถึงญาติทุกคน ของผูจดทาโครงงานที่คอย
                                                               ้ั
เป็ นกาลังใจให้ตลอดเวลา สนับสนุ นทางด้านค่าใช้จ่ายในการจัดทาโครงงานนี้ คอยอบรมสั่งสอน
ชี้แนะสิ่ งต่างๆให้ผจดทาได้ประสบความสาเร็ จจนถึงทุกวันนี้
                    ู้ ั
        ขอขอบคุณเพื่อนๆ พี่ๆที่คอยให้กาลังใจ คอยช่ วยเหลื อให้คาแนะนาปรึ กษา และให้ความ
ช่วยเหลือในการจัดทาโครงงานนี้ ตลอดเวลา และขอบคุณคณะเทคโนโลยีสารสนเทศ ที่มีวิชานี้ ข้ ึนมา
เพื่อให้ผจดทาได้พฒนาเว็บไซต์ของตนเองขึ้นมา โดยใช้ความรู ้ และประสบการณ์ที่ได้เรี ยนมาทั้งสิ้ น
         ู้ ั    ั
มาใช้ในการเขียนโปรแกรมจนสาเร็ จลุล่วงไปได้ดวยดี
                                           ้
ง
                                                 คานา

       การจัดทาโครงงาน “เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล” นี้ เป็ นส่ วนหนึ่ งของวิชา ICT 492
โครงงานคอมพิ วเตอร์ (Computer Project Preparation) ของหลัก สู ตรวิทยาศาสตร์ บณฑิ ต
                                                                             ั
คณะเทคโนโลยีสารสนเทศ มหาวิทยาลัยศรี ปทุม สาหรับนักศึกษาปี สุ ดท้าย เพื่อให้นกศึกษาได้นา
                                                                            ั
ความรู ้ ที่เรี ยนมาทั้งหมดมาประยุกต์ใช้ในการพัฒนาระบบเป็ นการทดสอบความรู ้ ความสามารถและ
การเพิ่มประสบการณ์ก่อนสาเร็ จการศึกษาจากสถาบัน

       โครงงาน “เว็บไซต์สังคมเพลง มิวสิ ค โซเชี ยล” จัดทาขึ้นเพื่อเป็ นการเพิ่มช่ องทางในการหา
สังคมความบันเทิง บนโลกอินเตอร์ เน็ตอีกเว็บ หนึ่ ง โดยผูใช้สามารถติดตามการโพสข้อความ การ
                                                       ้
อัพเดทเพลงการแชร์รูปของคนที่เราสนใจได้

       ทั้งนี้ ผูจดทาโครงงานหวังเป็ นอย่างยิ่งว่าเว็บไซต์น้ ี อาจเป็ นประโยชน์ต่อผูที่มีความสนใจใน
                 ้ั                                                                ้
การพัฒนาเว็บไซต์ หรื อผูที่สนใจ ได้มาศึกษาเพิ่มเติมพร้อมทั้งได้นาแนวทางไปพัฒนาต่อยอดให้เกิด
                        ้
ประโยชน์ยงๆ ขึ้นไป
         ิ่



                                                                             นายคมสัน ไผ่งาม
                                                                             นายปิ ยกุล รุ่ งแกร
                                                                                   กันยายน 2555
จ
                                          สารบัญ

                                                                              หน้ า
หน้าอนุมติั                                                                   ก
บทคัดย่อ                                                                      ข
กิตติกรรมประกาศ                                                               ค
คานา                                                                          ง
สารบัญ                                                                        จ
สารบัญรู ป                                                                    ช
สารบัญตาราง                                                                   ฌ
บทที่ 1 บทนา
         1.1 ความเป็ นมาและความสาคัญของปั ญหา                                 1
         1.2 วัตถุประสงค์                                                     1
         1.3 ขอบเขตการศึกษา                                                   2
         1.4 นิยามศัพท์เฉพาะ                                                  2
         1.5 ประโยชน์ที่คาดว่าจะได้รับ                                        2
         1.6แผนการดาเนินงาน                                                   3
         1.7 เครื่ องมือที่คาดว่าจะต้องใช้                                    3
บทที่ 2 แนวคิด ทฤษฎีและเอกสารที่เกี่ยวข้อง
         2.1 เทคโนโลยีที่ใช้                                                  5-8
บทที่ 3 การวิเคราะห์และออกแบบ
         3.1 แผนภาพบริ บท (Use Case Diagrams)                                 9
         3.2 แผนภาพบริ บท (Context Diagram)                                   10
         3.2 แผนภาพกระแสข้อมูล (Data Flow Diagram)                            10
         3.3 แผนภาพความสัมพันธ์ระหว่างเอนทิตี (Entity-Relationship Diagram)   12
         3.4 ตารางฐานข้อมูล ( Data Table )                                    13
         3.5 ผังงานโครงสร้างระบบ (Flow Chart)                                 16
บทที่ 4 การพัฒนาโปรแกรม
         4.1 อุปกรณ์และโปรแกรมที่ใช้                                          24
         4.2 การทางานทั้งหมดของโปรแกรม                                        26
ฉ
                                     สารบัญ(ต่ อ)
                                                     หน้ า
บทที่ 5 สรุ ปผลการศึกษา การอภิปรายผล และข้อเสนอแนะ
         5.1 สรุ ปโครงงาน                              31
         5.2 ปั ญหาที่เกิดขึ้น                         31
         5.3 วิธีแก้ปัญหา                              32
         5.4 ข้อเสนอแนะ                                32
บรรณานุกรม                                             40
ภาคผนวก
ช
                                         สารบัญรู ป
                                                                                   หน้ า
3.1 แผนภาพบริ บท (Use Case Diagrams)                                                9
3.2.1 แผนภาพบริ ษท (Context Diagram)
                        ั                                                           10
3.3.1 กระบวนการที่ 1.0 สมาชิก                                                       11
3.3.2 กระบวนการที่ 2.0 เข้าสู่ ระบบ                                                 11
3.3.3 กระบวนการที่ 3.0 แก้ไข                                                        11
3.3.4 กระบวนการที่ 4.0 อับโหลดเพลง                                                  11
3.3.5 กระบวนการที่ 5.0 อับโหลดรู ป                                                  11
3.3.6 กระบวนการที่ 6.0 ลบไฟล์                                                       11
3.3.7 กระบวนการที่ 7.0 ปรับปรุ งข้อมูล                                              11
3.3.8 กระบวนการที่ 8.0 ความสัมพันธ์                                                 11
3.4 แผนภาพความสัมพันธ์ระหว่างเอนทิตีที่มีคุณสมบัติ (Entity-Relationship Diagram)    12
3.5การออกแบแฟ้ มข้อมูล (Data Table)                                                 13
3.6.1 การเข้าสู่ ระบบ                                                               16
3.6.2 การสมัครสมาชิก                                                                17
3.6.3 การอัพโหลดรู ปภาพ                                                             18
3.6.4 การอัพโหลดเพลง                                                                19
3.6.4 การเล่นเพลง                                                                   20
3.6.4.1 ระบบการเล่นเพลง                                                             20
3.6.5 การPOST ข้อความ                                                               21
3.6.5.1 ระบบการเก็บ POST                                                            21
3.6.6 ระบบการเข้าใช้งาน Admin                                                       22
3.6.6.1 ระบบ Admin                                                                  23
รู ปที่ 6.1 หน้าเว็บ มิวสิ ค โซเชียล (Music Social)                                 33
รู ปที่ 6.2 หน้า สมัครสมาชิก                                                        34
รู ปที่ 6.3 ฟ้ อง error กรณี ชื่อซ้ ากัน                                            34
รู ปที่ 6.4 ฟ้ อง error กรณี password ไม่ตรงกัน                                     35
รู ปที่ 6.5 ฟ้ อง error กรณี e-mail ซ้ ากัน                                         35
รู ปที่ 6.6 ฟ้ อง Error กรณี กรอกข้อมูลไม่ครบ                                       36
รู ปที่ 6.7 หน้า Login เข้าระบบ                                                     36
ซ
                                  สารบัญรู ป(ต่ อ)
                                                     หน้ า
รู ปที่ 6.8 แสดงหน้า Login แล้ว                       37
รู ปที่ 6.9 อัพโหลดเพลง                               37
รู ปที่ 6.10 เล่นเพลงได้                              38
รู ปที่ 6.11 อัพโหลดรู ป                              38
รู ปที่ 6.12 ดูรูปที่อพโหลดได้
                      ั                               39
ฌ
                                     สารบัญตาราง
                                                                              หน้ า
ตารางแผนการดาเนินงาน(Gantt chart)                                              4
ตาราง USER                                                                     13
ตาราง ADMIN                                                                    14
ตาราง MUSIC                                                                    14
ตาราง PHOTO                                                                    14
ตาราง POST                                                                     15
ตาราง FRIEND                                                                   15
ตารางที่ 4.1 แสดงรายชื่อฮาร์ ดแวร์ ท้ งหมดที่ใช้จริ ง
                                      ั                                        24
ตารางที่ 4.2.1 ซอฟต์แวร์ที่ใช้จริ ง                                            25
ตารางที่ 4.2.2 ใช้ในการทาเอกสาร                                                26
ตารางที่ 4.3.1 แสดงกระบวนการการทางานของ กระบวนการ 1.0 หน้าหลัก                 26
ตารางที่ 4.3.2 แสดงกระบวนการการทางานของ กระบวนการ 2.0 สมัครสมาชิก              27
ตารางที่ 4.4.3 แสดงกระบวนการการแก้ไขข้อมูลสมาชิก กระบวนการ 3.0 แก้ไขชื่อสมาชิก 27
ตารางที่ 4.4.4 แสดงกระบวนการโพสต์ ข้อความ กระบวนการ 4.0 ข้อความ                28
ตารางที่ 4.4.5 แสดงกระบวนการลบโพสต์ ข้อความ กระบวนการ 5.0 ลบข้อความ            28
ตารางที่ 4.4.6 แสดงกระบวนการอับโหลดไฟล์เพลง กระบวนการ 6.0 การอับโหลดไฟล์เพลง 29
ตารางที่ 4.4.7 แสดงกระบวนการลบไฟล์เพลง กระบวนการ 7.0 ลบไฟล์เพลง                29
ตารางที่ 4.4.8 แสดงกระบวนการอับโหลดไฟล์รูป กระบวนการ 8.0 อับโหลดไฟล์รูป        29
ตารางที่ 4.4.9 แสดงกระบวนการลบไฟล์รูป กระบวนการ 9.0 ลบไฟล์รูป                  29
ตารางที่ 4.4.10 แสดงกระบวนการการทางานของผูดูแลระบบ กระบวนการ 10.0 ผูดูแลระบบ 30
                                                      ้                ้
1




                                                บทที่ 1
                                                บทนำ


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


2.วัตถุประสงค์
1.เป็ นการสร้างกลุ่มเพื่อนทางอินเตอร์เน็ต
2.เป็ นช่องทางการ แชร์ รูป, อัพเดท เพลง
3.เปิ ดช่องทางการแลกเปลี่ยนแสดงความคิดเห็น
2




3.ขอบเขตกำรศึกษำ
        1.กำรลงทะเบียนเป็ นสมำชิก
        1.1 ผูใช้สามารถกาหนดชื่อผูใช้ รหัสผ่านได้ในการเข้าสู่ ระบบ
              ้                   ้
        1.2 ส่ วนของข้อมูลสมาชิก ผูใช้สามารถระบุชื่อ และอีเมล์
                                   ้
        2.กำรใช้ งำนของสมำชิก
        2.1 ผูใช้สามารถอัพโหลดเพลงเพื่อแบ่งปั นแนวเพลงที่เราชอบให้คนอื่นที่มีความ
              ้
        สนใจเข้ามารับฟังได้
        2.2 ผูใช้สามารถแสดงความคิดเห็นเกี่ยวกับแนวเพลงที่รับฟังได้
              ้
        2.3 มีพ้ืนที่ในการเก็บไฟล์ที่ผใช้อบโหลดขึ้นไป
                                      ู้ ั
        2.4 ผูใช้สามารถติดตามสมาชิกที่โพสเพลงที่ชื่นชอบได้
              ้
        3.ส่ วนผู้ดูแลระบบ
        3.1 สามารถเพิ่ม ลบ แก้ไข ข้อมูลเพลงได้
        3.2 สามารถเพิม ลบ แก้ไข ข้อความต่างๆได้
                     ่


4.นิยำมศัพท์เฉพำะ
Ruby เป็ นภาษาคอมพิวเตอร์ ที่มีลกษณะเป็ นโปรแกรมแปลภาษา (interpreter) เหมือนกับ Perl,
                                ั
Python, Java
Rails เป็ นระบบเฟรมเวิร์กสาหรับเว็บแอปพลิเคชันแบบโอเพนซอร์ส ที่พฒนาด้วยภาษารู บี
                                                                ั


5.ผลทีคำดว่ำจะได้ รับจำกกำรทำโครงงำน
      ่
1. เป็ นเว็บไซด์ที่ได้รับความนิยมในการแลกเปลี่ยนแชร์ รูป ไฟล์เพลง
3




6.แผนกำรดำเนินงำน
1. ศึกษาทฤษฎีและเทคโนโลยีที่ใช้ในการสร้างเว็บไซต์
2. การรวบรวมข้อมูล ที่จาเป็ นในการใช้โปรแกรมต่างๆที่มีส่วนเกี่ยวข้องกับการทางานในการ
เขียนเว็บไซต์ท้ งหมด
                ั
3. ออกแบบหน้าตาเว็บไซต์บนกระดาษ
3. นาเอาโปรแกรมต่างๆมาออกแบบสร้างเว็บไซต์
4. ทดสอบและแก้ไข
5. จัดทาเอกสาร


6.อุปกรณ์ และซอฟต์ แวร์ ทใช้ ในกำรทำโครงงำน
                         ี่
ฮาร์ดแวร์
        Computer
        Printer
ซอฟต์แวร์
        ระบบปฏิบติการ ใช้ Ubuntu (12.04) Linux
                ั
        ภาษาที่ใช้สร้างเว็บไซต์ Ruby on Rail
        สาหรับเก็บฐานข้อมูลใช้ SQLite3
        Server ใช้ mongrel
        ตกแต่งรู ปภาพใช้ Photoshop
4




                                                ตำรำงแผนกำรดำเนินงำน(Gantt chart)



      ตารางแสดงแผนดาเนินการ                                                ระยะเวลาดาเนินงาน
ลาดั              กิจกรรม            ม.ค.-55   ก.พ.-55   มี.ค.-55   เม.ย.-55 พ.ค.-55 มิ.ย.-55   ก.ค.-55   ส.ค.-55   ก.ย.-55
 บ
 1 ศึกษาแนวคิด ทฤษฎีและเอกสารที่
     เกี่ยวข้อง
 2 ศึกษาเทคโนโลยี
 3 การระบุปัญหา
 4   การรวบรวมข้อมูลหรื อการจัดการ
     ข้อมูล
 5   การวิเคราะห์ขอมูลหรื อการ
                   ้
     ออกแบบระบบและเว็บไซต์
 6   การสร้างตัวแบบหรื อพัฒนา
     เว็บไซต์
 7   การทดสอบการใช้งานหรื อทดสอบ
     ตัวเว็บไซต์
 8   จัดการทาเอกสาร
5




                                               บทที่2
                               แนวคิด ทฤษฎีและเอกสำรที่เกียวข้ อง
                                                          ่


2.1 ทฤษฎีทเี่ กี่ยวข้ อง
         ปั จจุบนความเจริ ญก้าวหน้าทางด้านเทคโนโลยี สารสนเทศ และการสื่ อสาร มีการพัฒนา
                ั
เปลี่ ยนแปลงไปอย่างรวดเร็ ว มีเทคโนโลยีต่างๆ เกิ ดขึ้นมากมาย เพื่อช่ วยอานวยความสะดวก
รวมทั้งให้ความบันเทิง หรื อแม้กระทังการเชื่ อมต่อกันเป็ นเครื อข่าย โดยที่ทุกคนทัว โลกสามารถ
                                   ่                                             ่
เป็ นเพื่อนกัน พบปะพูดคุยกันได้ตลอดเวลา เพียงแค่มีอินเตอร์ เน็ต กับอุปกรณ์สาหรับเชื่ อมต่อ เช่น
คอมพิวเตอร์ หรื อโทรศัพท์มือถือ ทาให้การติดต่อสื่ อสารเป็ นไปได้อย่างสะดวก รวดเร็ ว ไม่จาเป็ น
ที่จะต้องเดินทางไปพบปะกันโดยตรง
         ถ้าพูดถึงคาว่า Social Media หรื อ Social Network ในปั จจุบนหลายคนอาจจะสงสัยว่าสิ่ ง
                                                                   ั
เหล่านี้ คืออะไร แต่ถาพูดถึง Hi5, Face book, Twitter, Blog, YouTube ฯลฯ เชื่ อว่าหลายคนคงจะ
                     ้
ปฏิเสธไม่ได้ทีจะไม่รู้จก ยิงโดยเฉพาะในวัยรุ่ นหรื อเยาวชนที่อยูในระหว่างการศึกษาเล่าเรี ยน คงจะ
                       ั ่                                     ่
คุนเคยกันเป็ นอย่างดี ซึ่ งสิ่ งเหล่านี้ (Hi5, Face book, Twitter, Blog, YouTube ฯลฯ) ที่ถูกเรี ยกกว่า
  ้
Social Media หรื อ Social Networkดังนั้น
                                                                               ่
         ถ้าจะให้ความหมายของคาว่า Social Media หรื อ Social Network นั้น จะได้วา Social
Media หมายถึง สังคมออนไลน์ที่มีผใช้เป็ นผูสื่อสาร หรื อเขียนเรื่ องราว ประสบการณ์ บทความ
                                ู้        ้
                                                                                            ั
รู ปภาพ และวีดีโอ ที่ผใช้เขียนขึ้นเอง ทาขึ้นเอง หรื อพบเจอจากสื่ ออื่นๆ แล้วนามาแบ่งปั นให้กบ
                      ู้
ผูอื่นที่อยู่ในเครื อข่ายของตน ผ่านทางเว็บไซต์ Social Network ที่ให้บริ การบนโลกออนไลน์
  ้
ปัจจุบน การสื่ อสารแบบนี้จะทาผ่านทาง Internet และโทรศัพท์มือถือเท่านั้น
      ั
         Social Media หมายถึ ง สังคมออนไลน์ที่มีผูใช้เป็ นผูสื่อสาร หรื อเขียนเรื่ องราว
                                                  ้         ้
ประสบการณ์ บทความ รู ปภาพ และวีดีโอ ที่ผใช้เขียนขึ้นเอง ทาขึ้นเอง หรื อพบเจอจากสื่ ออื่นๆ
                                        ู้
                    ั ้          ่
แล้วนามาแบ่งปั นให้กบผูอื่นที่อยูในเครื อข่ายของตน ผ่านทางเว็บไซต์ Social Network ที่ให้บริ การ
บนโลกออนไลน์ ปัจจุบน การสื่ อสารแบบนี้จะทาผ่านทาง Internet และโทรศัพท์มือถือเท่านั้น
                   ั
         Social Network คือ การที่ผคนสามารถทาความรู ้จกและเชื่ อมโยงกันในทิศทางใดทิศทาง
                                   ู้                 ั
หนึ่ง หากเป็ นเว็บไซต์ที่เรี ยกว่าเป็ นเว็บ Social Network ก็คือเว็บไซต์ที่เชื่ อมโยงผูคนไว้ดวนกัน
                                                                                       ้     ้
นั้นเอง (สถาบันคอมพิวเตอร์ มหาวิทยาลัยรามคาแหง, 2552)
6




         จากสภาพสังคมในปั จจุ บนที่ อินเตอร์ เข้าถึ งเกื อบทุ กพื้นที่ ทาให้เยาวชนไทยส่ วนใหญ่
                               ั
สามารถเข้าสู่ ระบบเครื อข่ายสารสนเทศได้ สามารถสื บค้นข้อมูลผ่านทางระบบอินเตอร์ เน็ตได้เป็ น
อย่างดี ประกอบกับมีเครื่ องมือจาพวก Social Media ออกมามากมาย ยิ่ง เป็ นการทาให้เยาวชนเข้าสู่
ระบบของโลกอินเตอร์ เน็ตมากยิงขึ้น ดังจะเห็นได้จากปั ญหาที่ปรากฏทางหน้าจอโทรทัศน์เกี่ยวกับ
                            ่
การใช้งาน Social Media ที่ไม่ถูกต้องและไม่เหมาะสม ซึ่ งการจะแก้ปัญหาเหล่านี้ ไม่ใช่การแก้โดย
การปิ ดกั้นไม่ให้เยาวชนเข้าสู่ โลกอินเตอร์ เน็ตเพราะการปิ ดกั้นเยาวชนจากอินเตอร์ เน็ตก็หมายถึ ง
                           ่
การปิ ดกั้นความรู ้ที่มีอยูมากมายบนโลกอินเตอร์ เน็ตไม่ให้เข้าถึงตัวเยาวชนได้น้ นเอง แต่ทางแก้ที่ดี
                                                                               ั
และตรงกับปั ญหามากที่สุดก็คือการปลูกฝังและแนะนาให้เยาวชนใช้เครื่ องมือ Social Media เหล่านี้
ในทางที่เหมาะสม เช่ น ใช้ในเชิ งการศึกษา ได้แก่ การสอบถามปั ญหาการเรี ยนกับเพื่อนหรื อ
ครู ผสอน การสรุ ปความรู ้เก็บไว้บนเว็บส่ วนตัว หรื อเผยแพร่ ความรู ้ ต่างๆ ตามความเข้าใจบนสื่ อ
     ู้
ทางอินเตอร์ เน็ต รวมทังการสื บค้นข้อมูลบนอินเตอร์ เน็ต เป็ นต้นสิ่ งเหล่านี้ สามารถปลูกฝังได้โดย
                      ่
ผูปกครอง ครู / อาจารย์ รวมทั้งเพื่อนหรื อคนรอบข้าง ยิ่งถ้าสังคมมีแนวโน้มที่ใช้ SocialMedia ใน
  ้
เชิงการศึกษามาขึ้นเท่าใด เยาวชนทุกคนก็จะมีแนวโน้มที่จะคล้อยตามและปฏิบติตามเป็ นนิ สัยและ
                                                                     ั
กิจวัตรมากขึ้น


2.2 เทคโนโลยีทเี่ กี่ยวข้ อง
2.2.1 Ruby
จากวิกิพีเดีย สารานุกรมเสรี
         ภำษำรู บี (Ruby) เป็ น ภาษาโปรแกรมเชิงวัตถุ ที่ได้รับอิทธิพลของโครงสร้างภาษามาจาก
ภาษาเพิร์ลกับภาษาเอดา มีความสามารถในเชิงวัตถุแบบเดียวกับภาษาสมอลทอล์ค และมี
ความสามารถหลายอย่างจากภาษาไพทอน, ภาษาลิสป์ , ภาษา Dylan และภาษา CLU ตัวแปลภาษารู
บีตวหลักเป็ นซอฟต์แวร์เสรี และเป็ นตัวแปลแบบอินเตอร์ พรี เตอร์
   ั
ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki ) เวลา 14.45 7 เมษายน 2555
7




2.2.2 Rails
          รู บีออนเรลส์ (อังกฤษ: Ruby on Rails: RoR) หรื อนิยมเรี ยกสั้นๆ ว่า เรลส์ (Rails) เป็ น
ระบบเฟรมเวิร์กสาหรับเว็บแอปพลิเคชันแบบโอเพนซอร์ ส ที่พฒนาด้วยภาษารู บี โดยอิง
                                                                 ั
แนวความคิดแบบ Model-View-Controller (MVC) เป็ นสถาปั ตยกรรมพื้นฐาน
รู บีออนเรลส์ มีชื่อเสี ยงจากความง่ายในการใช้งาน โดยใช้การเขียนโปรแกรมจานวนน้อยบรรทัด
กว่า และมีการระบุค่าตั้งน้อยกว่าเฟรมเวิร์กที่ออกมาก่อนหน้าตัวอื่นๆ การติดตั้งรู บีออนเรลส์ทาได้
โดยผ่านระบบ RubyGems ซึ่งเป็ นระบบการจัดการส่ วนประกอบในภาษารู บ้ ีอย่างเป็ นทางการ
                                                                   ั
รู บีออนเรลส์ เริ่ มพัฒนาโดย David Heinemeier Hansson เพื่อใช้กบเครื่ องมือจัดการโครงการชื่ อ
Basecamp ของบริ ษท 37 Signals ที่เขาทางานอยูรูบีออนเรลส์ได้เผยแพร่ สู่สาธารณะชนเมื่อเดือน
                       ั                          ่
กรกฎาคม ค.ศ. 2004 โดยรุ่ นปั จจุบนนั้นคือ rails 3.2
                                    ั
ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki) เวลา 15.03 7 เมษายน 2555

2.2.3 CSS (Cascading Style Sheet)
           CSS (Cascading Style Sheet) จัดเป็ นภาษาที่ใช้เป็ นส่ วนของการจัดรู ปแบบการแสดงผล
เอกสาร HTML โดยที่ CSS กาหนดกฏเกณฑ์ในการระบุรูปแบบ (หรื อ "Style") ของเนื้ อหาใน
เอกสาร อันได้แก่สีของข้อความ สี พ้ืนหลัง ประเภทตัวอักษร และการจัดวางข้อความ ซึ่ งการกาหนด
รู ปแบบ หรื อ Style นี้ใช้หลักการของการแยกเนื้อหาเอกสาร HTML ออกจากคาสั่งที่ใช้ในการ
                                                                               ่ ั
จัดรู ปแบบการแสดงผล กาหนดให้รูปแบบของการแสดงผลเอกสาร ไม่ข้ ึนอยูกบเนื้อหาของเอกสาร
เพื่อให้ง่ายต่อการจัดรู ปแบบการแสดงผลลัพธ์ของเอกสาร HTML โดยเฉพาะในกรณี ที่มีการ
เปลี่ยนแปลงเนื้อหาเอกสารบ่อยครั้ง หรื อต้องการควบคุมให้รูปแบบการแสดงผลเอกสาร HTML มี
ลักษณะของความสม่าเสมอทัวกันทุกหน้าเอกสารภายในเว็บไซต์เดียวกัน โดยกฏเกณฑ์ในการ
                              ่
กาหนดรู ปแบบ (Style) เอกสาร HTML ถูกเพิ่มเข้ามาครั้งแรกใน HTML 4.0 เมื่อปี พ.ศ. 2539 ใน
รู ปแบบของ CSS level 1 Recommendations ที่กาหนดโดย องค์กร World Wide Web Consortium
หรื อ W3C
           หลังจากนั้น องค์กร W3C ได้กาหนด CSS level 2 Recommendations เพื่อเพิ่มเติม
กฏเกณฑ์การกาหนดรู ปแบบของสื่ อที่ใช้การแสดงผลข้อมูล โดยผูสร้างเอกสาร อาจเลือกใช้
                                                                    ้
รู ปแบบ หรื อ "Style" ในการกาหนดรู ปแบบให้แสดงผล หรื อ กาหนดให้ไม่แสดงผลข้อมูล บน
อุปกรณ์บางประเภทที่มีรูปแบบการแสดงผลข้อมูลต่างจากการแสดงออกทางหน้าจอปกติ โดย
ผูสร้างเอกสารสามารถใช้ CSS ในกาหนดรู ปแบบการแสดงผลที่เหมาะสม โดยไม่ข้ ึนอยูกบ
   ้                                                                                  ่ ั
เนื้อหาภายในเอกสาร ตัวอย่างเช่น เอกสารฉบับเดียวกัน เมื่อแสดงผลบนอุปกรณ์สาหรับคน
สายตาพิการ อาจกาหนดรู ปแบบให้ไม่แสดงรู ปภาพ แต่แสดงในรู ปแบบอื่นที่เหมาะสม หรื อ
บนอุปกรณ์สาหรับคนหูหนวก อาจกาหนดไม่ให้ตองแสดงข้อมูลเสี ยง แต่แสดงผลในรู ปแบบ
                                                  ้
ของข้อความ เป็ นต้น
8




ที่มา : (http://www.xvlnw.com/knowledge-readknowledge-id158.html) เวลา เวลา 16.45 7
เมษายน 2555


2.2.4 SQLite
        เป็ นระบบฐานข้อมูลที่มีลกษณะเรี ยบง่ายคือ ตัว SQLite จะเก็บข้อมูลลงในไฟล์โดยตรง
                                ั
(คล้าย MS Access) ไม่มีการติดต่อผ่าน Network socket เหมือนกับฐานข้อมูลตัวอื่นๆ ทาให้มีขอ
                                                                                       ้
ได้เปรี ยบเรื่ องความเร็ วในการดึงข้อมูล ซึ่ งปั จจุบนพัฒนาจนถึงรุ่ นที่ 3 แล้วใน การใช้งาน SQLite
                                                     ั
ผูใช้งานสามารถดาวน์โหลดโปรแกรม manager เพื่อจัดการกับฐานข้อมูล ซึ่ งจะทาให้การทางาน
  ้
นั้นง่ายขึ้นมาก ตั้งแต่การสร้างฐานข้อมูล สร้างตาราง ใส่ ขอมูล จนถึงสาเนาข้อมูล (Dump, Import,
                                                         ้
Export ใช้งานฟรี (ฟรี แวร์ ) ไม่เสี ยค่าใช้จ่ายและทางานได้บน Windows 32 และ 64 bits
ที่มา : (http://www.allwebfactory.com/news/node/18) เวลา เวลา 17.03 7 เมษายน 2555


2.2.5 JavaScript
        เป็ นภาษาสคริ ปต์ ทีมีลกษณะการเขียนแบบโปรโตไทพ (Prototyped-based Programming)
                               ั
ส่ วนมากใช้ในหน้าเว็บเพื่อประมวลผลข้อมูลที่ฝั่งของผูใช้งาน แต่ก็ยงมีใช้เพื่อเพิ่มเติม
                                                    ้            ั
                                     ่
ความสามารถในการเขียนสคริ ปต์โดยฝังอยูในโปรแกรมอื่นๆ
        จาวาสคริ ปต์ (JavaScript) เริ่ มพัฒนาโดย Brendan Eich พนักงานบริ ษทเน็ตสเคป โดย
                                                                          ั
ขณะนั้นจาวาสคริ ปต์ใช้ชื่อว่า โมคา และภายหลังได้เปลี่ยนชื่อมาเป็ น ไลฟ์ สคริ ปต์ และเป็ น จาวา
สคริ ปต์ในปั จจุบน รู ปแบบการเขียนภาษาที่ใช้ คล้ายคลึงกับภาษาซี รุ่ นล่าสุ ดของจาวาสคริ ปต์คือ
                 ั
2.0 ซึ่ งตรงกับมาตรฐานของ ECMAScript


ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki ) เวลา 17.20 7 เมษายน 2555
9




                                           บทที่ 3

                                  กำรวิเครำะห์ และออกแบบ

        ออกแบบระบบมีความสาคัญ เพราะเป็ นปั จจัยในการสร้างและพัฒนาระบบสารสนเทศ
การวิเคราะห์ระบบเป็ นเรื่ องที่น่าสนใจ เพราะนักวิเคราะห์ ระบบต้องติดต่อกับคนหลายคน ได้รู้ถึง
การจัดการและการทางานในองค์การทาให้เรามีความรู ้เกี่ยวกับระบบคอมพิวเตอร์ หลายแบบมากขึ้น
ผูที่สามารถวิเคราะห์ระบบได้ดีควร มี ประสบการณ์ ในการเขียนโปรแกรม มีความรู ้ทางด้านธุ รกิจ
  ้
ความรู ้ เกี่ ยวกับระบบเครื อข่ายและฐานข้อมูล ซึ่ งใช้เป็ นความรู้ในการออกแบบระบบที่มีความ
แตกต่างกันออกไปตาม สภาพงาน ดังนั้นหน้าที่ของนักวิเคราะห์ ก็คือการศึกษาระบบ แล้วให้
คาแนะนาในการปรับปรุ งและพัฒนาระบบนั้นจนเสร็ จสมบูรณ์ ซึ่ งการทางานทั้งหมดต้องมีลาดับ
ขั้นตอน และการ ศึกษาวิธีการวิเคราะห์และการออกแบบระบบในแต่ละขั้นตอนทาให้เราเข้าใจ
และสามารถที่จะวิเคราะห์ระบบนั้นๆได้อย่างดีที่สุดอีกด้วย

3.1 แผนภำพบริบท (Use Case Diagrams)

แสดงให้เห็นถึงการติดต่อการใช้ขอมูลระหว่างผูใช้ที่เป็ นสมาชิกกับเว็บไซต์การเรี ยกใช้ขอมูลต่างๆ
                              ้            ้                                        ้
บนเว็บไซต์
10




3.2 ผังงำนโครงสร้ ำงระบบ

3.2.1 แผนภาพบริ ษท (Context Diagram)
                 ั




3.3 แผนภำพกระแสข้ อมูล ( Data Flow Diagram )
แผนภาพกระแสข้อมูลแสดงรายละเอียดต่างๆ ของการทางานของ เว็บสังคมเพลงออนไลค์

3.3.1 กระบวนการที่ 1.0 สมาชิก
3.3.2 กระบวนการที่ 2.0 เข้าสู่ระบบ
3.3.3 กระบวนการที่ 3.0 แก้ไข
3.3.4 กระบวนการที่ 4.0 อับโหลดเพลง
3.3.5 กระบวนการที่ 5.0 อับโหลดรู ป
3.3.6 กระบวนการที่ 6.0 ลบไฟล์
3.3.7 กระบวนการที่ 7.0 ปรับปรุ งข้อมูล
3.3.8 กระบวนการที่ 8.0 ความสัมพันธ์
11




 1.0                    D1      Database



       Email&Password
 2.0                    D1      Database




 3.0                    D1      Database




 4.0                    D2      Database




 5.0
                        D3      Database




 6.0
                        D2,D3      Database




                        D5
7.0


                        D1



 8.0
                        D4
12




3.4 แผนภำพควำมสั มพันธ์ ระหว่ ำงเอนทิตีทมีคุณสมบัติ (Entity-Relationship Diagram)
                                        ี่



                                                   M                   M

                                   สมาชิก                                           เพื่อน

 1        1             1

          M             M

                                    เพลง



 M
                                   รู ปภาพ




                                    POST
13




               MUSIC                              USER
           PK USER_ID                        PK ID                                 POST
              NAMEMUSIC                         NAME                          PK USER_ID
                                                LASTNAME                         USER_NAME
                                             PK EMAIL                            POST
                                                PASSWORD                         TIME
                                                TEL
               PHOTO                            AGE                          ADMIN
           PK USER_ID                                                  PK ADMIN
              NAMEPHOTO                          FRIEND                   ADMIN
                                             PK FRIEND_ID                 _USERNAME
                                                FRIEND_NAME               ADMIN
                                                                          _PASSWORD
           3.5กำรออกแบแฟมข้ อมูล(Data Table)
                        ้



           ชื่อตาราง USER
  ลาดับ
               คุณสมบัติ          คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)      (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1             ID                รหัส          10        INT           -       NOT NULL        PK
    2           NAME                  ชื่อ        20      Character       -       NOT NULL
    4           EMAIL              อีเมลล์        30      Character       -                       PK
    5         PASSWORD            รหัสผ่าน        15        INT           -
14




           ชื่อตาราง ADMIN

  ลาดับ
               คุณสมบัติ       คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)   (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1         USERNAME           ชื่อ          30      Character       -      NOT NULL        PK
    2         PASSWORD         รหัสผ่าน        15        INT           -      NOT NULL


           ชื่อตาราง MUSIC

  ลาดับ
               คุณสมบัติ       คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)   (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1         USER_ID         รหัสผูอพ
                                     ้ั        10        INT           -      NOT NULL        PK
    2        NAMEMUSIC         ชื่อเพลง        20      Character       -      NOT NULL



           ชื่อตาราง PHOTO

  ลาดับ
               คุณสมบัติ       คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)   (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1          USER_ID        รหัสผูอพ
                                     ้ั        10        INT           -      NOT NULL        PK
    2        NAMEPHOTO         ชื่อเพลง        20      Character       -      NOT NULL
15




           ชื่อตาราง POST

  ลาดับ
               คุณสมบัติ        คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)    (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1          USER_ID          รหัสผูอพ
                                      ้ั        10        INT           -      NOT NULL        PK
    2            ID            รหัสโพสต์        10        INT           -      NOT NULL
    3           POST            ข้อความ        140      Character       -      NOT NULL
    4           TIME              เวลา          10      Character       -      NOT NULL



           ชื่อตาราง FRIEND

  ลาดับ
               คุณสมบัติ        คาอธิบาย       ขนาด     ประเภท      ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์
(Sequenc
               (Attribute)    (Description)   (Width)   (Type)       (Default) ความถูกต้อง (Key Type)
  e No)
    1         FRIEND_ID         ชื่อเพื่อน      20      Character       -      NOT NULL        PK
    2       FRIEND_NAME         รหัสผ่าน        30      Character       -      NOT NULL
16




3.6 แผนกำรทำงำน (Flowchart)
3.6.1 การเข้าสู่ ระบบ

          เริ่ ม




   หน้าแรกของเว็บ




                         no
     สมัครสมาชิก

                   yes
                                              no
    ระบบสมัคร                 เข้าสู่ระบบ          จบการทางาน
    สมาชิก


                                        yes

                         ระบบของผูใช้
                                  ้




                              ระบบสังคม
                                เพลง



                          ระบบอัพเดต
                          สถานะ




                          จบการทางาน
17




3.6.2 การสมัครสมาชิก
18




3.6.3 การอัพโหลดรู ปภาพ


                                  เริ่ มการทางาน




                                หน้าเว็บอัพรู ปภาพ


                          yes

                                                     no
                            ตรวจสอบไฟล์ภาพ



                                 ระบบอัพโหลด
                                  ลงฐานข้อมูล




                                   ระบบแสดง
                                     รู ปภาพ




                                จบการทางาน
19




3.6.4 การอัพโหลดเพลง


                              เริ่ มการทางาน




                         หน้าเว็บอัพโหลดเพลง


                       yes

                                               no

                         ตรวจสอบไฟล์เพลง



                              ระบบอัพโหลดลง
                                 ฐานข้อมูล




                       แสดงผลการอัพโหลดเพลง




                             จบการทางาน
20




3.6.4 การเล่นเพลง
                                       เริ่ มการทางาน




                                     หน้าเว็บแสดงเพลง



                          yes                           no


                                ตรวจสอบการเลือกเพลง




                                       ระบบเล่นเพลง




                                      จบการทางาน



3.6.4.1 ระบบการเล่นเพลง                เริ่ มการทางาน


                                     ดึงไฟล์เพลงจาก
                                     ฐานข้ อมูล



                                       ระบบเล่นเพลง




                                  แสดงผลการเล่นเพลง



                                      จบการทางาน
21




3.6.5 การPOST ข้อความ
                              เริ่ มการทางาน


                               หน้าเว็บPOST




                                ระบบPOST
                                  ข้อความ




                                 บันทึกลง
                                 ฐานข้อมูล




                              จบการทางาน



3.6.5.1 ระบบการเก็บ POST

                            เริ่ มการทางาน



                           บันทึกข้ อความ
                           ลงฐานข้ อมูล



                            จบการทางาน
22




3.6.6 ระบบการเข้าใช้งาน Admin

                                     เริ่ มการทางาน




                                       หน้าเว็บไซต์
                                          Admin




                                ตรวจสอบ user & Password
                                        Admin




                                     ระบบ Admin


                                     จบการทางาน
23




3.6.6.1 ระบบ Admin




                     -
24




                                                 บทที่ 4

                                            กำรพัฒนำโปรแกรม

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

4.1 ฮาร์ดแวร์ที่ใช้
ตารางที่ 4.1 แสดงรายชื่อฮาร์ ดแวร์ ท้ งหมดที่ใช้จริ ง
                                      ั

            ชื่อฮาร์ดแวร์                      นามาใช้เพื่อ              เลือกเพราะ

คอมพิวเตอร์โน๊ตบุค
                 ๊                  เขียนโปรแกรม, ทดสอบ        สะดวกสบายในการพกพาและ
                                    โปรแกรม, จาลองเป็ นเซิฟ    ง่ายต่อการทดสอบโปรแกรม
                                    เวอร์

เครื่ องปริ้ น                      ใช้ริ้นเอกสารต่างๆ         เมือเป็ นเอกสารจะสามารถดูได้
                                                               ง่ายกว่าเป็ นไฟล์เอกสารใน
                                                               คอมพิวเตอร์
25




4.2 ซอฟต์แวร์ที่ใช้
ตารางที่ 4.2.1 ซอฟต์แวร์ที่ใช้จริ ง

         ชื่อซอฟต์แวร์                           นามาใช้เพื่อ                 เลือกเพราะ

OS Ubuntu 12.04                       นามาเป็ นระบบปฏิบติการที่ใช้
                                                       ั             เป็ นOS linuxที่ใช้งานง่ายแล้ว
                                      ในการพัฒนาเว็บไซต์ดวย Ruby คนนิยมที่จะใช้ในการเขียน
                                                         ้
                                                                     เว็บ Ruby on Rails

Ruby on Rails (os Ubuntu )            เป็ นภาษาที่ใช้ในการเขียน      เป็ นภาษาที่มีความหน้าสนใจมี
                                      เว็บไซต์                       รู ปแบบการเขียนที่ดูเข้าใจง่าย
                                                                     มีการเขียนที่นอยบรรทัด
                                                                                   ้



SQLite (os Ubuntu )                   จัดการระบบ ฐานข้อมูลของเว็บ เป็ นโปรแกรมที่ใช้งานง่ายใน
                                                                     การจัดการกับฐานข้อมูล และ
                                                                     ใช้ควบคู่กบRuby on Rails
                                                                               ั

Mongrel (os Ubuntu )                  นามาใช้เป็ น server            เป็ นโปรแกรมที่ใช้งานง่ายกับ
                                                                     เว็บ Ruby on Rails



OS windows 7                          นามาเป็ นระบบปฏิบติการที่ใช้
                                                       ั             เป็ นOS ที่สนับสนุนการ
                                      เพื่อทาเอกสาร และตกแต่งรู ป    ทางานกับโปรแกรม
                                                                     Microsoft office 2007
                                                                     และ Photoshop
Photoshop (os windows)                แต่งภาพ ตัดต่อภาพมาใช้บน       เป็ นโปรแกรมที่ใช้งานง่าย มี
                                      เว็บไซต์                       ความสามารถในการตกแต่ง
                                                                     รู ปภาพต่างๆได้อย่างมี
                                                                     ประสิ ทธิภาพ
26




 ตารางที่ 4.2.2 ใช้ในการทาเอกสาร

 Microsoft office 2007         ใช้ทาเอกสารโครงงาน              ช่วยในการจัดทาเอกสาร
                                                               โครงงานเพราะเป็ นโปรแกรม
 (os windows)                  Word
                                                               ที่มีประสิ ทธิภาพในการทา
                               Powerpoint
                                                               เอกสารและง่ายต่อการใช้งาน

 Microsoft office Visio 2007   ใช้ทาแผนภาพ                     ช่วยให้การทาเอกสารที่เป็ น
                                                               แผนภาพ ง่ายขึ้นเพราะมี
                                                               เครื่ องมือที่ง่ายต่อการสร้าง



4.3 การทางานทั้งหมดของโปรแกรมมีกระบวนการทั้งหมดดังนี้

ตารางที่ 4.3.1 แสดงกระบวนการการทางานของ กระบวนกำร 1.0 หน้าหลัก

ชื่อ กระบวนการ                 คาอธิบายการทางาน                 หมายเหตุ

เข้าสู่ ระบบ                   เป็ นกระบวนการที่สมาชิกของ
                               เว็บไซต์ใช้ในการ เข้าสู่ ระบบ
                               โดยการใส่ อีเมล์ และ รหัสผ่าน
                               ของตนเอง
27




ตารางที่ 4.3.2 แสดงกระบวนการการทางานของ กระบวนกำร 2.0 สมัครสมาชิก

ชื่อ กระบวนการ               คาอธิบายการทางาน               หมายเหตุ

การสมัครสมาชิก               เป็ นกระบวนการในการสมัคร
                             สมาชิกเพื่อเข้าสู่ ระบบการ
                                                            ชื่อ และอีเมล์ ไม่สามารถซ้ า
                             ทางานต่างๆของเว็บไซต์ โดย
                                                            กันได้
                             กรอกข้อมูลในการสมัคร
                             สมาชิกดังนี้                   อย่างน้อย 6 ตัวอักษร

                             1. ชื่อผูใช้
                                      ้

                             2. e-mail

                             3. พาสเวิร์ดในการเข้าระบบ

                             4. คอนเฟิ ร์มพาสเวิร์ด




ตารางที่ 4.4.3 แสดงกระบวนการการแก้ไขข้อมูลสมาชิก กระบวนกำร 3.0 แก้ไขชื่อสมาชิก

ชื่อ กระบวนการ               คาอธิบายการทางาน               หมายเหตุ

การแก้ไขชื่อสมาชิก           เป็ นกระบวนการที่ใช้ในการ
                             แก้ไขชื่อ พาสเวิร์ด ไปถึงการ
                             เปลียน e-mail
28




ตารางที่ 4.4.4 แสดงกระบวนการโพส ข้อความ กระบวนกำร 4.0 ข้อความ

ชื่อ กระบวนการ              คาอธิบายการทางาน              หมายเหตุ

กระดานสนทนา                 เป็ นกระบวนการที่ให้สมาชิก
                            ใช้ในการแสดงความคิดเห็นใน
                            กระดานของตนเอง



ตารางที่ 4.4.5 แสดงกระบวนการลบโพสต์ ข้อความ กระบวนกำร 5.0 ลบข้อความ

ชื่อ กระบวนการ              คาอธิบายการทางาน              หมายเหตุ

ลบข้อความ                   เป็ นกระบวนการที่ใช้ในการลบ
                            ข้อความที่โพสต์ไว้ออก
29




ตารางที่ 4.4.6 แสดงกระบวนการอับโหลดไฟล์เพลง กระบวนกำร 6.0 การอับโหลดไฟล์เพลง

ชื่อ กระบวนการ              คาอธิบายการทางาน              หมายเหตุ

การอับโหลดไฟล์เพลง          เป็ นการอับโหลดไฟล์เพลงเข้า
                            ไปบนเว็บเป็ น.mp3



ตารางที่ 4.4.7 แสดงกระบวนการลบไฟล์เพลง กระบวนกำร 7.0 ลบไฟล์เพลง

ชื่อ กระบวนการ               คาอธิบายการทางาน             หมายเหตุ

ลบไฟล์เพลง                   เป็ นการลบเพลงที่ไม่ตองการ
                                                  ้
                             ออก



ตารางที่ 4.4.8 แสดงกระบวนการอับโหลดไฟล์รูป กระบวนกำร 8.0 อับโหลดไฟล์รูป

ชื่อ กระบวนการ              คาอธิบายการทางาน              หมายเหตุ

อับโหลดไฟล์รูป              เป็ นการอับโหลดรู ปภาพที่
                            ประทับใจ



ตารางที่ 4.4.9 แสดงกระบวนการลบไฟล์รูป กระบวนกำร 9.0 ลบไฟล์รูป

ชื่อ กระบวนการ              คาอธิบายการทางาน              หมายเหตุ

ลบไฟล์รูป                   เป็ นลบไฟล์รูปภาพที่ไม่
                            ต้องการใช้ออก
30




ตารางที่ 4.4.10 แสดงกระบวนการการทางานของผูดูแลระบบ กระบวนกำร 10.0 ผูดูแลระบบ
                                          ้                         ้

ชื่อ กระบวนการ              คาอธิบายการทางาน           หมายเหตุ

การจัดการระบบสมาชิก         สามารถลบสมาชิกได้

การจัดการเพลง               สามารถลบไฟล์เพลงได้

การจัดการรู ป               สามารถลบรู ปได้
31




                                          บทที่ 5
                       สรุ ปผลกำรศึกษำ กำรอภิปรำยผล และข้ อเสนอแนะ

5.1 สรุ ปผลกำรดำเนินงำน
         โครงงาน มิวสิ ค โซเชียล (Music Social) เว็บไซต์สังคมเพลง จัดทาขึ้นโดยออกแบบ
                                     ั
โครงสร้างในรู ปแบบของเว็บไซต์กบฐานข้อมูล เพื่อรองรับการใช้งานของผูใช้    ้
         เว็บไซต์สังคมเพลง เป็ นอีกช่องทางเลือกหนึ่งในการบริ การให้ผใช้ที่สนใจเข้ามา
                                                                     ู้
แลกเปลี่ยนข่าวสารแชร์ รูปภาพ แชร์ เพลงได้ การทางานของเว็บไซต์เน้นให้ผใช้สามารถจัดการ
                                                                           ู้
ข้อมูลได้เองมากขึ้น ผูใช้สามารถเพิม ลบ แก้ไข ข้อมูล ไฟล์ที่ตนเองได้แชร์ ไว้ ได้ในส่ วนที่ระบบ
                      ้            ่
ได้จดไว้สาหรับการจัดการในส่ วนของสมาชิก
    ั

5.2 ปัญหำทีเ่ กิดขึน้
5.2.1 ปั ญหาเกิดจากภาษา Ruby เป็ น ภาษาที่กลุ่มเราไม่เคยศึกษามาก่อนจึงทาให้ไม่เข้าใจการเขียน
code
                                                                           ่
5.2.2 การเขียน Code ruby มีการทางานเป็ น part ดังนั้นไฟล์ codeจะอยูหลาย folder ที่เรี ยกใช้งาน
ดังนั้นจะทาให้เกิดความสับสนในการแก้ไขหรื อ ปรับปรุ งงาน
5.2.3 ภาษา Ruby เป็ นการเขียนโดยใช้ terminal เป็ นตัว create หน้าเว็บไซต์ข้ ึนมาโดยที่เราจะยังไม่
เห็นหน้าเว็บที่เราสร้างขึ้นมาจนกว่าจะพิมพ์ code เสร็ จถึงจะเห็นหน้าเว็บที่เราพิมพ์
5.2.4 ปั ญหาเกิดจาก Os ที่เราใช้ในการทางาน มีการเปลี่ยนเวอร์ ชนเพื่อพัฒนาแก้ไข bug ต่างๆใน
                                                                   ั่
ระบบทาให้เราต้องเปลี่ยนเวอร์ ชนของโปรแกรม Rails เป็ นเวอร์ ชนใหม่ ทาให้การเรี ยกใช้ขอมูล
                                    ั่                                ั่                     ้
ของ code เปลี่ยนไป
5.2.5 เมื่อมีการเปลี่ยน rails เป็ นเวอร์ ชนใหม่เพื่อรองรับกับ OS ก็ยงไม่อาจแก้ไข bug ได้ท้ งหมด
                                            ่ั                           ั                 ั
อาจต้องมีการนา OS ตัวใหม่ มาใช้คู่กบ rails เวอร์ ชนเก่าเพื่อเป็ นการลดปัญหา bug ตัวใหม่ที่ติดมา
                                          ั           ั่
                 ั่                            ั่        ั ่
กับ rials เวอร์ ชนใหม่เพราะ rails เวอร์ ชนเก่าก็จะมีตวที่ผานการแก้ไข bug แล้ว
32




5.3 วิธีกำรแก้ไข
5.3.1กลุ่มเราต้องไปศึกษาการเขียน Code Ruby ใหม่ต้ งแรกจากเว็บไซต์ต่างที่เกี่ยวข้องกับ การเขียน
                                                       ั
เว็บด้วยภาษา Ruby เช่น เว็บ http://ruby.railstutorial.org/
                                                             ่
5.3.2 ในการแก้ไขงาน เราต้องเข้าไปเปิ ดไฟล์ที่เราเขียนเพื่อดูวาไฟล์น้ นเรี ยกใช้ไฟล์ตวใดบ้าง แล้ว
                                                                     ั              ั
ไล่ดูถึงความสัมพันธ์เพื่อหาจุดแก้ไข
5.3.3 ต้องไปหาไฟล์ที่ใช้ในการดึงข้อมูลแสดงในหน้าเว็บแล้วเข้าไปลองแก้ไขที่ละจุดแล้วเปิ ดหน้า
เว็บดูการเปลี่ยนแปลงไปที่ละอย่าง
5.3.4 ดังนั้นเราจึงต้องทาการออกแบบ website ก่อนแล้วมาเรี ยบเรี ยง code ของการสร้างชิ้นงาน
เพื่อให้เกิดความผิดพลาดน้อยมี่สุด
5.3.4 มีการนาเอา code เวอร์ ชนเก่า + เวอร์ ชนใหม่เข้ามาใช้งานพสมกันเพื่อเป็ นการลด bug ของ
                             ั่             ั่
code

5.4 ข้ อเสนอแนะ
5.4.1 ควรศึกษาภาษาและโปรแกรมที่ใช้ในการเขียนเว็บไซต์ให้มาก เพื่อให้เกิดความชานาญและ
ความเข้าใจในการใช้งานได้อย่างมีประสิ ทธิ ภาพเพื่อนามาใช้ในการเขียนโปรแกรม ลดปั ญหาต่างๆ
ในการพัฒนาโปรแกรม
5.4.2 ควรศึกษาถึงการทางานในการจัดการฐานข้อมูลให้เหมาะสมกับเว็บไซต์หรื อเว็บแอพพลิเคชัน่
ที่ตองการ ทาให้ออกแบบเว็บไซต์ได้เป็ นไปตามที่ตองการง่ายในการเขียนเว็บไซต์หรื อเว็บ
    ้                                            ้
แอพพลิเคชัน  ่
5.4.3 ผูพฒนาเว็บไซต์หรื อเว็บแอพพลิเคชันควรตระหนักถึงการจัดรู ปแบบของ Source code การ
         ้ ั                           ่
เขียนคอมเม้นไว้ในแต่ละส่ วนการทางาน เพื่อง่ายต่อการแก้ไข
33




                                                บทที่ 6
                                          คู่มือกำรใช้ งำน

6.1 โปรแกรมทีต้องใช้ ในระบบ
             ่

        6.1.1 Ruby on Rails

        6.1.2 SQLite

6.2 คู่มือกำรใช้ งำน
หน้าเว็บ มิวสิ ค โซเชียล (Music Social)




                         รู ปที่ 6.1 หน้าเว็บ มิวสิ ค โซเชียล (Music Social)
34




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




                               รู ปที่ 6.2 หน้า สมัครสมาชิก




                            รู ปที่ 6.3 ฟ้ อง error กรณี ชื่อซ้ ากัน
35




รู ปที่ 6.4 ฟ้ อง error กรณี password ไม่ตรงกัน




   รู ปที่ 6.5 ฟ้ อง error กรณี e-mail ซ้ ากัน
36




รู ปที่ 6.6 ฟ้ อง Error กรณี กรอกข้อมูลไม่ครบ




       รู ปที่ 6.7 หน้า Login เข้าระบบ
37




                            รู ปที่ 6.8 แสดงหน้า Login แล้ว

สมาชิกสามารถเข้ามาอับโหลดเพลงฟังเพลงได้จากหน้าเว็บ




                               รู ปที่ 6.9 อัพโหลดเพลง
38




                                 รู ปที่ 6.10 เล่นเพลงได้

สมาชิกสามารถเข้ามาอับโหลดรู ปและดูได้จากหน้าเว็บ




                                 รู ปที่ 6.11 อัพโหลดรู ป
39




รู ปที่ 6.12 ดูรูปที่อพโหลดได้
                      ั
40




                                 บรรณำนุกรม



         Ebook ruby on rails tutorial จาก http://ruby.railstutorial.org/

วิธีแสดงการทางานของ code จาก http://stackoverflow.com/ นามาปรับใช้ กบเว็บไซต์
                                                                    ั
รูปเล่มวิชาโครงงาน

More Related Content

What's hot

การรับสารด้วยการฟัง 4
การรับสารด้วยการฟัง 4การรับสารด้วยการฟัง 4
การรับสารด้วยการฟัง 4Yota Bhikkhu
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รายงานเทคโนโลยีคอมพิวเตอร์
รายงานเทคโนโลยีคอมพิวเตอร์รายงานเทคโนโลยีคอมพิวเตอร์
รายงานเทคโนโลยีคอมพิวเตอร์พัน พัน
 
ประวัติความเป็นมาของคอมพิวเตอร์
ประวัติความเป็นมาของคอมพิวเตอร์ประวัติความเป็นมาของคอมพิวเตอร์
ประวัติความเป็นมาของคอมพิวเตอร์พัน พัน
 
สารบัญโครงงานคอม
สารบัญโครงงานคอมสารบัญโครงงานคอม
สารบัญโครงงานคอมkand-2539
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Sarocha Makranit
 
2.ส่วนคำนำ และสารบัญ
2.ส่วนคำนำ และสารบัญ2.ส่วนคำนำ และสารบัญ
2.ส่วนคำนำ และสารบัญPongpob Srisaman
 
นาฏศิลป์สากล
นาฏศิลป์สากลนาฏศิลป์สากล
นาฏศิลป์สากลPonpirun Homsuwan
 
โครงงานวาฟเฟิลสมุนไพร
โครงงานวาฟเฟิลสมุนไพรโครงงานวาฟเฟิลสมุนไพร
โครงงานวาฟเฟิลสมุนไพรnokyoong47
 
เนื้อเพลง ดาวดึงส์
เนื้อเพลง ดาวดึงส์เนื้อเพลง ดาวดึงส์
เนื้อเพลง ดาวดึงส์Kruple Ratchanon
 
บทที่ 3 บทที่ 4 และบทที่ 5
บทที่ 3 บทที่ 4 และบทที่ 5บทที่ 3 บทที่ 4 และบทที่ 5
บทที่ 3 บทที่ 4 และบทที่ 5siriyakorn saratho
 
โครงงานสิ่งประดิษฐ์เหลือใช้
โครงงานสิ่งประดิษฐ์เหลือใช้โครงงานสิ่งประดิษฐ์เหลือใช้
โครงงานสิ่งประดิษฐ์เหลือใช้thanapisit marakul na ayudhya
 
ตัวอย่างโครงงานคอม
ตัวอย่างโครงงานคอมตัวอย่างโครงงานคอม
ตัวอย่างโครงงานคอมScott Tape
 
ใบความรู้ ที่ 2.1 เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010
ใบความรู้ ที่ 2.1  เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010ใบความรู้ ที่ 2.1  เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010
ใบความรู้ ที่ 2.1 เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010Nicharee Piwjan
 
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์ธณัชช์ภรณ์ ศิริวัชเดชากุล
 
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...Suricha Phichan
 
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4Thanawut Rattanadon
 
โครงงานคัดแยกขยะ
โครงงานคัดแยกขยะโครงงานคัดแยกขยะ
โครงงานคัดแยกขยะPang Pond
 

What's hot (20)

การรับสารด้วยการฟัง 4
การรับสารด้วยการฟัง 4การรับสารด้วยการฟัง 4
การรับสารด้วยการฟัง 4
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รายงานเทคโนโลยีคอมพิวเตอร์
รายงานเทคโนโลยีคอมพิวเตอร์รายงานเทคโนโลยีคอมพิวเตอร์
รายงานเทคโนโลยีคอมพิวเตอร์
 
ประวัติความเป็นมาของคอมพิวเตอร์
ประวัติความเป็นมาของคอมพิวเตอร์ประวัติความเป็นมาของคอมพิวเตอร์
ประวัติความเป็นมาของคอมพิวเตอร์
 
สารบัญโครงงานคอม
สารบัญโครงงานคอมสารบัญโครงงานคอม
สารบัญโครงงานคอม
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
2.ส่วนคำนำ และสารบัญ
2.ส่วนคำนำ และสารบัญ2.ส่วนคำนำ และสารบัญ
2.ส่วนคำนำ และสารบัญ
 
นาฏศิลป์สากล
นาฏศิลป์สากลนาฏศิลป์สากล
นาฏศิลป์สากล
 
โครงงานวาฟเฟิลสมุนไพร
โครงงานวาฟเฟิลสมุนไพรโครงงานวาฟเฟิลสมุนไพร
โครงงานวาฟเฟิลสมุนไพร
 
2ตัวอย่างนำเสนอโครงการ
2ตัวอย่างนำเสนอโครงการ2ตัวอย่างนำเสนอโครงการ
2ตัวอย่างนำเสนอโครงการ
 
เนื้อเพลง ดาวดึงส์
เนื้อเพลง ดาวดึงส์เนื้อเพลง ดาวดึงส์
เนื้อเพลง ดาวดึงส์
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์
 
บทที่ 3 บทที่ 4 และบทที่ 5
บทที่ 3 บทที่ 4 และบทที่ 5บทที่ 3 บทที่ 4 และบทที่ 5
บทที่ 3 บทที่ 4 และบทที่ 5
 
โครงงานสิ่งประดิษฐ์เหลือใช้
โครงงานสิ่งประดิษฐ์เหลือใช้โครงงานสิ่งประดิษฐ์เหลือใช้
โครงงานสิ่งประดิษฐ์เหลือใช้
 
ตัวอย่างโครงงานคอม
ตัวอย่างโครงงานคอมตัวอย่างโครงงานคอม
ตัวอย่างโครงงานคอม
 
ใบความรู้ ที่ 2.1 เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010
ใบความรู้ ที่ 2.1  เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010ใบความรู้ ที่ 2.1  เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010
ใบความรู้ ที่ 2.1 เรื่อง ความรู้พื้นฐานเกี่ยวกับโปรแกรม microsoft excel 2010
 
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์
โครงงานนาฏศิลป์ เรื่อง การแสดงนาฏศิลป์ไทยสร้างสรรค์ ชุด ตำนานท้าวศรีจุฬาลักษณ์
 
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...
โครงงานวิชาไอเอส เรื่องความพึงพอใจในการใช้ห้องน้ำของนักเรียนชั้นมัธยมศึกษาปีท...
 
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4
ใบงานที่ 1.1 หน่วยการเรียนรู้ที่ 3 เรื่อง เครื่องมือเกษตร ชั้นประถมศึกษาปีที่ 4
 
โครงงานคัดแยกขยะ
โครงงานคัดแยกขยะโครงงานคัดแยกขยะ
โครงงานคัดแยกขยะ
 

Similar to รูปเล่มวิชาโครงงาน

วิชาโครงงาน
วิชาโครงงานวิชาโครงงาน
วิชาโครงงานAjBenny Pong
 
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum UniversityKnowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum Universitybennypong
 
45100731 0 20130611-135344
45100731 0 20130611-13534445100731 0 20130611-135344
45100731 0 20130611-135344Nuttinee
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Keng Sangwattu
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์S'kae Nfc
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์Woraprom Hinmani
 
โครงงาน
โครงงานโครงงาน
โครงงานGoofy Bec
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์IM_SRWM
 
45100731 0 20130611-135344
45100731 0 20130611-13534445100731 0 20130611-135344
45100731 0 20130611-135344Puripat Duangin
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Keng Sangwattu
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Keng Sangwattu
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Wannwipha Kanjan
 

Similar to รูปเล่มวิชาโครงงาน (20)

วิชาโครงงาน
วิชาโครงงานวิชาโครงงาน
วิชาโครงงาน
 
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum UniversityKnowledge Sharing for Travelling in Thailand, ICT, Sripatum University
Knowledge Sharing for Travelling in Thailand, ICT, Sripatum University
 
Mancha
ManchaMancha
Mancha
 
45100731 0 20130611-135344
45100731 0 20130611-13534445100731 0 20130611-135344
45100731 0 20130611-135344
 
Asean project
Asean projectAsean project
Asean project
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์
 
Asean project
Asean projectAsean project
Asean project
 
AseanProject.pdf
AseanProject.pdfAseanProject.pdf
AseanProject.pdf
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์
 
โครงงาน
โครงงานโครงงาน
โครงงาน
 
ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์ตัวอย่างโครงงานคอมพิวเตอร์
ตัวอย่างโครงงานคอมพิวเตอร์
 
45100731 0 20130611-135344
45100731 0 20130611-13534445100731 0 20130611-135344
45100731 0 20130611-135344
 
45100731 0 20130611-135344
45100731 0 20130611-13534445100731 0 20130611-135344
45100731 0 20130611-135344
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
Asean project
Asean projectAsean project
Asean project
 
33104657 0 20130621-155311
33104657 0 20130621-15531133104657 0 20130621-155311
33104657 0 20130621-155311
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
ส่วนนำรายงาน
ส่วนนำรายงานส่วนนำรายงาน
ส่วนนำรายงาน
 

More from AjBenny Pong

รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 

More from AjBenny Pong (12)

รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 

รูปเล่มวิชาโครงงาน

  • 1. เว็บแอพพลิเคชัน มิวสิ ค โซเชียล ่ Music Social โดย นายคมสัน ไผ่งาม รหัส 52018096 นายปิ ยกุล รุ่ งแกร รหัส 52026730 โครงงานนี้เป็ นส่ วนหนึ่งของการศึกษาหลักสู ตรวิทยาศาสตร์ บณฑิต ั สาขาวิชาเทคโนโลยีสารสนเทศและการสื่ อสารคณะเทคโนโลยีสารสนเทศ มหาวิทยาลัยศรี ปทุม พ.ศ.2554
  • 2. มหาวิทยาลัยศรี ปทุม คณะเทคโนโลยีสารสนเทศ โครงงาน ของ นาย คมสัน ไผ่งาม รหัส 52018096 นาย ปิ ยกุล รุ่ งแกร รหัส 52026730 เรื่ อง เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล (Music Social) ได้รับการตรวจสอบและอนุ มติให้เป็ นส่ วนหนึ่งของการศึกษาตามหลักสู ตรวิทยาศาสตร์ บณฑิต ั ั สาขาวิชาเทคโนโลยีสารสนเทศและการสื่ อสาร เมื่อ วันที่ 23 กันยายน พ.ศ. 2555 ประธานกรรมการ _____________________________ ( ) กรรมการ _____________________________ ( ) กรรมการและอาจารย์ที่ปรึ กษา _____________________________ ( ) กรรมการและเลขานุการ _____________________________ ( )
  • 3. ข บทคัดย่อ ระบบเว็บไซต์สังคมเพลง มิวสิ ค โซเชียล (Music Social, จานวน 40 หน้า) โดย นายคมสัน ไผ่งาม รหัส 52018096 นายปิ ยกุล รุ่ งแกร รหัส 52026730 อาจารย์ทปรึกษา อาจารย์ชฎาพร เกตุมณี ี่ โครงงาน ระบบเว็บไซต์สังคมเพลง มิ วสิ ค โซเชี ย ล มี จุดประสงค์ในการจัดท าเพื่ อเป็ น เว็บไซต์เพื่อศึกษาระบบ เว็บแอพพลิเคชัน และเป็ นการพัฒนาทางด้านการให้บริ การอีกทางด้านหนึ่ ง ่ ของโซเชียล เน็ตเวิร์กที่ช่วยให้ผที่สนใจในการหาสังคมใหม่ๆ ที่สามารถแชร์ เสี ยงหรื อเพลง รู ปภาพที่ ู้ ตัวเองมีให้ผอื่นได้ฟังได้ดู ได้แลกเปลี่ ยนความคิดเห็นเป็ นสังคมออนไลน์ที่เข้ามาเป็ นส่ วนหนึ่ งใน ู้ ชี วิต ประจ าวัน ของใครหลายๆคนในปั จ จุ บ ัน เหมื อนเป็ นโลกอี ก โลกหนึ่ ง ที่ ใ ช้ใ นการแสดง ความสามารถแชร์ให้ผอื่นได้ ู้ เว็บไซต์ที่ได้พฒนาขึ้นมานี้ เป็ นการทางานผ่านทางอินเตอร์ เน็ต โดยใช้ภาษา Ruby ในการ ั เขียนโปรแกรม ซึ่งสามารถเชื่อมต่อกับฐานข้อมูล SQLite ได้ ในการจัดทาโครงงานนี้ได้นาโปรแกรมสาเร็ จรู ปมาใช้ในการเขียนโปรแกรม เช่น Ruby on Rails, SQLite เข้ามาช่วยในการพัฒนาระบบซึ่ งประกอบไปด้วย 2 ส่ วนคือ ส่ วนแรก จะนาโปรแกรม สาเร็ จรู ปมาช่วยในการออกแบบหน้าจอ (Webpage) ที่ใช้ติดต่อกับผูใช้ ส่ วนที่สอง ตัวโปรแกรมของ ้ ระบบนาเอาภาษา HTML, Ruby มาช่วยในการเขียนโปรแกรมในส่ วนต่างๆ เช่น การเข้าสู่ ระบบ การ อัพโหลดรู ปภาพ การแสดงความคิดเห็นต่างๆ เป็ นต้น ซึ่งสามารถทาการติดต่อกับฐานข้อมูลได้อย่าง สมบูรณ์และมีประสิ ทธิภาพ จากการพัฒนาโครงงานนี้ ทาให้สามารถให้บริ การแก่ผูใช้งานด้านความบันเทิงทางสังคมบน ้ โลกออนไลน์ ได้อย่างสะดวกและรวดเร็ ว ระบบสามารถตอบสนองความต้องการของผูใช้งานได้ ้
  • 4. กิตติกรรมประกาศ ผูจดทาโครงงาน เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล (Music Social) จะเกิดขึ้นไม่ได้ถาหาก ้ั ้ ขาดการสนับสนุนจาก บุคคลหลายท่าน ผูจดทาโครงงานจึงใคร่ ขอขอบคุณท่านต่างๆ ดังนี้ ้ั ขอขอบพระคุณอาจารย์ทุกท่านที่มีส่วนให้โครงงานนี้ ผานไปได้ดวยดี รวมถึงความรู้ในทาง ่ ้ วิชาการและประสบการณ์ชีวตในด้านต่างๆ ิ ขอขอบพระคุณอาจารย์ อาจารย์ชฎาพร เกตุมณี อาจารย์ที่ปรึ กษาสาหรับโครงงาน ที่คอย ช่วยเหลือ ให้คาแนะนาต่างๆ จนทาให้โครงงานประสบความสาเร็ จไปได้ดวยดี ้ ขอกราบขอบพระคุณบิดามารดา ครอบครัว รวมถึงญาติทุกคน ของผูจดทาโครงงานที่คอย ้ั เป็ นกาลังใจให้ตลอดเวลา สนับสนุ นทางด้านค่าใช้จ่ายในการจัดทาโครงงานนี้ คอยอบรมสั่งสอน ชี้แนะสิ่ งต่างๆให้ผจดทาได้ประสบความสาเร็ จจนถึงทุกวันนี้ ู้ ั ขอขอบคุณเพื่อนๆ พี่ๆที่คอยให้กาลังใจ คอยช่ วยเหลื อให้คาแนะนาปรึ กษา และให้ความ ช่วยเหลือในการจัดทาโครงงานนี้ ตลอดเวลา และขอบคุณคณะเทคโนโลยีสารสนเทศ ที่มีวิชานี้ ข้ ึนมา เพื่อให้ผจดทาได้พฒนาเว็บไซต์ของตนเองขึ้นมา โดยใช้ความรู ้ และประสบการณ์ที่ได้เรี ยนมาทั้งสิ้ น ู้ ั ั มาใช้ในการเขียนโปรแกรมจนสาเร็ จลุล่วงไปได้ดวยดี ้
  • 5. คานา การจัดทาโครงงาน “เว็บไซต์สังคมเพลง มิวสิ ค โซเชียล” นี้ เป็ นส่ วนหนึ่ งของวิชา ICT 492 โครงงานคอมพิ วเตอร์ (Computer Project Preparation) ของหลัก สู ตรวิทยาศาสตร์ บณฑิ ต ั คณะเทคโนโลยีสารสนเทศ มหาวิทยาลัยศรี ปทุม สาหรับนักศึกษาปี สุ ดท้าย เพื่อให้นกศึกษาได้นา ั ความรู ้ ที่เรี ยนมาทั้งหมดมาประยุกต์ใช้ในการพัฒนาระบบเป็ นการทดสอบความรู ้ ความสามารถและ การเพิ่มประสบการณ์ก่อนสาเร็ จการศึกษาจากสถาบัน โครงงาน “เว็บไซต์สังคมเพลง มิวสิ ค โซเชี ยล” จัดทาขึ้นเพื่อเป็ นการเพิ่มช่ องทางในการหา สังคมความบันเทิง บนโลกอินเตอร์ เน็ตอีกเว็บ หนึ่ ง โดยผูใช้สามารถติดตามการโพสข้อความ การ ้ อัพเดทเพลงการแชร์รูปของคนที่เราสนใจได้ ทั้งนี้ ผูจดทาโครงงานหวังเป็ นอย่างยิ่งว่าเว็บไซต์น้ ี อาจเป็ นประโยชน์ต่อผูที่มีความสนใจใน ้ั ้ การพัฒนาเว็บไซต์ หรื อผูที่สนใจ ได้มาศึกษาเพิ่มเติมพร้อมทั้งได้นาแนวทางไปพัฒนาต่อยอดให้เกิด ้ ประโยชน์ยงๆ ขึ้นไป ิ่ นายคมสัน ไผ่งาม นายปิ ยกุล รุ่ งแกร กันยายน 2555
  • 6. สารบัญ หน้ า หน้าอนุมติั ก บทคัดย่อ ข กิตติกรรมประกาศ ค คานา ง สารบัญ จ สารบัญรู ป ช สารบัญตาราง ฌ บทที่ 1 บทนา 1.1 ความเป็ นมาและความสาคัญของปั ญหา 1 1.2 วัตถุประสงค์ 1 1.3 ขอบเขตการศึกษา 2 1.4 นิยามศัพท์เฉพาะ 2 1.5 ประโยชน์ที่คาดว่าจะได้รับ 2 1.6แผนการดาเนินงาน 3 1.7 เครื่ องมือที่คาดว่าจะต้องใช้ 3 บทที่ 2 แนวคิด ทฤษฎีและเอกสารที่เกี่ยวข้อง 2.1 เทคโนโลยีที่ใช้ 5-8 บทที่ 3 การวิเคราะห์และออกแบบ 3.1 แผนภาพบริ บท (Use Case Diagrams) 9 3.2 แผนภาพบริ บท (Context Diagram) 10 3.2 แผนภาพกระแสข้อมูล (Data Flow Diagram) 10 3.3 แผนภาพความสัมพันธ์ระหว่างเอนทิตี (Entity-Relationship Diagram) 12 3.4 ตารางฐานข้อมูล ( Data Table ) 13 3.5 ผังงานโครงสร้างระบบ (Flow Chart) 16 บทที่ 4 การพัฒนาโปรแกรม 4.1 อุปกรณ์และโปรแกรมที่ใช้ 24 4.2 การทางานทั้งหมดของโปรแกรม 26
  • 7. สารบัญ(ต่ อ) หน้ า บทที่ 5 สรุ ปผลการศึกษา การอภิปรายผล และข้อเสนอแนะ 5.1 สรุ ปโครงงาน 31 5.2 ปั ญหาที่เกิดขึ้น 31 5.3 วิธีแก้ปัญหา 32 5.4 ข้อเสนอแนะ 32 บรรณานุกรม 40 ภาคผนวก
  • 8. สารบัญรู ป หน้ า 3.1 แผนภาพบริ บท (Use Case Diagrams) 9 3.2.1 แผนภาพบริ ษท (Context Diagram) ั 10 3.3.1 กระบวนการที่ 1.0 สมาชิก 11 3.3.2 กระบวนการที่ 2.0 เข้าสู่ ระบบ 11 3.3.3 กระบวนการที่ 3.0 แก้ไข 11 3.3.4 กระบวนการที่ 4.0 อับโหลดเพลง 11 3.3.5 กระบวนการที่ 5.0 อับโหลดรู ป 11 3.3.6 กระบวนการที่ 6.0 ลบไฟล์ 11 3.3.7 กระบวนการที่ 7.0 ปรับปรุ งข้อมูล 11 3.3.8 กระบวนการที่ 8.0 ความสัมพันธ์ 11 3.4 แผนภาพความสัมพันธ์ระหว่างเอนทิตีที่มีคุณสมบัติ (Entity-Relationship Diagram) 12 3.5การออกแบแฟ้ มข้อมูล (Data Table) 13 3.6.1 การเข้าสู่ ระบบ 16 3.6.2 การสมัครสมาชิก 17 3.6.3 การอัพโหลดรู ปภาพ 18 3.6.4 การอัพโหลดเพลง 19 3.6.4 การเล่นเพลง 20 3.6.4.1 ระบบการเล่นเพลง 20 3.6.5 การPOST ข้อความ 21 3.6.5.1 ระบบการเก็บ POST 21 3.6.6 ระบบการเข้าใช้งาน Admin 22 3.6.6.1 ระบบ Admin 23 รู ปที่ 6.1 หน้าเว็บ มิวสิ ค โซเชียล (Music Social) 33 รู ปที่ 6.2 หน้า สมัครสมาชิก 34 รู ปที่ 6.3 ฟ้ อง error กรณี ชื่อซ้ ากัน 34 รู ปที่ 6.4 ฟ้ อง error กรณี password ไม่ตรงกัน 35 รู ปที่ 6.5 ฟ้ อง error กรณี e-mail ซ้ ากัน 35 รู ปที่ 6.6 ฟ้ อง Error กรณี กรอกข้อมูลไม่ครบ 36 รู ปที่ 6.7 หน้า Login เข้าระบบ 36
  • 9. สารบัญรู ป(ต่ อ) หน้ า รู ปที่ 6.8 แสดงหน้า Login แล้ว 37 รู ปที่ 6.9 อัพโหลดเพลง 37 รู ปที่ 6.10 เล่นเพลงได้ 38 รู ปที่ 6.11 อัพโหลดรู ป 38 รู ปที่ 6.12 ดูรูปที่อพโหลดได้ ั 39
  • 10. สารบัญตาราง หน้ า ตารางแผนการดาเนินงาน(Gantt chart) 4 ตาราง USER 13 ตาราง ADMIN 14 ตาราง MUSIC 14 ตาราง PHOTO 14 ตาราง POST 15 ตาราง FRIEND 15 ตารางที่ 4.1 แสดงรายชื่อฮาร์ ดแวร์ ท้ งหมดที่ใช้จริ ง ั 24 ตารางที่ 4.2.1 ซอฟต์แวร์ที่ใช้จริ ง 25 ตารางที่ 4.2.2 ใช้ในการทาเอกสาร 26 ตารางที่ 4.3.1 แสดงกระบวนการการทางานของ กระบวนการ 1.0 หน้าหลัก 26 ตารางที่ 4.3.2 แสดงกระบวนการการทางานของ กระบวนการ 2.0 สมัครสมาชิก 27 ตารางที่ 4.4.3 แสดงกระบวนการการแก้ไขข้อมูลสมาชิก กระบวนการ 3.0 แก้ไขชื่อสมาชิก 27 ตารางที่ 4.4.4 แสดงกระบวนการโพสต์ ข้อความ กระบวนการ 4.0 ข้อความ 28 ตารางที่ 4.4.5 แสดงกระบวนการลบโพสต์ ข้อความ กระบวนการ 5.0 ลบข้อความ 28 ตารางที่ 4.4.6 แสดงกระบวนการอับโหลดไฟล์เพลง กระบวนการ 6.0 การอับโหลดไฟล์เพลง 29 ตารางที่ 4.4.7 แสดงกระบวนการลบไฟล์เพลง กระบวนการ 7.0 ลบไฟล์เพลง 29 ตารางที่ 4.4.8 แสดงกระบวนการอับโหลดไฟล์รูป กระบวนการ 8.0 อับโหลดไฟล์รูป 29 ตารางที่ 4.4.9 แสดงกระบวนการลบไฟล์รูป กระบวนการ 9.0 ลบไฟล์รูป 29 ตารางที่ 4.4.10 แสดงกระบวนการการทางานของผูดูแลระบบ กระบวนการ 10.0 ผูดูแลระบบ 30 ้ ้
  • 11. 1 บทที่ 1 บทนำ 1.ประวัติควำมเป็ นมำและควำมสำคัญ ปั จจุบนอินเตอร์ เน็ตเข้ามาเป็ นสวนหนึ่ งในการใช้ชีวิต ประจาวันของผูคน บนโลก ั ้ อินเตอร์ เน็ตผูใช้งานส่ วนใหญ่ที่เข้ามาใช้งานมี ความต้องการใช้งานที่ หลากหลาย เช่ น การ ้ ค้นหาข้อมูล การหาข่าวสารและอัพเดทข่าวสารใหม่ๆ การแลกเปลี่ ยนความคิ ดเห็ น การทา ไดอารี่ ออนไลน์ และ การสร้างความบันเทิงโดยการหาความบันเทิงในโลกอินเตอร์ เน็ตมี หลายรู ปแบบ เช่น การดูคลิปวิดีโอ เล่นเกม ฟังเพลง การหาความบันเทิงในรู ปแบบการฟังเพลงผ่านทางเว็บไซต์เป็ นวิธีการที่ผใช้งานส่ วน ู้ ใหญ่นิยมเลื อกใช้งานมากที่สุดมากกว่าการซื้ อหาแผ่นเพลงมาฟั งและบันทึกลงคอมพิวเตอร์ แต่เว็บไซต์เพลงออนไลน์ส่วนใหญ่จะเป็ นการให้บริ การในรู ปแบบที่ทางเว็บนาเอามาลงไว้ให้ ผูใ ช้ง านได้รั บ ฟั ง โดยไม่ มี ก ารจัด ให้ ผูใ ช้ไ ม่ ส ามารถอัพ โหลดเพลงของตัว เองขึ้ น ไปบน ้ ้ เว็บไซต์ได้ ทาให้เว็บไซต์ส่วนใหญ่ไม่มีการสร้ างสังคมของผูใช้งานที่ มีความชอบในดนตรี ้ แนวเดียวกัน ดัง นั้น เว็บ ไซต์ที่ ส ร้ า งขึ้ น มานี้ จะเป็ นการสร้ า งสั ง คมบนโลกอิ น เตอร์ เ น็ ต ที่ ผูใ ช้ ้ สามารถอัพโหลดเพลงขึ้นไปบนเว็บไซต์ได้รวมไปถึงมีการจัดกระดานข้อความให้ผใช้แต่ละ ู้ คนสามารถแสดงความคิ ดเห็ นรวมไปถึ งพูดคุ ยกันบนเว็บไซต์ รวมไปถึ งมี การจัดโหวดจัด อันดับเพลงที่คนชื้นชอบ 2.วัตถุประสงค์ 1.เป็ นการสร้างกลุ่มเพื่อนทางอินเตอร์เน็ต 2.เป็ นช่องทางการ แชร์ รูป, อัพเดท เพลง 3.เปิ ดช่องทางการแลกเปลี่ยนแสดงความคิดเห็น
  • 12. 2 3.ขอบเขตกำรศึกษำ 1.กำรลงทะเบียนเป็ นสมำชิก 1.1 ผูใช้สามารถกาหนดชื่อผูใช้ รหัสผ่านได้ในการเข้าสู่ ระบบ ้ ้ 1.2 ส่ วนของข้อมูลสมาชิก ผูใช้สามารถระบุชื่อ และอีเมล์ ้ 2.กำรใช้ งำนของสมำชิก 2.1 ผูใช้สามารถอัพโหลดเพลงเพื่อแบ่งปั นแนวเพลงที่เราชอบให้คนอื่นที่มีความ ้ สนใจเข้ามารับฟังได้ 2.2 ผูใช้สามารถแสดงความคิดเห็นเกี่ยวกับแนวเพลงที่รับฟังได้ ้ 2.3 มีพ้ืนที่ในการเก็บไฟล์ที่ผใช้อบโหลดขึ้นไป ู้ ั 2.4 ผูใช้สามารถติดตามสมาชิกที่โพสเพลงที่ชื่นชอบได้ ้ 3.ส่ วนผู้ดูแลระบบ 3.1 สามารถเพิ่ม ลบ แก้ไข ข้อมูลเพลงได้ 3.2 สามารถเพิม ลบ แก้ไข ข้อความต่างๆได้ ่ 4.นิยำมศัพท์เฉพำะ Ruby เป็ นภาษาคอมพิวเตอร์ ที่มีลกษณะเป็ นโปรแกรมแปลภาษา (interpreter) เหมือนกับ Perl, ั Python, Java Rails เป็ นระบบเฟรมเวิร์กสาหรับเว็บแอปพลิเคชันแบบโอเพนซอร์ส ที่พฒนาด้วยภาษารู บี ั 5.ผลทีคำดว่ำจะได้ รับจำกกำรทำโครงงำน ่ 1. เป็ นเว็บไซด์ที่ได้รับความนิยมในการแลกเปลี่ยนแชร์ รูป ไฟล์เพลง
  • 13. 3 6.แผนกำรดำเนินงำน 1. ศึกษาทฤษฎีและเทคโนโลยีที่ใช้ในการสร้างเว็บไซต์ 2. การรวบรวมข้อมูล ที่จาเป็ นในการใช้โปรแกรมต่างๆที่มีส่วนเกี่ยวข้องกับการทางานในการ เขียนเว็บไซต์ท้ งหมด ั 3. ออกแบบหน้าตาเว็บไซต์บนกระดาษ 3. นาเอาโปรแกรมต่างๆมาออกแบบสร้างเว็บไซต์ 4. ทดสอบและแก้ไข 5. จัดทาเอกสาร 6.อุปกรณ์ และซอฟต์ แวร์ ทใช้ ในกำรทำโครงงำน ี่ ฮาร์ดแวร์ Computer Printer ซอฟต์แวร์ ระบบปฏิบติการ ใช้ Ubuntu (12.04) Linux ั ภาษาที่ใช้สร้างเว็บไซต์ Ruby on Rail สาหรับเก็บฐานข้อมูลใช้ SQLite3 Server ใช้ mongrel ตกแต่งรู ปภาพใช้ Photoshop
  • 14. 4 ตำรำงแผนกำรดำเนินงำน(Gantt chart) ตารางแสดงแผนดาเนินการ ระยะเวลาดาเนินงาน ลาดั กิจกรรม ม.ค.-55 ก.พ.-55 มี.ค.-55 เม.ย.-55 พ.ค.-55 มิ.ย.-55 ก.ค.-55 ส.ค.-55 ก.ย.-55 บ 1 ศึกษาแนวคิด ทฤษฎีและเอกสารที่ เกี่ยวข้อง 2 ศึกษาเทคโนโลยี 3 การระบุปัญหา 4 การรวบรวมข้อมูลหรื อการจัดการ ข้อมูล 5 การวิเคราะห์ขอมูลหรื อการ ้ ออกแบบระบบและเว็บไซต์ 6 การสร้างตัวแบบหรื อพัฒนา เว็บไซต์ 7 การทดสอบการใช้งานหรื อทดสอบ ตัวเว็บไซต์ 8 จัดการทาเอกสาร
  • 15. 5 บทที่2 แนวคิด ทฤษฎีและเอกสำรที่เกียวข้ อง ่ 2.1 ทฤษฎีทเี่ กี่ยวข้ อง ปั จจุบนความเจริ ญก้าวหน้าทางด้านเทคโนโลยี สารสนเทศ และการสื่ อสาร มีการพัฒนา ั เปลี่ ยนแปลงไปอย่างรวดเร็ ว มีเทคโนโลยีต่างๆ เกิ ดขึ้นมากมาย เพื่อช่ วยอานวยความสะดวก รวมทั้งให้ความบันเทิง หรื อแม้กระทังการเชื่ อมต่อกันเป็ นเครื อข่าย โดยที่ทุกคนทัว โลกสามารถ ่ ่ เป็ นเพื่อนกัน พบปะพูดคุยกันได้ตลอดเวลา เพียงแค่มีอินเตอร์ เน็ต กับอุปกรณ์สาหรับเชื่ อมต่อ เช่น คอมพิวเตอร์ หรื อโทรศัพท์มือถือ ทาให้การติดต่อสื่ อสารเป็ นไปได้อย่างสะดวก รวดเร็ ว ไม่จาเป็ น ที่จะต้องเดินทางไปพบปะกันโดยตรง ถ้าพูดถึงคาว่า Social Media หรื อ Social Network ในปั จจุบนหลายคนอาจจะสงสัยว่าสิ่ ง ั เหล่านี้ คืออะไร แต่ถาพูดถึง Hi5, Face book, Twitter, Blog, YouTube ฯลฯ เชื่ อว่าหลายคนคงจะ ้ ปฏิเสธไม่ได้ทีจะไม่รู้จก ยิงโดยเฉพาะในวัยรุ่ นหรื อเยาวชนที่อยูในระหว่างการศึกษาเล่าเรี ยน คงจะ ั ่ ่ คุนเคยกันเป็ นอย่างดี ซึ่ งสิ่ งเหล่านี้ (Hi5, Face book, Twitter, Blog, YouTube ฯลฯ) ที่ถูกเรี ยกกว่า ้ Social Media หรื อ Social Networkดังนั้น ่ ถ้าจะให้ความหมายของคาว่า Social Media หรื อ Social Network นั้น จะได้วา Social Media หมายถึง สังคมออนไลน์ที่มีผใช้เป็ นผูสื่อสาร หรื อเขียนเรื่ องราว ประสบการณ์ บทความ ู้ ้ ั รู ปภาพ และวีดีโอ ที่ผใช้เขียนขึ้นเอง ทาขึ้นเอง หรื อพบเจอจากสื่ ออื่นๆ แล้วนามาแบ่งปั นให้กบ ู้ ผูอื่นที่อยู่ในเครื อข่ายของตน ผ่านทางเว็บไซต์ Social Network ที่ให้บริ การบนโลกออนไลน์ ้ ปัจจุบน การสื่ อสารแบบนี้จะทาผ่านทาง Internet และโทรศัพท์มือถือเท่านั้น ั Social Media หมายถึ ง สังคมออนไลน์ที่มีผูใช้เป็ นผูสื่อสาร หรื อเขียนเรื่ องราว ้ ้ ประสบการณ์ บทความ รู ปภาพ และวีดีโอ ที่ผใช้เขียนขึ้นเอง ทาขึ้นเอง หรื อพบเจอจากสื่ ออื่นๆ ู้ ั ้ ่ แล้วนามาแบ่งปั นให้กบผูอื่นที่อยูในเครื อข่ายของตน ผ่านทางเว็บไซต์ Social Network ที่ให้บริ การ บนโลกออนไลน์ ปัจจุบน การสื่ อสารแบบนี้จะทาผ่านทาง Internet และโทรศัพท์มือถือเท่านั้น ั Social Network คือ การที่ผคนสามารถทาความรู ้จกและเชื่ อมโยงกันในทิศทางใดทิศทาง ู้ ั หนึ่ง หากเป็ นเว็บไซต์ที่เรี ยกว่าเป็ นเว็บ Social Network ก็คือเว็บไซต์ที่เชื่ อมโยงผูคนไว้ดวนกัน ้ ้ นั้นเอง (สถาบันคอมพิวเตอร์ มหาวิทยาลัยรามคาแหง, 2552)
  • 16. 6 จากสภาพสังคมในปั จจุ บนที่ อินเตอร์ เข้าถึ งเกื อบทุ กพื้นที่ ทาให้เยาวชนไทยส่ วนใหญ่ ั สามารถเข้าสู่ ระบบเครื อข่ายสารสนเทศได้ สามารถสื บค้นข้อมูลผ่านทางระบบอินเตอร์ เน็ตได้เป็ น อย่างดี ประกอบกับมีเครื่ องมือจาพวก Social Media ออกมามากมาย ยิ่ง เป็ นการทาให้เยาวชนเข้าสู่ ระบบของโลกอินเตอร์ เน็ตมากยิงขึ้น ดังจะเห็นได้จากปั ญหาที่ปรากฏทางหน้าจอโทรทัศน์เกี่ยวกับ ่ การใช้งาน Social Media ที่ไม่ถูกต้องและไม่เหมาะสม ซึ่ งการจะแก้ปัญหาเหล่านี้ ไม่ใช่การแก้โดย การปิ ดกั้นไม่ให้เยาวชนเข้าสู่ โลกอินเตอร์ เน็ตเพราะการปิ ดกั้นเยาวชนจากอินเตอร์ เน็ตก็หมายถึ ง ่ การปิ ดกั้นความรู ้ที่มีอยูมากมายบนโลกอินเตอร์ เน็ตไม่ให้เข้าถึงตัวเยาวชนได้น้ นเอง แต่ทางแก้ที่ดี ั และตรงกับปั ญหามากที่สุดก็คือการปลูกฝังและแนะนาให้เยาวชนใช้เครื่ องมือ Social Media เหล่านี้ ในทางที่เหมาะสม เช่ น ใช้ในเชิ งการศึกษา ได้แก่ การสอบถามปั ญหาการเรี ยนกับเพื่อนหรื อ ครู ผสอน การสรุ ปความรู ้เก็บไว้บนเว็บส่ วนตัว หรื อเผยแพร่ ความรู ้ ต่างๆ ตามความเข้าใจบนสื่ อ ู้ ทางอินเตอร์ เน็ต รวมทังการสื บค้นข้อมูลบนอินเตอร์ เน็ต เป็ นต้นสิ่ งเหล่านี้ สามารถปลูกฝังได้โดย ่ ผูปกครอง ครู / อาจารย์ รวมทั้งเพื่อนหรื อคนรอบข้าง ยิ่งถ้าสังคมมีแนวโน้มที่ใช้ SocialMedia ใน ้ เชิงการศึกษามาขึ้นเท่าใด เยาวชนทุกคนก็จะมีแนวโน้มที่จะคล้อยตามและปฏิบติตามเป็ นนิ สัยและ ั กิจวัตรมากขึ้น 2.2 เทคโนโลยีทเี่ กี่ยวข้ อง 2.2.1 Ruby จากวิกิพีเดีย สารานุกรมเสรี ภำษำรู บี (Ruby) เป็ น ภาษาโปรแกรมเชิงวัตถุ ที่ได้รับอิทธิพลของโครงสร้างภาษามาจาก ภาษาเพิร์ลกับภาษาเอดา มีความสามารถในเชิงวัตถุแบบเดียวกับภาษาสมอลทอล์ค และมี ความสามารถหลายอย่างจากภาษาไพทอน, ภาษาลิสป์ , ภาษา Dylan และภาษา CLU ตัวแปลภาษารู บีตวหลักเป็ นซอฟต์แวร์เสรี และเป็ นตัวแปลแบบอินเตอร์ พรี เตอร์ ั ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki ) เวลา 14.45 7 เมษายน 2555
  • 17. 7 2.2.2 Rails รู บีออนเรลส์ (อังกฤษ: Ruby on Rails: RoR) หรื อนิยมเรี ยกสั้นๆ ว่า เรลส์ (Rails) เป็ น ระบบเฟรมเวิร์กสาหรับเว็บแอปพลิเคชันแบบโอเพนซอร์ ส ที่พฒนาด้วยภาษารู บี โดยอิง ั แนวความคิดแบบ Model-View-Controller (MVC) เป็ นสถาปั ตยกรรมพื้นฐาน รู บีออนเรลส์ มีชื่อเสี ยงจากความง่ายในการใช้งาน โดยใช้การเขียนโปรแกรมจานวนน้อยบรรทัด กว่า และมีการระบุค่าตั้งน้อยกว่าเฟรมเวิร์กที่ออกมาก่อนหน้าตัวอื่นๆ การติดตั้งรู บีออนเรลส์ทาได้ โดยผ่านระบบ RubyGems ซึ่งเป็ นระบบการจัดการส่ วนประกอบในภาษารู บ้ ีอย่างเป็ นทางการ ั รู บีออนเรลส์ เริ่ มพัฒนาโดย David Heinemeier Hansson เพื่อใช้กบเครื่ องมือจัดการโครงการชื่ อ Basecamp ของบริ ษท 37 Signals ที่เขาทางานอยูรูบีออนเรลส์ได้เผยแพร่ สู่สาธารณะชนเมื่อเดือน ั ่ กรกฎาคม ค.ศ. 2004 โดยรุ่ นปั จจุบนนั้นคือ rails 3.2 ั ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki) เวลา 15.03 7 เมษายน 2555 2.2.3 CSS (Cascading Style Sheet) CSS (Cascading Style Sheet) จัดเป็ นภาษาที่ใช้เป็ นส่ วนของการจัดรู ปแบบการแสดงผล เอกสาร HTML โดยที่ CSS กาหนดกฏเกณฑ์ในการระบุรูปแบบ (หรื อ "Style") ของเนื้ อหาใน เอกสาร อันได้แก่สีของข้อความ สี พ้ืนหลัง ประเภทตัวอักษร และการจัดวางข้อความ ซึ่ งการกาหนด รู ปแบบ หรื อ Style นี้ใช้หลักการของการแยกเนื้อหาเอกสาร HTML ออกจากคาสั่งที่ใช้ในการ ่ ั จัดรู ปแบบการแสดงผล กาหนดให้รูปแบบของการแสดงผลเอกสาร ไม่ข้ ึนอยูกบเนื้อหาของเอกสาร เพื่อให้ง่ายต่อการจัดรู ปแบบการแสดงผลลัพธ์ของเอกสาร HTML โดยเฉพาะในกรณี ที่มีการ เปลี่ยนแปลงเนื้อหาเอกสารบ่อยครั้ง หรื อต้องการควบคุมให้รูปแบบการแสดงผลเอกสาร HTML มี ลักษณะของความสม่าเสมอทัวกันทุกหน้าเอกสารภายในเว็บไซต์เดียวกัน โดยกฏเกณฑ์ในการ ่ กาหนดรู ปแบบ (Style) เอกสาร HTML ถูกเพิ่มเข้ามาครั้งแรกใน HTML 4.0 เมื่อปี พ.ศ. 2539 ใน รู ปแบบของ CSS level 1 Recommendations ที่กาหนดโดย องค์กร World Wide Web Consortium หรื อ W3C หลังจากนั้น องค์กร W3C ได้กาหนด CSS level 2 Recommendations เพื่อเพิ่มเติม กฏเกณฑ์การกาหนดรู ปแบบของสื่ อที่ใช้การแสดงผลข้อมูล โดยผูสร้างเอกสาร อาจเลือกใช้ ้ รู ปแบบ หรื อ "Style" ในการกาหนดรู ปแบบให้แสดงผล หรื อ กาหนดให้ไม่แสดงผลข้อมูล บน อุปกรณ์บางประเภทที่มีรูปแบบการแสดงผลข้อมูลต่างจากการแสดงออกทางหน้าจอปกติ โดย ผูสร้างเอกสารสามารถใช้ CSS ในกาหนดรู ปแบบการแสดงผลที่เหมาะสม โดยไม่ข้ ึนอยูกบ ้ ่ ั เนื้อหาภายในเอกสาร ตัวอย่างเช่น เอกสารฉบับเดียวกัน เมื่อแสดงผลบนอุปกรณ์สาหรับคน สายตาพิการ อาจกาหนดรู ปแบบให้ไม่แสดงรู ปภาพ แต่แสดงในรู ปแบบอื่นที่เหมาะสม หรื อ บนอุปกรณ์สาหรับคนหูหนวก อาจกาหนดไม่ให้ตองแสดงข้อมูลเสี ยง แต่แสดงผลในรู ปแบบ ้ ของข้อความ เป็ นต้น
  • 18. 8 ที่มา : (http://www.xvlnw.com/knowledge-readknowledge-id158.html) เวลา เวลา 16.45 7 เมษายน 2555 2.2.4 SQLite เป็ นระบบฐานข้อมูลที่มีลกษณะเรี ยบง่ายคือ ตัว SQLite จะเก็บข้อมูลลงในไฟล์โดยตรง ั (คล้าย MS Access) ไม่มีการติดต่อผ่าน Network socket เหมือนกับฐานข้อมูลตัวอื่นๆ ทาให้มีขอ ้ ได้เปรี ยบเรื่ องความเร็ วในการดึงข้อมูล ซึ่ งปั จจุบนพัฒนาจนถึงรุ่ นที่ 3 แล้วใน การใช้งาน SQLite ั ผูใช้งานสามารถดาวน์โหลดโปรแกรม manager เพื่อจัดการกับฐานข้อมูล ซึ่ งจะทาให้การทางาน ้ นั้นง่ายขึ้นมาก ตั้งแต่การสร้างฐานข้อมูล สร้างตาราง ใส่ ขอมูล จนถึงสาเนาข้อมูล (Dump, Import, ้ Export ใช้งานฟรี (ฟรี แวร์ ) ไม่เสี ยค่าใช้จ่ายและทางานได้บน Windows 32 และ 64 bits ที่มา : (http://www.allwebfactory.com/news/node/18) เวลา เวลา 17.03 7 เมษายน 2555 2.2.5 JavaScript เป็ นภาษาสคริ ปต์ ทีมีลกษณะการเขียนแบบโปรโตไทพ (Prototyped-based Programming) ั ส่ วนมากใช้ในหน้าเว็บเพื่อประมวลผลข้อมูลที่ฝั่งของผูใช้งาน แต่ก็ยงมีใช้เพื่อเพิ่มเติม ้ ั ่ ความสามารถในการเขียนสคริ ปต์โดยฝังอยูในโปรแกรมอื่นๆ จาวาสคริ ปต์ (JavaScript) เริ่ มพัฒนาโดย Brendan Eich พนักงานบริ ษทเน็ตสเคป โดย ั ขณะนั้นจาวาสคริ ปต์ใช้ชื่อว่า โมคา และภายหลังได้เปลี่ยนชื่อมาเป็ น ไลฟ์ สคริ ปต์ และเป็ น จาวา สคริ ปต์ในปั จจุบน รู ปแบบการเขียนภาษาที่ใช้ คล้ายคลึงกับภาษาซี รุ่ นล่าสุ ดของจาวาสคริ ปต์คือ ั 2.0 ซึ่ งตรงกับมาตรฐานของ ECMAScript ที่มา : (จากวิกิพีเดีย สารานุกรมเสรี http://th.wikipedia.org/wiki ) เวลา 17.20 7 เมษายน 2555
  • 19. 9 บทที่ 3 กำรวิเครำะห์ และออกแบบ ออกแบบระบบมีความสาคัญ เพราะเป็ นปั จจัยในการสร้างและพัฒนาระบบสารสนเทศ การวิเคราะห์ระบบเป็ นเรื่ องที่น่าสนใจ เพราะนักวิเคราะห์ ระบบต้องติดต่อกับคนหลายคน ได้รู้ถึง การจัดการและการทางานในองค์การทาให้เรามีความรู ้เกี่ยวกับระบบคอมพิวเตอร์ หลายแบบมากขึ้น ผูที่สามารถวิเคราะห์ระบบได้ดีควร มี ประสบการณ์ ในการเขียนโปรแกรม มีความรู ้ทางด้านธุ รกิจ ้ ความรู ้ เกี่ ยวกับระบบเครื อข่ายและฐานข้อมูล ซึ่ งใช้เป็ นความรู้ในการออกแบบระบบที่มีความ แตกต่างกันออกไปตาม สภาพงาน ดังนั้นหน้าที่ของนักวิเคราะห์ ก็คือการศึกษาระบบ แล้วให้ คาแนะนาในการปรับปรุ งและพัฒนาระบบนั้นจนเสร็ จสมบูรณ์ ซึ่ งการทางานทั้งหมดต้องมีลาดับ ขั้นตอน และการ ศึกษาวิธีการวิเคราะห์และการออกแบบระบบในแต่ละขั้นตอนทาให้เราเข้าใจ และสามารถที่จะวิเคราะห์ระบบนั้นๆได้อย่างดีที่สุดอีกด้วย 3.1 แผนภำพบริบท (Use Case Diagrams) แสดงให้เห็นถึงการติดต่อการใช้ขอมูลระหว่างผูใช้ที่เป็ นสมาชิกกับเว็บไซต์การเรี ยกใช้ขอมูลต่างๆ ้ ้ ้ บนเว็บไซต์
  • 20. 10 3.2 ผังงำนโครงสร้ ำงระบบ 3.2.1 แผนภาพบริ ษท (Context Diagram) ั 3.3 แผนภำพกระแสข้ อมูล ( Data Flow Diagram ) แผนภาพกระแสข้อมูลแสดงรายละเอียดต่างๆ ของการทางานของ เว็บสังคมเพลงออนไลค์ 3.3.1 กระบวนการที่ 1.0 สมาชิก 3.3.2 กระบวนการที่ 2.0 เข้าสู่ระบบ 3.3.3 กระบวนการที่ 3.0 แก้ไข 3.3.4 กระบวนการที่ 4.0 อับโหลดเพลง 3.3.5 กระบวนการที่ 5.0 อับโหลดรู ป 3.3.6 กระบวนการที่ 6.0 ลบไฟล์ 3.3.7 กระบวนการที่ 7.0 ปรับปรุ งข้อมูล 3.3.8 กระบวนการที่ 8.0 ความสัมพันธ์
  • 21. 11 1.0 D1 Database Email&Password 2.0 D1 Database 3.0 D1 Database 4.0 D2 Database 5.0 D3 Database 6.0 D2,D3 Database D5 7.0 D1 8.0 D4
  • 22. 12 3.4 แผนภำพควำมสั มพันธ์ ระหว่ ำงเอนทิตีทมีคุณสมบัติ (Entity-Relationship Diagram) ี่ M M สมาชิก เพื่อน 1 1 1 M M เพลง M รู ปภาพ POST
  • 23. 13 MUSIC USER PK USER_ID PK ID POST NAMEMUSIC NAME PK USER_ID LASTNAME USER_NAME PK EMAIL POST PASSWORD TIME TEL PHOTO AGE ADMIN PK USER_ID PK ADMIN NAMEPHOTO FRIEND ADMIN PK FRIEND_ID _USERNAME FRIEND_NAME ADMIN _PASSWORD 3.5กำรออกแบแฟมข้ อมูล(Data Table) ้ ชื่อตาราง USER ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 ID รหัส 10 INT - NOT NULL PK 2 NAME ชื่อ 20 Character - NOT NULL 4 EMAIL อีเมลล์ 30 Character - PK 5 PASSWORD รหัสผ่าน 15 INT -
  • 24. 14 ชื่อตาราง ADMIN ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 USERNAME ชื่อ 30 Character - NOT NULL PK 2 PASSWORD รหัสผ่าน 15 INT - NOT NULL ชื่อตาราง MUSIC ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 USER_ID รหัสผูอพ ้ั 10 INT - NOT NULL PK 2 NAMEMUSIC ชื่อเพลง 20 Character - NOT NULL ชื่อตาราง PHOTO ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 USER_ID รหัสผูอพ ้ั 10 INT - NOT NULL PK 2 NAMEPHOTO ชื่อเพลง 20 Character - NOT NULL
  • 25. 15 ชื่อตาราง POST ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 USER_ID รหัสผูอพ ้ั 10 INT - NOT NULL PK 2 ID รหัสโพสต์ 10 INT - NOT NULL 3 POST ข้อความ 140 Character - NOT NULL 4 TIME เวลา 10 Character - NOT NULL ชื่อตาราง FRIEND ลาดับ คุณสมบัติ คาอธิบาย ขนาด ประเภท ค่าเบื้องต้น ตรวจสอบ ประเภทคีย ์ (Sequenc (Attribute) (Description) (Width) (Type) (Default) ความถูกต้อง (Key Type) e No) 1 FRIEND_ID ชื่อเพื่อน 20 Character - NOT NULL PK 2 FRIEND_NAME รหัสผ่าน 30 Character - NOT NULL
  • 26. 16 3.6 แผนกำรทำงำน (Flowchart) 3.6.1 การเข้าสู่ ระบบ เริ่ ม หน้าแรกของเว็บ no สมัครสมาชิก yes no ระบบสมัคร เข้าสู่ระบบ จบการทางาน สมาชิก yes ระบบของผูใช้ ้ ระบบสังคม เพลง ระบบอัพเดต สถานะ จบการทางาน
  • 28. 18 3.6.3 การอัพโหลดรู ปภาพ เริ่ มการทางาน หน้าเว็บอัพรู ปภาพ yes no ตรวจสอบไฟล์ภาพ ระบบอัพโหลด ลงฐานข้อมูล ระบบแสดง รู ปภาพ จบการทางาน
  • 29. 19 3.6.4 การอัพโหลดเพลง เริ่ มการทางาน หน้าเว็บอัพโหลดเพลง yes no ตรวจสอบไฟล์เพลง ระบบอัพโหลดลง ฐานข้อมูล แสดงผลการอัพโหลดเพลง จบการทางาน
  • 30. 20 3.6.4 การเล่นเพลง เริ่ มการทางาน หน้าเว็บแสดงเพลง yes no ตรวจสอบการเลือกเพลง ระบบเล่นเพลง จบการทางาน 3.6.4.1 ระบบการเล่นเพลง เริ่ มการทางาน ดึงไฟล์เพลงจาก ฐานข้ อมูล ระบบเล่นเพลง แสดงผลการเล่นเพลง จบการทางาน
  • 31. 21 3.6.5 การPOST ข้อความ เริ่ มการทางาน หน้าเว็บPOST ระบบPOST ข้อความ บันทึกลง ฐานข้อมูล จบการทางาน 3.6.5.1 ระบบการเก็บ POST เริ่ มการทางาน บันทึกข้ อความ ลงฐานข้ อมูล จบการทางาน
  • 32. 22 3.6.6 ระบบการเข้าใช้งาน Admin เริ่ มการทางาน หน้าเว็บไซต์ Admin ตรวจสอบ user & Password Admin ระบบ Admin จบการทางาน
  • 34. 24 บทที่ 4 กำรพัฒนำโปรแกรม บทนี้จะกล่าวถึงเครื่ องมือและอุปกรณ์ที่ใช้ในการพัฒนาเว็บไซต์ การพัฒนาโปรแกรมนี้ จะ ทาให้เข้าใจถึงระบบการทางาน วิธีการประมวลผลและรวมไปถึงระบบการทางานโดยรวม ซึ่งใน การกาหนดรายละเอียดต่างๆ ที่เป็ นองค์ประกอบสาคัญในการพัฒนาและปรับปรุ งระบบ 4.1 ฮาร์ดแวร์ที่ใช้ ตารางที่ 4.1 แสดงรายชื่อฮาร์ ดแวร์ ท้ งหมดที่ใช้จริ ง ั ชื่อฮาร์ดแวร์ นามาใช้เพื่อ เลือกเพราะ คอมพิวเตอร์โน๊ตบุค ๊ เขียนโปรแกรม, ทดสอบ สะดวกสบายในการพกพาและ โปรแกรม, จาลองเป็ นเซิฟ ง่ายต่อการทดสอบโปรแกรม เวอร์ เครื่ องปริ้ น ใช้ริ้นเอกสารต่างๆ เมือเป็ นเอกสารจะสามารถดูได้ ง่ายกว่าเป็ นไฟล์เอกสารใน คอมพิวเตอร์
  • 35. 25 4.2 ซอฟต์แวร์ที่ใช้ ตารางที่ 4.2.1 ซอฟต์แวร์ที่ใช้จริ ง ชื่อซอฟต์แวร์ นามาใช้เพื่อ เลือกเพราะ OS Ubuntu 12.04 นามาเป็ นระบบปฏิบติการที่ใช้ ั เป็ นOS linuxที่ใช้งานง่ายแล้ว ในการพัฒนาเว็บไซต์ดวย Ruby คนนิยมที่จะใช้ในการเขียน ้ เว็บ Ruby on Rails Ruby on Rails (os Ubuntu ) เป็ นภาษาที่ใช้ในการเขียน เป็ นภาษาที่มีความหน้าสนใจมี เว็บไซต์ รู ปแบบการเขียนที่ดูเข้าใจง่าย มีการเขียนที่นอยบรรทัด ้ SQLite (os Ubuntu ) จัดการระบบ ฐานข้อมูลของเว็บ เป็ นโปรแกรมที่ใช้งานง่ายใน การจัดการกับฐานข้อมูล และ ใช้ควบคู่กบRuby on Rails ั Mongrel (os Ubuntu ) นามาใช้เป็ น server เป็ นโปรแกรมที่ใช้งานง่ายกับ เว็บ Ruby on Rails OS windows 7 นามาเป็ นระบบปฏิบติการที่ใช้ ั เป็ นOS ที่สนับสนุนการ เพื่อทาเอกสาร และตกแต่งรู ป ทางานกับโปรแกรม Microsoft office 2007 และ Photoshop Photoshop (os windows) แต่งภาพ ตัดต่อภาพมาใช้บน เป็ นโปรแกรมที่ใช้งานง่าย มี เว็บไซต์ ความสามารถในการตกแต่ง รู ปภาพต่างๆได้อย่างมี ประสิ ทธิภาพ
  • 36. 26 ตารางที่ 4.2.2 ใช้ในการทาเอกสาร Microsoft office 2007 ใช้ทาเอกสารโครงงาน ช่วยในการจัดทาเอกสาร โครงงานเพราะเป็ นโปรแกรม (os windows) Word ที่มีประสิ ทธิภาพในการทา Powerpoint เอกสารและง่ายต่อการใช้งาน Microsoft office Visio 2007 ใช้ทาแผนภาพ ช่วยให้การทาเอกสารที่เป็ น แผนภาพ ง่ายขึ้นเพราะมี เครื่ องมือที่ง่ายต่อการสร้าง 4.3 การทางานทั้งหมดของโปรแกรมมีกระบวนการทั้งหมดดังนี้ ตารางที่ 4.3.1 แสดงกระบวนการการทางานของ กระบวนกำร 1.0 หน้าหลัก ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ เข้าสู่ ระบบ เป็ นกระบวนการที่สมาชิกของ เว็บไซต์ใช้ในการ เข้าสู่ ระบบ โดยการใส่ อีเมล์ และ รหัสผ่าน ของตนเอง
  • 37. 27 ตารางที่ 4.3.2 แสดงกระบวนการการทางานของ กระบวนกำร 2.0 สมัครสมาชิก ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ การสมัครสมาชิก เป็ นกระบวนการในการสมัคร สมาชิกเพื่อเข้าสู่ ระบบการ ชื่อ และอีเมล์ ไม่สามารถซ้ า ทางานต่างๆของเว็บไซต์ โดย กันได้ กรอกข้อมูลในการสมัคร สมาชิกดังนี้ อย่างน้อย 6 ตัวอักษร 1. ชื่อผูใช้ ้ 2. e-mail 3. พาสเวิร์ดในการเข้าระบบ 4. คอนเฟิ ร์มพาสเวิร์ด ตารางที่ 4.4.3 แสดงกระบวนการการแก้ไขข้อมูลสมาชิก กระบวนกำร 3.0 แก้ไขชื่อสมาชิก ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ การแก้ไขชื่อสมาชิก เป็ นกระบวนการที่ใช้ในการ แก้ไขชื่อ พาสเวิร์ด ไปถึงการ เปลียน e-mail
  • 38. 28 ตารางที่ 4.4.4 แสดงกระบวนการโพส ข้อความ กระบวนกำร 4.0 ข้อความ ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ กระดานสนทนา เป็ นกระบวนการที่ให้สมาชิก ใช้ในการแสดงความคิดเห็นใน กระดานของตนเอง ตารางที่ 4.4.5 แสดงกระบวนการลบโพสต์ ข้อความ กระบวนกำร 5.0 ลบข้อความ ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ ลบข้อความ เป็ นกระบวนการที่ใช้ในการลบ ข้อความที่โพสต์ไว้ออก
  • 39. 29 ตารางที่ 4.4.6 แสดงกระบวนการอับโหลดไฟล์เพลง กระบวนกำร 6.0 การอับโหลดไฟล์เพลง ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ การอับโหลดไฟล์เพลง เป็ นการอับโหลดไฟล์เพลงเข้า ไปบนเว็บเป็ น.mp3 ตารางที่ 4.4.7 แสดงกระบวนการลบไฟล์เพลง กระบวนกำร 7.0 ลบไฟล์เพลง ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ ลบไฟล์เพลง เป็ นการลบเพลงที่ไม่ตองการ ้ ออก ตารางที่ 4.4.8 แสดงกระบวนการอับโหลดไฟล์รูป กระบวนกำร 8.0 อับโหลดไฟล์รูป ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ อับโหลดไฟล์รูป เป็ นการอับโหลดรู ปภาพที่ ประทับใจ ตารางที่ 4.4.9 แสดงกระบวนการลบไฟล์รูป กระบวนกำร 9.0 ลบไฟล์รูป ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ ลบไฟล์รูป เป็ นลบไฟล์รูปภาพที่ไม่ ต้องการใช้ออก
  • 40. 30 ตารางที่ 4.4.10 แสดงกระบวนการการทางานของผูดูแลระบบ กระบวนกำร 10.0 ผูดูแลระบบ ้ ้ ชื่อ กระบวนการ คาอธิบายการทางาน หมายเหตุ การจัดการระบบสมาชิก สามารถลบสมาชิกได้ การจัดการเพลง สามารถลบไฟล์เพลงได้ การจัดการรู ป สามารถลบรู ปได้
  • 41. 31 บทที่ 5 สรุ ปผลกำรศึกษำ กำรอภิปรำยผล และข้ อเสนอแนะ 5.1 สรุ ปผลกำรดำเนินงำน โครงงาน มิวสิ ค โซเชียล (Music Social) เว็บไซต์สังคมเพลง จัดทาขึ้นโดยออกแบบ ั โครงสร้างในรู ปแบบของเว็บไซต์กบฐานข้อมูล เพื่อรองรับการใช้งานของผูใช้ ้ เว็บไซต์สังคมเพลง เป็ นอีกช่องทางเลือกหนึ่งในการบริ การให้ผใช้ที่สนใจเข้ามา ู้ แลกเปลี่ยนข่าวสารแชร์ รูปภาพ แชร์ เพลงได้ การทางานของเว็บไซต์เน้นให้ผใช้สามารถจัดการ ู้ ข้อมูลได้เองมากขึ้น ผูใช้สามารถเพิม ลบ แก้ไข ข้อมูล ไฟล์ที่ตนเองได้แชร์ ไว้ ได้ในส่ วนที่ระบบ ้ ่ ได้จดไว้สาหรับการจัดการในส่ วนของสมาชิก ั 5.2 ปัญหำทีเ่ กิดขึน้ 5.2.1 ปั ญหาเกิดจากภาษา Ruby เป็ น ภาษาที่กลุ่มเราไม่เคยศึกษามาก่อนจึงทาให้ไม่เข้าใจการเขียน code ่ 5.2.2 การเขียน Code ruby มีการทางานเป็ น part ดังนั้นไฟล์ codeจะอยูหลาย folder ที่เรี ยกใช้งาน ดังนั้นจะทาให้เกิดความสับสนในการแก้ไขหรื อ ปรับปรุ งงาน 5.2.3 ภาษา Ruby เป็ นการเขียนโดยใช้ terminal เป็ นตัว create หน้าเว็บไซต์ข้ ึนมาโดยที่เราจะยังไม่ เห็นหน้าเว็บที่เราสร้างขึ้นมาจนกว่าจะพิมพ์ code เสร็ จถึงจะเห็นหน้าเว็บที่เราพิมพ์ 5.2.4 ปั ญหาเกิดจาก Os ที่เราใช้ในการทางาน มีการเปลี่ยนเวอร์ ชนเพื่อพัฒนาแก้ไข bug ต่างๆใน ั่ ระบบทาให้เราต้องเปลี่ยนเวอร์ ชนของโปรแกรม Rails เป็ นเวอร์ ชนใหม่ ทาให้การเรี ยกใช้ขอมูล ั่ ั่ ้ ของ code เปลี่ยนไป 5.2.5 เมื่อมีการเปลี่ยน rails เป็ นเวอร์ ชนใหม่เพื่อรองรับกับ OS ก็ยงไม่อาจแก้ไข bug ได้ท้ งหมด ่ั ั ั อาจต้องมีการนา OS ตัวใหม่ มาใช้คู่กบ rails เวอร์ ชนเก่าเพื่อเป็ นการลดปัญหา bug ตัวใหม่ที่ติดมา ั ั่ ั่ ั่ ั ่ กับ rials เวอร์ ชนใหม่เพราะ rails เวอร์ ชนเก่าก็จะมีตวที่ผานการแก้ไข bug แล้ว
  • 42. 32 5.3 วิธีกำรแก้ไข 5.3.1กลุ่มเราต้องไปศึกษาการเขียน Code Ruby ใหม่ต้ งแรกจากเว็บไซต์ต่างที่เกี่ยวข้องกับ การเขียน ั เว็บด้วยภาษา Ruby เช่น เว็บ http://ruby.railstutorial.org/ ่ 5.3.2 ในการแก้ไขงาน เราต้องเข้าไปเปิ ดไฟล์ที่เราเขียนเพื่อดูวาไฟล์น้ นเรี ยกใช้ไฟล์ตวใดบ้าง แล้ว ั ั ไล่ดูถึงความสัมพันธ์เพื่อหาจุดแก้ไข 5.3.3 ต้องไปหาไฟล์ที่ใช้ในการดึงข้อมูลแสดงในหน้าเว็บแล้วเข้าไปลองแก้ไขที่ละจุดแล้วเปิ ดหน้า เว็บดูการเปลี่ยนแปลงไปที่ละอย่าง 5.3.4 ดังนั้นเราจึงต้องทาการออกแบบ website ก่อนแล้วมาเรี ยบเรี ยง code ของการสร้างชิ้นงาน เพื่อให้เกิดความผิดพลาดน้อยมี่สุด 5.3.4 มีการนาเอา code เวอร์ ชนเก่า + เวอร์ ชนใหม่เข้ามาใช้งานพสมกันเพื่อเป็ นการลด bug ของ ั่ ั่ code 5.4 ข้ อเสนอแนะ 5.4.1 ควรศึกษาภาษาและโปรแกรมที่ใช้ในการเขียนเว็บไซต์ให้มาก เพื่อให้เกิดความชานาญและ ความเข้าใจในการใช้งานได้อย่างมีประสิ ทธิ ภาพเพื่อนามาใช้ในการเขียนโปรแกรม ลดปั ญหาต่างๆ ในการพัฒนาโปรแกรม 5.4.2 ควรศึกษาถึงการทางานในการจัดการฐานข้อมูลให้เหมาะสมกับเว็บไซต์หรื อเว็บแอพพลิเคชัน่ ที่ตองการ ทาให้ออกแบบเว็บไซต์ได้เป็ นไปตามที่ตองการง่ายในการเขียนเว็บไซต์หรื อเว็บ ้ ้ แอพพลิเคชัน ่ 5.4.3 ผูพฒนาเว็บไซต์หรื อเว็บแอพพลิเคชันควรตระหนักถึงการจัดรู ปแบบของ Source code การ ้ ั ่ เขียนคอมเม้นไว้ในแต่ละส่ วนการทางาน เพื่อง่ายต่อการแก้ไข
  • 43. 33 บทที่ 6 คู่มือกำรใช้ งำน 6.1 โปรแกรมทีต้องใช้ ในระบบ ่ 6.1.1 Ruby on Rails 6.1.2 SQLite 6.2 คู่มือกำรใช้ งำน หน้าเว็บ มิวสิ ค โซเชียล (Music Social) รู ปที่ 6.1 หน้าเว็บ มิวสิ ค โซเชียล (Music Social)
  • 44. 34 สมัครสมาชิกเพื่อสามารถเข้ามาอับโหลดเพลงแชร์ เพลง แชร์รูปที่หน้าประทับใจ แลกเปลี่ยนความ คิดเห็นติดตามคนที่เราชอบ รู ปที่ 6.2 หน้า สมัครสมาชิก รู ปที่ 6.3 ฟ้ อง error กรณี ชื่อซ้ ากัน
  • 45. 35 รู ปที่ 6.4 ฟ้ อง error กรณี password ไม่ตรงกัน รู ปที่ 6.5 ฟ้ อง error กรณี e-mail ซ้ ากัน
  • 46. 36 รู ปที่ 6.6 ฟ้ อง Error กรณี กรอกข้อมูลไม่ครบ รู ปที่ 6.7 หน้า Login เข้าระบบ
  • 47. 37 รู ปที่ 6.8 แสดงหน้า Login แล้ว สมาชิกสามารถเข้ามาอับโหลดเพลงฟังเพลงได้จากหน้าเว็บ รู ปที่ 6.9 อัพโหลดเพลง
  • 48. 38 รู ปที่ 6.10 เล่นเพลงได้ สมาชิกสามารถเข้ามาอับโหลดรู ปและดูได้จากหน้าเว็บ รู ปที่ 6.11 อัพโหลดรู ป
  • 49. 39 รู ปที่ 6.12 ดูรูปที่อพโหลดได้ ั
  • 50. 40 บรรณำนุกรม Ebook ruby on rails tutorial จาก http://ruby.railstutorial.org/ วิธีแสดงการทางานของ code จาก http://stackoverflow.com/ นามาปรับใช้ กบเว็บไซต์ ั