84
เว็บไซต์ระบบขายสินค้าออนไลน์ประเภทเสื ้อผ ้ามือสอง Website E-commerce Second hand clothes จัดทาโดย นายรัชกฤช วรภิญโญภาส นายภาสกร นุชเทียน โครงการนี ้เป็นส่วนหนึ ่งของการศึกษาตามหลักสูตรประกาศนียบัตรวิชาชีพชั ้นสูง สาขาวิชาคอมพิวเตอร์ธุรกิจ วิทยาลัยเทคโนโลยีอรรถวิทย์พณิชยการ ปีการศึกษา 2561

Website E-commerce Second hand clothes

  • Upload
    others

  • View
    8

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Website E-commerce Second hand clothes

เวบไซตระบบขายสนคาออนไลนประเภทเสอผามอสอง Website E-commerce Second hand clothes

จดท าโดย นายรชกฤช วรภญโญภาส นายภาสกร นชเทยน

โครงการนเปนสวนหนงของการศกษาตามหลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ

วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561

ชอโครงการภาษาไทย เสอผามอสอง ชอโครงการภาษาองกฤษ Second hand clothes โดย 1 นายรชกฤช วรภญโญภาส 2 นายภาสกร นชเทยน คณะกรรมการอนมตใหเอกสารโครงการฉบบนเปนสวนหนงของการศกษาวชาโครงการ ตามหลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทย พณชยการ (ATC)

( อาจารยนราภรณ บวนช )

อาจารยทปรกษา

( อาจารยศรพร สงบภย)

อาจารยทปรกษารวม

(อาจารยดฐประพจน สวรรณศาสตร)

หวหนาสาขาวชาคอมพวเตอรธรกจ

บทคดยอ หวขอโครงการ เสอผามอสอง Second hand clothes

ผจดท าโครงการ นายรชกฤช วรภญโญภาส นายภาสกร นชเทยน อาจารยทปรกษา อาจารยนราภรณ บวนช อาจารยทปรกษารวม อาจารยศรพร สงบภย สาขาวชา สาขาวชาคอมพวเตอรธรกจ สถาบน วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 --------------------------------------------------------------------------------------------------------------------------

บทคดยอ เวบไซตออนไลนทอ านวยความสะดวกในเรองของการซอขายเสอผาทมความสมพนธกบขอมลสนคาไดอยางงายดาย ชวยลดความยงยากทเกดขนของการจดสนคาทไมเปนระเบยง เพราะมเวบไซตขายของออนไลนทคอยอ านวยความสะดวกในดานการชมสนคา เวบไซตขายของออนไลนนจะชวยท าใหสามารถทจะดสนคาทเราตองการทสนใจหรอตองการจะซอโดยทไมตองไปดถงหนาราน โดยสามารถดสนคาไดทกอยางภายในเวบไซต โดยจะมระบบLoginซงจะมเพยงแอดมนของเวบไซตเทานนทจะสามารถเขาใชงาน ปรบปรง เพม-ลด แกไข ขอมลของสนคาไดเพอรกษาความปลอดภย ผเขาใชระบบจะสามารถเปดเขาใชงานเวบไซตเกยวกบสนคาเสอผามอสองเพอเปนประโยชนใหกบธรกจการคาและสรางความสะดวกในการตรวจสอบสนคาภายในราน เพอตอบสนองความตองการของผเขาใชเวบไซตทเราจดท าขน ทงนคณะผจดท าไดค านงถงความสามารถในการตอบสนองความตองการของผใช

กตตกรรมประกาศ

โครงการนส าเรจลลวงไดดวยความกรณาจากอาจารยนราภรณ บวนชอาจารยทปรกษาหลก และอาจารยศรพร สงบภย อาจารยทปรกษารวม ทไดใหค าเสนอแนะ แนวคด ตลอดจนแกไขขอบกพรองตาง ๆ มาโดยตลอด จนโครงการเลมนเสรจสมบรณ ผศกษาจงขอกราบขอบพระคณเปนอยางสง ขอกราบขอบพระคณ คณพอ คณแม และผปกครอง ทใหค าปรกษาในเรองตาง ๆ รวมทงเปนก าลงใจทดเสมอมาขอบคณ หองสมดของวทยาลยเทคโนโลยอรรถวทยพณชยการทใหใชสถานทจดท าเอกสาร สดทายขอขอบคณเพอน ๆ ทชวยในการท าระบบฐานขอมล แกไขปญหาตางๆ และใหค าแนะน าตาง ๆ จนท าใหโครงการส าเรจลลวงไปไดดวยด

ค ำน ำ

การจดท าโครงการน เปนสวนหนงของวชาโครงการ รหสวชา 3204-8501 หลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ โดยคณะผจ ดท าไดจดท าโครงการประเภท เวบไวตขายเสอผามอสองออนไลนโดยมการสรางระบบเพอน าเสนอผลงานแกผทสนใจในการจดท าเวบไซต

เวบไซตททางคณะผจดท าไดจดท านน ประกอบไปดวยความรเกยวกบการจดสตอกสนคา การเชคเสอผา การคนหาเสอผา การเพม ลบ และบนทกสนคา โดยภายในเวบไซตจะประกอบไปดวยขอมลเสอผา คนหาสนคา เพมลบขอมล เพอใหเขาใจในระบบสตอกสนคา สวนประกอบตางๆภายในระบบ และสามารถใชคอมพวเตอรไดอยางมประสทธภาพสงสด รจกแกไขและปองกนภยคกคามทางคอมพวเตอรเบองตนไดอกดวย รวมถงยงสามารถน าความรทไดจากการศกษาไปประยกตใชในชวตประจ าวนหรอประกอบเปนอาชพรายไดเสรม หากโครงการนมขอผดพลาดประการใด ทางคณะผจ ดท า ขออภยไว ณ ทน และจะด าเนนการพฒนาผลงานทางดานคอมพวเตอรใหพฒนาใหดขนไป

คณะผจดท า

10 มกราคม 2562

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 2: Website E-commerce Second hand clothes

ชอโครงการภาษาไทย เสอผามอสอง ชอโครงการภาษาองกฤษ Second hand clothes โดย 1 นายรชกฤช วรภญโญภาส 2 นายภาสกร นชเทยน คณะกรรมการอนมตใหเอกสารโครงการฉบบนเปนสวนหนงของการศกษาวชาโครงการ ตามหลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทย พณชยการ (ATC)

( อาจารยนราภรณ บวนช )

อาจารยทปรกษา

( อาจารยศรพร สงบภย)

อาจารยทปรกษารวม

(อาจารยดฐประพจน สวรรณศาสตร)

หวหนาสาขาวชาคอมพวเตอรธรกจ

บทคดยอ หวขอโครงการ เสอผามอสอง Second hand clothes

ผจดท าโครงการ นายรชกฤช วรภญโญภาส นายภาสกร นชเทยน อาจารยทปรกษา อาจารยนราภรณ บวนช อาจารยทปรกษารวม อาจารยศรพร สงบภย สาขาวชา สาขาวชาคอมพวเตอรธรกจ สถาบน วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 --------------------------------------------------------------------------------------------------------------------------

บทคดยอ เวบไซตออนไลนทอ านวยความสะดวกในเรองของการซอขายเสอผาทมความสมพนธกบขอมลสนคาไดอยางงายดาย ชวยลดความยงยากทเกดขนของการจดสนคาทไมเปนระเบยง เพราะมเวบไซตขายของออนไลนทคอยอ านวยความสะดวกในดานการชมสนคา เวบไซตขายของออนไลนนจะชวยท าใหสามารถทจะดสนคาทเราตองการทสนใจหรอตองการจะซอโดยทไมตองไปดถงหนาราน โดยสามารถดสนคาไดทกอยางภายในเวบไซต โดยจะมระบบLoginซงจะมเพยงแอดมนของเวบไซตเทานนทจะสามารถเขาใชงาน ปรบปรง เพม-ลด แกไข ขอมลของสนคาไดเพอรกษาความปลอดภย ผเขาใชระบบจะสามารถเปดเขาใชงานเวบไซตเกยวกบสนคาเสอผามอสองเพอเปนประโยชนใหกบธรกจการคาและสรางความสะดวกในการตรวจสอบสนคาภายในราน เพอตอบสนองความตองการของผเขาใชเวบไซตทเราจดท าขน ทงนคณะผจดท าไดค านงถงความสามารถในการตอบสนองความตองการของผใช

กตตกรรมประกาศ

โครงการนส าเรจลลวงไดดวยความกรณาจากอาจารยนราภรณ บวนชอาจารยทปรกษาหลก และอาจารยศรพร สงบภย อาจารยทปรกษารวม ทไดใหค าเสนอแนะ แนวคด ตลอดจนแกไขขอบกพรองตาง ๆ มาโดยตลอด จนโครงการเลมนเสรจสมบรณ ผศกษาจงขอกราบขอบพระคณเปนอยางสง ขอกราบขอบพระคณ คณพอ คณแม และผปกครอง ทใหค าปรกษาในเรองตาง ๆ รวมทงเปนก าลงใจทดเสมอมาขอบคณ หองสมดของวทยาลยเทคโนโลยอรรถวทยพณชยการทใหใชสถานทจดท าเอกสาร สดทายขอขอบคณเพอน ๆ ทชวยในการท าระบบฐานขอมล แกไขปญหาตางๆ และใหค าแนะน าตาง ๆ จนท าใหโครงการส าเรจลลวงไปไดดวยด

ค ำน ำ

การจดท าโครงการน เปนสวนหนงของวชาโครงการ รหสวชา 3204-8501 หลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ โดยคณะผจ ดท าไดจดท าโครงการประเภท เวบไวตขายเสอผามอสองออนไลนโดยมการสรางระบบเพอน าเสนอผลงานแกผทสนใจในการจดท าเวบไซต

เวบไซตททางคณะผจดท าไดจดท านน ประกอบไปดวยความรเกยวกบการจดสตอกสนคา การเชคเสอผา การคนหาเสอผา การเพม ลบ และบนทกสนคา โดยภายในเวบไซตจะประกอบไปดวยขอมลเสอผา คนหาสนคา เพมลบขอมล เพอใหเขาใจในระบบสตอกสนคา สวนประกอบตางๆภายในระบบ และสามารถใชคอมพวเตอรไดอยางมประสทธภาพสงสด รจกแกไขและปองกนภยคกคามทางคอมพวเตอรเบองตนไดอกดวย รวมถงยงสามารถน าความรทไดจากการศกษาไปประยกตใชในชวตประจ าวนหรอประกอบเปนอาชพรายไดเสรม หากโครงการนมขอผดพลาดประการใด ทางคณะผจ ดท า ขออภยไว ณ ทน และจะด าเนนการพฒนาผลงานทางดานคอมพวเตอรใหพฒนาใหดขนไป

คณะผจดท า

10 มกราคม 2562

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 3: Website E-commerce Second hand clothes

บทคดยอ หวขอโครงการ เสอผามอสอง Second hand clothes

ผจดท าโครงการ นายรชกฤช วรภญโญภาส นายภาสกร นชเทยน อาจารยทปรกษา อาจารยนราภรณ บวนช อาจารยทปรกษารวม อาจารยศรพร สงบภย สาขาวชา สาขาวชาคอมพวเตอรธรกจ สถาบน วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 --------------------------------------------------------------------------------------------------------------------------

บทคดยอ เวบไซตออนไลนทอ านวยความสะดวกในเรองของการซอขายเสอผาทมความสมพนธกบขอมลสนคาไดอยางงายดาย ชวยลดความยงยากทเกดขนของการจดสนคาทไมเปนระเบยง เพราะมเวบไซตขายของออนไลนทคอยอ านวยความสะดวกในดานการชมสนคา เวบไซตขายของออนไลนนจะชวยท าใหสามารถทจะดสนคาทเราตองการทสนใจหรอตองการจะซอโดยทไมตองไปดถงหนาราน โดยสามารถดสนคาไดทกอยางภายในเวบไซต โดยจะมระบบLoginซงจะมเพยงแอดมนของเวบไซตเทานนทจะสามารถเขาใชงาน ปรบปรง เพม-ลด แกไข ขอมลของสนคาไดเพอรกษาความปลอดภย ผเขาใชระบบจะสามารถเปดเขาใชงานเวบไซตเกยวกบสนคาเสอผามอสองเพอเปนประโยชนใหกบธรกจการคาและสรางความสะดวกในการตรวจสอบสนคาภายในราน เพอตอบสนองความตองการของผเขาใชเวบไซตทเราจดท าขน ทงนคณะผจดท าไดค านงถงความสามารถในการตอบสนองความตองการของผใช

กตตกรรมประกาศ

โครงการนส าเรจลลวงไดดวยความกรณาจากอาจารยนราภรณ บวนชอาจารยทปรกษาหลก และอาจารยศรพร สงบภย อาจารยทปรกษารวม ทไดใหค าเสนอแนะ แนวคด ตลอดจนแกไขขอบกพรองตาง ๆ มาโดยตลอด จนโครงการเลมนเสรจสมบรณ ผศกษาจงขอกราบขอบพระคณเปนอยางสง ขอกราบขอบพระคณ คณพอ คณแม และผปกครอง ทใหค าปรกษาในเรองตาง ๆ รวมทงเปนก าลงใจทดเสมอมาขอบคณ หองสมดของวทยาลยเทคโนโลยอรรถวทยพณชยการทใหใชสถานทจดท าเอกสาร สดทายขอขอบคณเพอน ๆ ทชวยในการท าระบบฐานขอมล แกไขปญหาตางๆ และใหค าแนะน าตาง ๆ จนท าใหโครงการส าเรจลลวงไปไดดวยด

ค ำน ำ

การจดท าโครงการน เปนสวนหนงของวชาโครงการ รหสวชา 3204-8501 หลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ โดยคณะผจ ดท าไดจดท าโครงการประเภท เวบไวตขายเสอผามอสองออนไลนโดยมการสรางระบบเพอน าเสนอผลงานแกผทสนใจในการจดท าเวบไซต

เวบไซตททางคณะผจดท าไดจดท านน ประกอบไปดวยความรเกยวกบการจดสตอกสนคา การเชคเสอผา การคนหาเสอผา การเพม ลบ และบนทกสนคา โดยภายในเวบไซตจะประกอบไปดวยขอมลเสอผา คนหาสนคา เพมลบขอมล เพอใหเขาใจในระบบสตอกสนคา สวนประกอบตางๆภายในระบบ และสามารถใชคอมพวเตอรไดอยางมประสทธภาพสงสด รจกแกไขและปองกนภยคกคามทางคอมพวเตอรเบองตนไดอกดวย รวมถงยงสามารถน าความรทไดจากการศกษาไปประยกตใชในชวตประจ าวนหรอประกอบเปนอาชพรายไดเสรม หากโครงการนมขอผดพลาดประการใด ทางคณะผจ ดท า ขออภยไว ณ ทน และจะด าเนนการพฒนาผลงานทางดานคอมพวเตอรใหพฒนาใหดขนไป

คณะผจดท า

10 มกราคม 2562

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 4: Website E-commerce Second hand clothes

กตตกรรมประกาศ

โครงการนส าเรจลลวงไดดวยความกรณาจากอาจารยนราภรณ บวนชอาจารยทปรกษาหลก และอาจารยศรพร สงบภย อาจารยทปรกษารวม ทไดใหค าเสนอแนะ แนวคด ตลอดจนแกไขขอบกพรองตาง ๆ มาโดยตลอด จนโครงการเลมนเสรจสมบรณ ผศกษาจงขอกราบขอบพระคณเปนอยางสง ขอกราบขอบพระคณ คณพอ คณแม และผปกครอง ทใหค าปรกษาในเรองตาง ๆ รวมทงเปนก าลงใจทดเสมอมาขอบคณ หองสมดของวทยาลยเทคโนโลยอรรถวทยพณชยการทใหใชสถานทจดท าเอกสาร สดทายขอขอบคณเพอน ๆ ทชวยในการท าระบบฐานขอมล แกไขปญหาตางๆ และใหค าแนะน าตาง ๆ จนท าใหโครงการส าเรจลลวงไปไดดวยด

ค ำน ำ

การจดท าโครงการน เปนสวนหนงของวชาโครงการ รหสวชา 3204-8501 หลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ โดยคณะผจ ดท าไดจดท าโครงการประเภท เวบไวตขายเสอผามอสองออนไลนโดยมการสรางระบบเพอน าเสนอผลงานแกผทสนใจในการจดท าเวบไซต

เวบไซตททางคณะผจดท าไดจดท านน ประกอบไปดวยความรเกยวกบการจดสตอกสนคา การเชคเสอผา การคนหาเสอผา การเพม ลบ และบนทกสนคา โดยภายในเวบไซตจะประกอบไปดวยขอมลเสอผา คนหาสนคา เพมลบขอมล เพอใหเขาใจในระบบสตอกสนคา สวนประกอบตางๆภายในระบบ และสามารถใชคอมพวเตอรไดอยางมประสทธภาพสงสด รจกแกไขและปองกนภยคกคามทางคอมพวเตอรเบองตนไดอกดวย รวมถงยงสามารถน าความรทไดจากการศกษาไปประยกตใชในชวตประจ าวนหรอประกอบเปนอาชพรายไดเสรม หากโครงการนมขอผดพลาดประการใด ทางคณะผจ ดท า ขออภยไว ณ ทน และจะด าเนนการพฒนาผลงานทางดานคอมพวเตอรใหพฒนาใหดขนไป

คณะผจดท า

10 มกราคม 2562

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 5: Website E-commerce Second hand clothes

ค ำน ำ

การจดท าโครงการน เปนสวนหนงของวชาโครงการ รหสวชา 3204-8501 หลกสตรประกาศนยบตรวชาชพชนสง สาขาวชาคอมพวเตอรธรกจ โดยคณะผจ ดท าไดจดท าโครงการประเภท เวบไวตขายเสอผามอสองออนไลนโดยมการสรางระบบเพอน าเสนอผลงานแกผทสนใจในการจดท าเวบไซต

เวบไซตททางคณะผจดท าไดจดท านน ประกอบไปดวยความรเกยวกบการจดสตอกสนคา การเชคเสอผา การคนหาเสอผา การเพม ลบ และบนทกสนคา โดยภายในเวบไซตจะประกอบไปดวยขอมลเสอผา คนหาสนคา เพมลบขอมล เพอใหเขาใจในระบบสตอกสนคา สวนประกอบตางๆภายในระบบ และสามารถใชคอมพวเตอรไดอยางมประสทธภาพสงสด รจกแกไขและปองกนภยคกคามทางคอมพวเตอรเบองตนไดอกดวย รวมถงยงสามารถน าความรทไดจากการศกษาไปประยกตใชในชวตประจ าวนหรอประกอบเปนอาชพรายไดเสรม หากโครงการนมขอผดพลาดประการใด ทางคณะผจ ดท า ขออภยไว ณ ทน และจะด าเนนการพฒนาผลงานทางดานคอมพวเตอรใหพฒนาใหดขนไป

คณะผจดท า

10 มกราคม 2562

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 6: Website E-commerce Second hand clothes

สารบญ

หนา หนาอนมต ก บทคดยอ ข กตตกรรมประกาศ ค ค าน า ง สารบญ จ สารบญ (ตอ) ฉ สารบญรป ซ สารบญรป (ตอ) ฌ สารบญตาราง ฏ บทท 1 บทน า 11 ภมหลงและความเปนมา 1 12 วตถประสงคโครงการ 2 13 ขอบเขตการศกษา 2 14 ประโยชนทคาดวาจะไดรบ 2 15 แผนการด าเนนงาน 3 16 เครองมอทใช 4 17 งบประมาณในการด าเนนการ 4 บทท 2 ระบบงานและทฤษฎทเกยวของ 21 ระบบงานในปจจบน 5 22 ปญหาทเกดขนในระบบงานปจจบน 7 23 การวเคราะหตองการระบบใหม 7 24 ทฤษฎระบบงานทเกยวของ 8 25 โครงการทเกยวของ 32 บทท 3 การออกแบบงานดวยระบบคอมพวเตอร

31 การออกแบบระบบงาน 33 32 การออกแบบแผนภาพบรบท 36 33 การออกแบบแผนภาพความสมพนธของขอมล 42 34 พจนาณกรมขอมล 43

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 7: Website E-commerce Second hand clothes

สารบญ (ตอ) หนา

35 การออกแบบ Sitemap 45 36 การออกแบบ Story Board 46

บทท 4 การพฒนาระบบเวบไซตขายเสอผาออนไลน 41 เครองมอและอปกรณทใช 50 42 โปรแกรมทงหมดทใชพฒนา 50

43 วธการตดตงโปรแกรมโปรแกรม Appserv 2510 50 44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร 55 45 วธการใชงานเวบไซต 60

บทท 5 สรปการท าโครงการ 51 สรปผลการท าโครงการ 63 511 สรปขนาดของโปรแกรม 63 512 สรปขอผดพลาดทมตอการออกแบบระบบงาน 63 513 สรปขอผดพลาดทมในโปรแกรม 64 52 ปญหาและอปสรรคในการด าเนนงาน 64 53 สรปการด าเนนงานจรง(Gantt Chart) 65 55 สรปคาใชจายในการด าเนนงานจรง 66 บรรณานกรม 67 ภาคผนวก

- ใบขอเสนออนมตโครงการระบบคอมพวเตอร (ATC01) 68 - ใบขอเสนออาจารยทปรกษารวมโครงการ (ATC02) 69 - ใบขอสอบโครงการระบบคอมพวเตอรธรกจ (ATC03) 70 - ใบรายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) 71 - ใบบนทกการเขาพบทปรกษาโครงการ (ATC05) 72

ประวตผจดท าโครงการ 73

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 8: Website E-commerce Second hand clothes

สารบญรป หนา

รปท 21 Flow chart ระบบงานปจจบน 5 รปท 22 หนาตางโปรแกรม Adobe Photoshop CS 12 รปท 23 แสดง Tool Box 15รปท 24 แสดงระบบฐานขอมล 19 รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน 26 รปท 26 สพนฐานแมส 26

รปท 27 สเหลองแกมเขยว 27 รปท 28 สน าเงนแกมมวง 27รปท 29 สแดงแกมมวง 27 รปท 210 สแดงแกมสม 28 รปท 211 สเหลองแกมสม 28 รปท 212 สน าเงนแกมเขยว 28รปท 31 การออกแบบระบบงาน (Flowchart) 33 รปท 32 Flowchart การสมครสมาชก 34 รปท 33 Flowchart การเขาสระบบ 35 รปท 34 การออกแบบแผนภาพบรบท (Context Diagram) 36 รปท 35 Data Flow Diagram Level 1 37 รปท 36 Data Flow Diagram Level 1 Process 1 38

รปท 37 Data Flow Diagram Level 1 Process 2 39

รปท 38 Data Flow Diagram Level 1 Process 3 40

รปท 39 Data Flow Diagram Level 1Process 4 41

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง 42

รปท 311 การออกแบบ Site Map 45

รปท 312 หนาหลกของเวบไซต 46

รปท 313 หนาสงซอสนคา 46

รปท 314 การเลอกซอสนคาใสตระกรา 47

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 9: Website E-commerce Second hand clothes

สารบญรป (ตอ) หนา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE 47 รปท 316 วธการตดตอผขาย 48 รปท 317 หนาผจดท า 48 รปท 318 หนาผจดท า 49

รปท 41 double click ทตวโปรแกรม appserv 2510 51 รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป 51 รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร 52 รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next 52 รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next 53 รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร 53 รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server 54 รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท 54 รปท 49 AppServ จะถกตดตงไวทโฟลเดอร CAppServ 55 รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin 55รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo 56รปท 412 กด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย 56รปท 413 ปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb 57รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo 57 รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv 58รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม 59 รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www 59รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp 60 รปท 420 แสดงหนาจอรปท 2 หนาหลก 60 รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา 61 รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า 61 รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin 62รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก 62

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 10: Website E-commerce Second hand clothes

สารบญตาราง หนา

ตารางท 11 แผนการด าเนนงาน (Gantt Chart) 3 ตารางท 12 งบประมาณการด าเนนงาน 4 ตารางท 21 แสดงสญลกษณระบบกระแสขอมล 10 ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล 11 ตารางท 23 ความรสกของส 30 ตารางท 31 ตารางขอมลสมาชก 43 ตารางท 32 ตารางขอมลการสงซอ 43 ตารางท 33 ตารางขอมลรายละเอยดสงซอ 44 ตารางท 34 ตารางขอมลสนคา 44 ตารางท 35 ตารางขอมลประเภทสนคา 44 ตารางท 51 แสดงขนาดของโปรแกรม 63 ตารางท 52 สรปเวลาการด าเนนงานจรง 65 ตารางท 53 สรปคาใชจายในการด าเนนงานจรง 66

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 11: Website E-commerce Second hand clothes

บทท 1 บทน ำ

11 ภมหลงและควำมเปนมำ

ปจจบนกระเเสคนไทยไดหนมาสนใจเสอผามอสองกนมากขนเนองมาจากราคาประหยดคณภาพดเเละอาจไดของดยหอดงตดไมตดมอมาในราคาสบายกระเปา จากขอมลศนยวจยกสกรไทย ไดใหขอมลไววา คาใชจายในการซอเสอผาคนไทย1คนจะอยท 440 บาทเดอน เเละรวมมลคาตลาดเสอผาส าเรจรปตอปในไทยสงถง 84000 บาทป จะเหนไดชดเจนวาเเมวาเศรษฐกจจะไมดเเต1ในปจจย4นนกคอเสอผาทไมมวนตกกระเเสเพราะยงเปนสงส าคญทยงตองการอยตลอด ตรงจดนเองจงท าใหตลาดเสอผาเตบโตไดเรอยๆโดยเฉพาะเสอผามอสองทมความตางกบเสอผามอ1ตรงทไมมความซ ากนมเเคตวเดยวเเบบเดยวหมดเเลวหมดเลยเเละนกคอเสนหอกเเบบของเสอผามอสองเเตถาเปรยบเทยบกบเสอผามอ1กจะเหนตางไดอยางชดเจนตรงทมการอปเดททนกระเเสอยตลอดเวลาเเตกตองเเลกมากบการขายใหทนกระเเสเทรนดเสอผาขายไมทนกตองเอามาลดราคาเขาเนอ

การเปดรานคาขายเสอผามอสองนนกไมไดยาก ใชโซเชยลเนตเวรคใหเปนประโยชน อกอยางในโลกโซเชยลนนมคนอยพลกพลานตลอดเวลาอยแลวโดยเฉพาะใน Facebook จะมหนาเพจใหสามารถเปดเปนรานขายของไดเลย วธอพโหลดภาพลงกงายๆเหมอนการเลนเฟสบคธรรมดาทวไป เปนการเรมตนลงมอท าอาชพเสรมขายเสอผาไปทละนอย เมอลงรปสนคา ลงรายละเอยดราคา ไซด สภาพ ต าหน ตางๆใหละเอยดเพอลกคาจะไดรบขอมลอยางครบถวน การขายเสอผามอสองออนไลน เปนอาชพเสรม ตอนเรยนไดเปนอยางด โดยเฉพาะวยรนเสอผาทมกต ๆ กเตมไปหมดแตไมใสเพราะวาเปนเสอทเกาแลวใสบอยจนเบอแตไมรวาจะเอาไปท าอะไรดจะน าไปขายตอทตลาดกไมมเวลาขนาดนนหรอจะเอาไปบรจาคกไมมเวลาเหมอนกน เปลยนวธคดเอามาเปนอาชพเสรมเพอใหเกดรายไดแบบงายๆจะดกวา ในเมอน าไปขายทตลาดไมไดกขายทบาน โดยการเปดรานคาออนไลนขายเสอผามอสองในอนเตอรเนตเปนอาชพเสรมไดด แถมยงขายดอกดวยบางคนขายดมากๆรานเปนทรจกอยางกวางขวางในอนเตอรเนตกเปลยนจากการท าแคอาชพเสรมมาเปนอาชพหลกเลยกมเพราะวางานนเปนอาชพอสระ ไมตองมเจานายไมตองมเวลาท างานจะท างานตอนไหนกยอมได

ทางคณะผจดท าจงไดศกษาพฒนาเวบไซตขายสนคาออนไลนประเภท ธรกจขายสนคาออนไลนเสอผามอสอง เพอตอบสนองตอความตองการของผทสนใจสงซอสนคาออนไลน

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 12: Website E-commerce Second hand clothes

2

12 วตถประสงคโครงกำร

1 เพอพฒนาเวบไซตทางดานขายสนคาออนไลนเกยวกบ เสอผามอสอง 2 เพอใหผทสนใจสนคา สามารถเลอกซอสนคาผานระบบออนไลนได 3 เพอพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน 4 เพอพฒนาเวบไซตการเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

13 ขอบเขตกำรศกษำ

1 มระบบสมครสมาชก 2 มขอมลสนคาและราคาอยางชดเจน 3 มการค านวณราคาสนคาใหผใชงาน 4 มการออกแบบหนาเวบไซต 5 สามารถใหผเขาใชเขาลอกอนระบบได

14 ประโยชนทคำดวำจะไดรบ

1 ไดเวบไซตทางดานการขายสนคาเกยวกบ ขายเสอผามอสอง 2 ไดผทสนใจเขามาชมเวบไซตของเราผานทางระบบอนเทอรเนต 3 ไดความรและวการด าเนนงานการท าเวบไซต เพอใชในชวตประจ าวน 4 ไดเวบไซตทสามารถเขยนโปรแกรมเชอมตอฐานขอมลดวยภาษา PHP

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 13: Website E-commerce Second hand clothes

3

15 แผนกำรด ำเนนงำน

ตำรำงท 11 แผนการด าเนนงาน (Gantt Chart)

รำยกำร ภำคเรยนท 1 มถนำยน 61 กรกฎำคม 61 สงหำคม 61 กนยำยน 61

ระยะเวลำ 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

27-28 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1+ลงทะเบยนออนไลน)

29 มถนายน -3 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

5 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 6 กรกฎาคม 61 ประกาศผลหวขอโครงการ รอบท 2

9 กรกฎาคม 61

สงบทท 2 18-25 กรกฎาคม 61

สงบทท 3 1-17 สงหาคม 61

สอบหวขอโครงการ (รอบเอกสาร)

20-24 สงหาคม 61

ประกาศผลสอบ 29 สงหาคม 61

สงความคบหนาโปรแกรม 50

10-16 กนยายน 61

สงความคบหนาโปรแกรม 60

17-23 กนยายน 61

สงความคบหนาโปรแกรม 70

24-30 กนยายน 61

รำยกำร ภำคเรยนท 2 พฤศจกำยน 61 ธนวำคม 61 มกรำคม 62 กมภำพนธ 62 ระยะเวลำ

1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 สงความคบหนา 90 2 พฤศจกายน 2561

สงความคบหนา 100 9 พฤศจกายน 2561

สอบโปรแกรม ระดบปวส2 10 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3 24 พฤศจกายน 2561

สงบทท 4 11-21 ธนวาคม 61

สงบทท 5 14-26 มกราคม 62

สงรปเลม ซด และคาเขาเลม 27 มกราคม ndash 3 กมภาพนธ 2562

4

16 เครองมอทใช

1 โปรแกรม Adobe Dreamweaver CS6 ใชในการสรางเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการออกแบบเวบไซตและตกแตงรปภาพ 3 ภาษา PHP ใชในการสรางเวบไซต 17 งบประมำณกำรด ำเนนงำน

ล ำดบ รำยกำร จ ำนวน รำคำ

1 Flash Drive รน Kingston 1 150 2 หมกพมพ 1 280

3 กระดำษ 1 400 4 คำเยบเลม 1 250

รวมเปนเงน 830

ตำรำงท 12 งบประมาณการด าเนนงาน

บทท 2

ระบบงานและทฤษฎทเกยวของ

21 ระบบงานปจจบน

รปท 21 Flow chart ระบบงานปจจบน

6

ในโลกปจจบนมความกาวหนาทางดานเทคโนโลยไปไกลมากท งดาน การคมนาคม และดานการตดตอสอสาร Internet จงเขามามสวนส าคญในการด ารงชวตประจ าวน ไมวาจะเปนการตดตอสอสารทางธรกจ Social Network รวมไปถงการตดตอซอขายสนคาผานทางเวบไซตตางๆ การซอขายปจจบนผซอบางกลมมความตองการสนคาทหาไดยาก หรอสนคาทมาจากตางประเทศ จงใหยากตอการซอสนคา และสนคาบางชนดกเปนสนคาทยงไมไดรบความนยมทางทองตลาด จงท าใหการซอขายทางทองตลาดนนหาไดยาก หรอในบางกรณสนคาทตองการอยไกลจากทอยอาศยจากผซอท าใหการคมนาคมเปนไปไดยาก จงท าใหการซอขายสนคาผานเวบไซต หรอระบบ E-Commerce เขามาชวยเปนตวเลอกในการซอขายสนคา โดย E-Commerce มชอทแปลเปนภาษาไทยวา ldquoพาณชยอเลกทรอนกสrdquo โดยความหมายของค าวาพาณชยอเลกทรอนกส มผใหค านยามไวเปนจ านวนมาก แตไมมค าจ ากดความใดทใชเปนค าอธบายไวอยางเปนทางการ ในภาครวมนน E-Commerce ในทรจกกนทวไป คอการซอขายสนคาผานเวบไซต ทก าลงไดรบความนยมเปนอยางมาก แตกมชองโหวมากมายในการซอขาย ผานเวบไซต ยกตวอยางเชน การโกงลกคา โดยผขายใหผซอโอนเงนผานทางธนาคารเขาบญชกอนไดรบสนคา จากนนผขายกไมท าการสงสนคาใหลกคาตามทก าหนดไว ท าให ลกคาสวนใหญไมคอยไววางใจทจะท าการซอขาย ผานเวบไซต จงตองมระบบการกระท าทท าใหลกคาไววางใจในการซอขาย เชน สามารถเชคประวตของผขาย สามารถตดตอผขายไดโดยตรง โดยมเบอรโทรศพทและทอยจรงตามบตรประชาชนก ากบ มการออกใบเสรจ ใบซอขาย และใบสงของ เปนหลกฐานแกลกคาเพอความมนใจของลกคาในการซอขาย การขายสนคาผานเวบไซตคอ การท าใหลกคามนใจ และไววางใจผขายสนคามากทสด คณะผจดท าจงไดจดท าระบบขายสนคาออนไลน ทมระบบการขายทมาตรฐาน ตรวจสอบไดทกขนตอนในการท างานมการออกใบเสรจยนยนในการซอสนคาใหแกลกลกคาผานทาง E-mail มระบบสมาชกทจะท าใหลกคาไดรบสทธประโยชนตาง ๆ มการสง SMS เขาโทรศพทมอถอ ของผ ซอเมอโอนเงนเขาบญชโดยอตโนมต หากผซอตองการทจะสอบถามรายละเอยดสนคาแกผขาย กสามารถท าการสอบถามไดทนทผานหนา Chat ในระบบของเราตลอดระยะเวลาในการท างานทก าหนดไว หากนอกเวลางาน สามารถฝากขอความไวหรอ โทรมาสอบถามไดตลอด 24 ชวโมง จงท าใหลกคามนใจไดวาจะไดรบสนคาอยางแนนอน

7

22 ปญหาทเกดขนในระบบงานปจจบน 1 ความไมปลอดภยของขอมลขาดการตรวจสอบการใชบตรเครดตบนอนเทอรเนตขอมลบน

บตรเครดตอาจถกดกฟงหรออานเพอเอาชอและหมายเลขบตรเครดตไปใชโดยทเจาของบตรเครดตไมรไดการสงขอมลจงตองมรการพฒนาวธการเขารหสทซบซอนหลายขนตอนเพอใหขอมลของลกคาไดรบความปลอดภยสงสด

2 E-Commerce ยงมประเดนเชงนโยบายทท าใหรฐบาลตองเขามาก าหนดมาตรการเพอใหความคมครองกบผซอและผขายขณะเดยวกนมาตรการมนเรองระเบยบทจะก าหนดขนตองไมขดขวางการพฒนาเทคโนโลย

3 การทผขายไมมนใจวาลกคามตวตนอยจรง จะเปนบคคลเดยวกบทแจงสงซอสนคาหรอไมมความสามารถในการทจะจายสนคาและบรการ

4 ผซอไมมนใจเรองการเกบรกษาความลบทางธรกจ ขอมลสวนบคคลเชน ไมมนใจวาจะมผน าหมายเลขบตรเครดตไปใชประโยชนในทางทมชอบ

23 การวเคราะหความตองการระบบใหม 1 มการใสรหสประจ าตวประชาชนของผสมครและของเจาของบตรเครดต เพอใหไมเกด

ความเสยงในการใชบตรเครดต ทถกขโมยมาเพอการซอสนคา 2 มการศกษากฎระเบยบและขอบงคบของรฐบาล เพอไมใหเกดปญหาในภายหลง และยงใช

เทคโนโลยใหม ๆ ทมขนอยเรอย เพอใหเปนการพฒนาระบบและไมขดขวางการพฒนาของเทคโนโลย

3 ในขนตอนการซอสนคา จ าเปนตองใหลกคาท าการโอนเงนเขาบญชกอนทจะจดท าการสงสนคาใหลกคา แลวการสงซอสนคาจ าเปนตองใหมการ Login เขาสระบบของเรากอนถงจะสามารถซอสนคา สงซอสนคาได นนท าใหมนใจไดวาลกคาคนไหนเปนคนสงสนคา เพราะลกคาไดมการ Login ในระบบแลวนนเอง

4 มการปองกนการเขาถงของระบบเพอไมใหใครเขามาน าขอมลสวนตวของลกคาออกไปได และทางผดแลไมมการกระท าแบบนนได

8

24 ทฤษฎและระบบงานทเกยวของ การพฒนาระบบอนเทอรเนตใหสามารถซอขายสนคาผานทางเวบไซตทเรยกวาldquoการคาอเลกทรอนกสหรออคอมเมรซ (E-Commerce) ซงชวยลดขนตอนและความยงยากเกยวกบการซอขายสนคาไดอยางยอดเยยม ระบบอคอมเมรซไดเขามาแทนทวธการซอขายสนคาในรปแบบเกา ๆ ภายในระยะเวลาอนรวดเรว ในขณะเดยวกนบรษทผพฒนาซอฟตแวรกเรงพฒนาซอฟตแวรใหมความสามารถในการสรางเวบไซต รวมทงสรางระบบอคอมเมรซใหงายตอการใชงานมากขนลกษณะขนตอนการสงซอสนคาจากเวบไซตทพบเหนทวไปนนจะมรปแบบและวธการเดยวกน โดยสามารถแยกออกไดเปน 2 สวนหลกคอ - เวบเพจหนาราน (Store Front) คอ หนาเวบเพจส าหรบใชในการสงซอสนคาหรอบรการตางๆ จากรานคา - เวบเพจหลงราน (Back Office) คอเวบเพจทใชเฉพาะบคลากรของรานคาซงผใชงานภายนอกไมสามารถเขามาในสวนนได ประโยชนเพอก าหนดรายละเอยดตางทเกยวกบตวสนคาหนาเวบรานคา ระบบพาณชยอเลกทรอนกสไมไดหยดอยแคนนตอมาไดมการพฒนาระบบตาง ๆ ขนมากมายทน ามาใชทางธรกรรมตางๆ รวมทงการขายสนคาออนไลนซงในปจจบนไดมการพฒนาระบบหรอโปรแกรมทเขามาชวยในการสนบสนนการขายสนคาใหมประสทธภาพมากขน ปจจบนมการท าธรกจผานระบบเครอขายอนเทอรเนตเกดขนมากมายโดยมรปแบบตาง ๆ ดงน 1 การประกาศซอขายเปนรปแบบเวบไซต E-Commerce ทเปดโอกาสใหผทสนใจประกาศความตองการซอขายสนคาของตนไดภายในเวบไซตโดยเวบไซตจะท าหนาทเหมอนกระดานขาวและตวกลางในการแสดงขอมลสนคาตางๆ และหากมคนสนใจสนคาทประกาศไวกสามารถตดตอตรงไปยงผประกาศไดทนทจากขอมลทประกาศอยภายในเวบไซต 2 เวบไซตแคทตาลอกสนคาออนไลนเปนเวบไซตทมรายละเอยดแสดงขอมลสนคารปภาพและรายละเอยดตางๆรวมทงขอมลการตดตอในกรณทสนใจจะซอสนคาแตจะไมมระบบการช าระเงนหรอสงซอสนคา 3 รานคาออนไลนเปนเวบไซต E-Commerce ทมทงระบบการจดการสนคาระบบตะกราสนคาShopping Cart ระบบการช าระเงนรวมถงการขนสงสนคาครบสมบรณแบบท าใหผ ซอสามารถสงซอสนคาท าการช าระเงนผานเวบไซตไดทนท 4 การประมลสนคาเปนเวบไซต E-Commerce ทมรปแบบของการน าสนคาไปประมลขายกนโดยจะเปนการแขงขนใน การเสนอราคาสนคาหากผใดเสนอราคาสนคาไดสงสดในชวงเวลาทก าหนดกจะชนะการประมลและสามารถซอสนคาชนนนไปได ดวยราคาทไดก าหนดไวโดยสวนใหญสนคาทน ามาประมล หากเปนสนคาใหม

9

ประวตความเปนมาของอนเทอรเนต (Internet) อนเทอรเนตเปนเครอขายคอมพวเตอร ทกอตงขนโดยกระทรวงกลาโหมของประเทศสหรฐอเมรกา ซงเปนการน าคอมพวเตอรมาเชอมตอกน มชอเรยกสมยน นวาldquoอารปาเนตrdquoการเชอมตอคอมพวเตอรจ านวนมากเขาดวยกน กอใหเกดการแลกเปลยนและการสอสารทเปนประโยชนอยางมหาศาล สงผลใหอารปาเนตเตบโตอยางรวดเรว เพราะมองคกรทางทหารและมหาวทยาลย น าเครองคอมพวเตอรเชอมตอกบเครอขายเปนจ านวนมาก ในป พศ2532 มเครองคอมพวเตอรเชอมตอกบเครอขายมากกวา10000เครองทวโลก และเครอขายนไดถกขนานนามใหมวาldquoอนเทอรเนตrdquo การสอสารขอมลบนอนเทอรเนตจะมขอก าหนดทเปนมาตรฐาน หรอทเรยกวา ldquoโพรโทคอล (Protocol)rdquoโดยพนฐานของการสอสารขอมลอนเทอรเนตจะใชโครงสรางแบบTCPIPยอมาจากldquoTransmission Control ProtocolInternet Protocolrdquo (TCPIP Model) ซงเปนมาตรฐานทวาดวยการก าหนดวธการตดตอสอสารระหวางคอมพวเตอร ท าใหคอมพวเตอรภายในระบบเครอขายอนเทอรเนต สามารถเชอมตอเขาหากน และตดตอสอสารแลกเปลยนขอมลกนได ความรเกยวกบการวเคราะหและออกแบบระบบการวเคราะหระบบ (Systems Analysis) คอ การศกษาขนตอนตางๆ ของการท างานและปญหาในระบบงานหนงๆ และคนหาแนวทางแกไข (Solutions) วางโครงสรางรปแบบของระบบงาน (Design) เพอน ามาพฒนาใหระบบงานทวเคราะหและออกแบบมประสทธภาพในแงการปฏบตมากทสด สวนการออกแบบระบบกคอ การน าเอาความตองการของระบบมาเปนแบบแผนหรอเรยกวาพมพเขยวโมเดลทใชส าหรบการพฒนาระบบ รปแบบของภาพ เชน ไดอะแกรม (Diagram) หรอ แผนภม (Chart) ดงน

10

สญลกษณระบบกระแสขอมล

ตารางท 21 แสดงสญลกษณระบบกระแสขอมล

แผนภาพแสดงการไหลกระแสของขอมล (Data Flow Diagram DFD) Data Flow Diagramเปนเครองมอของนกวเคราะหระบบทชวยใหสามารถเขาใจกระบวนการท างานของแตละหนวยงานซงทราบถงการรบสงขอมลการประสานงานระหวางกจกรรมตางๆ ในการด าเนนงานซงเปนแบบจ าลองของระบบแสดงถงการไหลของขอมลทง INPUT และ OUTPUTระหวางระบบกบแหลงก าเนดรวมทงปลายทางของการสงขอมลซงอาจเปนแผนก บคคล หรอระบบอนโดยขนอยกบระบบงานและการท างานประสานงานภายในระบบนนนอกจากนยงชวยใหรถงความตองการขอมลและขอบกพรอง(ปญหา)ในระบบงานเดมเพอใชในการออกแบบการปฏบตงานในระบบใหม Data Flow Diagram (DFD) เปนภาพแสดงการเปลยนแปลงขอมลในขณะไหลผานกระบวนการท างานตาง ๆของระบบสารสนเทศDFDจงเปนโครงสรางของระบบงานสารสนเทศทสอเขาใจในการท างานของระบบงานในรปแบบของความสมพนธระหวางกระแสขอมลและโปรเซส DFDภายใน DFD ท าใหเราเขาใจสวนประกอบของงาน เขาใจการใชขอมลในแตละโปรเซส และขอมลทเปนผลจากการท างานโปรเซสโดยโครงสรางจะเรมจากระดบสงสดซงจะแสดงสวนทอยภายนอกระบบ สวนนส าคญเพราะวาเปนสวนทบอกวาระบบนน ๆ ไดรบขอมลมาจากทใด และผลลพธตาง ๆ ทใด และผลลพธตาง ๆ ถกสงไปทใดบาง DFD ในระดบลกลงไปจะไมแสดงสงทอยนอกระบบ คอ ไมมสงนเปนสวนประกอบโดยปกต จะวางแหลงทมาของขอมลไวทางซายมอของ DFD และ

สญลกษณ ( Symbol ) ความหมาย ( Symbol Name )

Source Destination สญลกษณสงทอยภายนอกระบบ

Process สญลกษณการประมวลผล

Data Store สญลกษณการเกบขอมล

Data Flow สญลกษณเสนทางการไหลของขอมล

11

สวนภายนอกทรบผลลพธของระบบจะอยทางขวามอ ทงนเพอใหอยในรปแบบของกระแสขอมลจากซายไปขวา แตหลาย ๆ กรณน เราจะวางขอมลและผลลพธไวในทเหมาะสมซงอาจจะอยเหนอโปรเซสหรอใตโปรเซสกได DFD ระดบรองลงมา (Low-Level Data Flow Diagram) คอสวนทแสดงระบบยอยลงมาจาก DFD ทกลาวมาหรอเรยกวาระดบแมเมอระดบแมไมสามารถแสดงรายละเอยดทงหมดไดเปนตองแตก Level ยอยออกมาเพอแสดงการประมวลผลนนตามขนตอนการท างานใหชดเจนยงขน สญลกษณในการออกแบบระบบฐานขอมล

สญลกษณ ชอเรยก ความหมาย

Entity องคประกอบมลฐาน

Weak entity

เอนทต ทไมม attribute เปนของตนเอง

Relationship ความสมพนธ

Identifying relationship

ความสมพนธทเกยวพนธเพอผานไปยง owner (ใชกบ weak entity)

Attribute คณสมบตเฉพาะของเอนทต

Key attribute

Attribute ของ เอน ท ต ท ค าข อง Attribute ไมเทากน

Multi-valued attribute

Attribute ของเอนทตหนงมคาไดมากกวา 1 คา

Derived attribute

Attribute ทสมารถค านวณหาคาไดจาก Attribute อน

Composite attribute

Attribute ท ส าม า ร ถ แ บ ง แ ย กออกเปน attribute ยอยได

ตารางท 22 แสดงสญลกษณในการออกแบบระบบฐานขอมล

12

ทฤษฎการใชโปรแกรม 1 โปรแกรม Adobe Photoshop CS5

เครองมอใน Photoshop CS5 จะแตกตางจาก CS3 และ CS4 ไปบางเลกนอย กลาวคอ โดยพนฐานจะคงเดม แตจะปรบการใชงานใหดงายขน มการเกบรวบรวมเครองมอทเกยวของเอาไว ทเดยวกน เพมชดเครองมอเขามาใหม และลดขนตอนการท างานใหนอยลง ท าใหใชงานสะดวกยงขน ในเวอรชนนไดเพมค าสง และแถบเครองมอทใชบอย ๆ วางแยกออกมาจากกลมเครองมอเดม เชน เครองมอปรบมมมอง เครองมอปรบแตงภาพทรวมอยในพาเนลเดยวกน เชน พาเนล Adjustments สวนการท างานหลก ๆ ยงคงองการใชงานเหมอนเวอรชนทผานๆ มา ซงหนาจอใหมของPhotoshop CS5 มสวนประกอบ ดงภาพ

รปท 22 หนาตางโปรแกรม Adobe Photoshop CS5

รายละเอยดสวนประกอบของโปรแกรม Photoshop CS5 1 Application Bar (แอพพลเคชนบาร) จะเปนแถบเครองมอทเกบปมค าสงทใชงานบอย ๆ

เอาไว เชนเปดโปรแกรมBridgeหมนพนทท างานยอขยายภาพ จดเรยงวนโดวภาพและจดองคประกอบของเครองมอตามพนทใชงาน (Workspace)

2 Menu Bar (เมนบาร) ประกอบดวยกลมค าสงตางๆทใชจดการกบไฟล ท างานกบรปภาพและใชการปรบแตงการท างานของโปรแกรมโดยแบงเมนตามลกษณะงานนอกจากนบางเมนหลกจะมเมนยอยซอนอย โดยสงเกตจากเครองหมาย ซงคณตองเปดเขาไปเพอเลอกค าสงภายในอกท

13

3 Workspace Menu (เวรคสเปซเมน) หรอพนทการท างานเปนการก าหนดรปแบบการแสดงเครองมอและพาเนลทมความเกยวของกบงานทท าการเลอกWorkspaceทเหมาะสมจะท าใหสามารถเลอกใชเครองมอไดอยางรวดเรว ใน Photoshop CS5 ม Workspace ใหเลอกใช 7 แบบ คอ

- EssentialsเปนWorkspaceพนฐานทเหมาะกบการท างานทกรปแบบเนองจากมพาเนลทครอบคลมงานทวไปใหใชงาน

- Design เปน Workspace ทเหมาะกบการออกแบบงานกราฟก โดยมพาเนล Swatches และCharacter เพมเขามาเพอใชในการออกแบบ

- Painting เปน Workspace ส าหรบการท างานดานวาดภาพ และระบาย ซงสามารถใชรวมกบ Tablet ไดเปนอยางด

- Photography เปน Workspace ส าหรบดานภาพถายโดยเฉพาะ แตจะเนนดานโทนความสวาง แสงเงา และสสนของภาพเปนหลก

- 3 D และ Motion เปน Workspace ทมอยเฉพาะในเวอรชน Extended ซงเนนการท างาน 3D และการสรางภาพเคลอนไหว (Animation)

- New in CS5 เปน Workspace ทแสดงเฉพาะเครองมอและค าสงใหม ๆ ในเวอรชน CS5 เหมาะแกการศกษาฟเจอรใหมของโปรแกรม

4 Option Bar (ออปชนบาร) เปนสวนทใชปรบแตงคาการท างานของเครองมอตางๆโดยรายละเอยดในออปชนบารจะเปลยนไปตามเครองมอทเราเลอกจากทลบอกซในขณะนนเชนเมอเราเลอกเครองมอBrush (พกน) บนออปชนบารจะปรากฏออปชนทใชในการก าหนดขนาด และลกษณะ หวแปรง โหมดในการระบายความโปรงใสของส และอตราการไหลของส เปนตน

5 Tool Panel (ทลพาเนล) หรอ กลองเครองมอ จะประกอบไปดวยเครองมอตาง ๆ ทใชในการวาด ตกแตง และแกไขภาพ เครองมอเหลานมจ านวนมาก ดงนนจงมการรวมเครองมอทท าหนาทคลาย ๆ กนไวในปมเดยวกน โดยจะมลกษณะรปสามเหลยมอยบรเวณมมดานลางดงภาพ เพอบอกใหรวาในปมนยงมเครองมออนอยดวย

6 Panel ( พาเนล ) เปนวนโดวยอยๆ ทใชเลอกรายละเอยด หรอค าสงควบคมการท างานตางๆ ของโปรแกรม ใน Photoshop มพาเนลอยเปนจ านวนมาก เชน พาเนล Color ใชส าหรบเลอกส พาเนลInf oใชแสดงคาสตรงต าแหนงทชเมาสรวมถงขนาดต าแหนงของพนททเลอกไวPhotoshopเปนโปรแกรมในชด Creative Suite 5หรอเรยกส นๆวาCS5ซงใชส าหรบสรางและตกแตงภาพกราฟกซงมประสทธภาพและมชอเสยงมากโปรแกรมหนงดวยความสามารถทหลากหลายทงการสรางภาพใหมและตกแตงภาพดวยเครองมอและเทคนคพเศษตางๆจงท าใหPhotoshopเปนโปรแกรมส าคญทจ าเปนตองมตดตงใชงานในเครองคอมพวเตอรของผใชงานสวนหญในทนขอกลาวถง Photoshop ทไดผานการพฒนามาจนถงเวอรชนท 12 ซงมชอเรยกอยางเปนทางการวา Adobe Photoshop CS5 โดยในเวอรชนนจะแบงออกเปน 2เวอรชนยอยคอ Photoshop CS5 และ

14

Photoshop CS5Extended ซงทง 2 เวอรชนนมความสามารถแตกตางกนออกไปPhotoshop CS5 เปนเวอรชนแบบธรรมดาทเนนการท างานดานการตกแตงตดตอภาพถายเปนเวอรชนทนยมใชกนอยางแพ รหลายเพราะม ฟ งกชนก ารท างาน พนฐาน ทครบถวนPhotoshopCS5Extendedไดเพ มความสามารถนอกเหนอจากการตกแตงและการตดตอคอการท างานดาน 3D (3 มต) ใหรปทรงมแสงเงาสมจรง สรางภาพเคลอนไหวดวย Timeline แต Photoshop CS5ไมวาจะเวอรชนธรรมดาหรอเวอรชนExtendedถกออกแบบใหมความสามารถเพมมากขนและออกแบบเครองมอใหเรยกใชไดสะดวกขนซงสามารถน ามาใชในการออกแบบชนงานดานตางๆดงน 1 สอสงพมพไมวาจะเปนนตยสารวารสารหนงสอแผนพบและโบชวร 2 งานกราฟกโฆษณาสนคาทางโทรทศน 3 งานน าเสนอ (Presentation) และตกแตงภาพส าหรบภาพยนตรและมเดยทวไป 4 ออกแบบกราฟกส าหรบเวบไซต

15

Toolbox คอ ชดเครองมอทใชงานกบงานของเราจะถกจดอยในสวนทแยกออกมาตางหากถาหากไม

มเปดการใชงานท MenugtWindowgtTool ใชงานรวมกบ Menu Tools Option Bar จะเปนสวนปรบแตงในรายละเอยดตางๆของเครองมอทเลอกใช Toolsบางอนมรปภาพสามเหลยมอนเลกๆอยดานลางขวา เมอเรากดเมาสคางหรอคลกขวาบนปมนน จะมเครองมอ ทถกจดใหอยในกลมเดยวกนออกมา เครองมอในTool Box

รปท 23 แสดง Tool Box

1 Marquee Tool เปนการเลอกแบบสเหลยมผนผา วงกลม แถวขนาด 1 พกเซลส หรอ

คอลมน 1 พกเซลส 2 Lasso Tool จะใชเพอสราง Selection แบบอสระ แบบ Polygonal (ตามจดทคลก) และ

Magnetic (ดงเขาหาขอบรปภาพ) 3 Slice Tool ใชในการสราง Slice และ Slice Selection Tool ใชเลอก Slice ทคณสรางขนมา 4 Healing Brush Tool ใชในการระบายส เพอซอมแซมรปภาพใหสมบรณแบบ 5 Clone Stamp Tool ใชกอปปรปโดยอาศยรปภาพตนฉบบและ Pattern Stamp Tool ใชเพอ

วาดรปโดยใชบางสวนของรปภาพทมอยเปนตนฉบบ

1 2

3

4 5 6 7 8 9

10 11

12 13

14 15 16 17 18 19 20 21 22

23

24

16

6 Eraser Tool ใชลบรปภาพหรอลบบางสวนของพกเซลสและท าการเกบสวนตางๆ เปน State ตางๆ ใน History Palette

7 Blur Tool เปนอปกรณทใชส าหรบปรบคา ความคมชดของสภาพ ซงจะประกอบดวย Blur Sharpen เลอกโดยการคลกเมาคางใว

8 Pen ใชในการสรางเสนภาพส า หรบวาดภาพซงจะสรางเสนตรงกอนแลวดดให โคงตามตองการ 9 Path Selection Tool ใชเพอเลอก Shape หรอ Path เพอแสดง Anchor Paint Direction Line

และ Direction Paint 10 3D Rotate tool ใชหมนวตถตามแกน X ไดรอบดาน 360 องศา 11 Hand tool เปนเครองมอใชเลอนดสวนตาง ๆ ของภาพ 12 Move tool ใชในการยายวตถ 13 Quick Selection Tool เปนเครองมอทใชเลอกขอบเขตวตถ 14 Eyedropper Tool ใชในการดดสจากรปภาพเพอใชเปนตนแบบของสกบงานชนอนๆ 15 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 16 History Brush Tool ใชกลบคนรปภาพเดมจาก State หรอ Snapshot ของรปเดยวกน 17 Gradient Tools ใชเพอไลสระหวางสหลายๆ ส ในแบบตางๆ Straight-line Radial Angle

Reflected และ Diamond 18 Burn Tool ใชลดความสวางท าใหรปภาพดมดลง 19 Type Mask Tool ใชสราง Selection เปนรปรางตวหนงสอ 20 Custom Shape Tool ใชเลอกรปภาพเลอกรปภาพทมรปรางเฉพาะจาก Custom Shape List 21 3D Camera Tools จดการกลองงานดาน 3D ไมวาจะเปนการซม หมน เคลอน 22 Zoom Tool ใชในการขยายและยอสวนการแสดงภาพบนหนาจอ 23 Foreground หรอ Background Color จะปรากฏ Color Picker ขนมาเพอใหเราเลอกคาส

ตามทตองการ 24 เปนเครองมออกรปแบบหนงของการเลอกโดยใชสเพอแยกความแตกตางระหวาง พนทท

ถกเลอกและพนท ทไมถกเลอก บรเวณทมสแดงเปนเหมอนการใสหนากาก หามไมใหท าการปรบแตงภาพบรเวณนน ใชมากในกรณทเพอเลอกเปนพน ทอสระ ไมมรปทรงทแนนอนและรปทไมมความแตกตางของสรปภาพ

17

2 โปรแกรม SQL Server หรอ Microsoft SQL Server คอระบบจดการฐานขอมลเชงสมพนธ (relational database management system หรอ

RDBMS) ผลตโดยบรษท Microsoft เปนระบบฐานขอมลแบบ ClientServer และรนอยบน Window NT ซงใชภาษา T-SQL ในการดงเรยกขอมลดวยเหตทขอมลสวนใหญทวโลกเกบไวในเครองทใช Microsoft Windows เปน Operating System จงท า ใหเปนการงายตอ Microsoft SQL ทจะน าขอมลทอยในรป Windows Based มาเกบและประมวลผล และประกอบกบการทราคาถกและหางาย จงเปนปจจยหลกทท า ให Microsoft SQL จงเปนระบบฐานขอมลทมกจะถกเลอกใช

3 โปรแกรม Dreamweaver CS5 อะโดบดรมวฟเวอร (Adobe Dreamweaver) หรอชอเดมคอ แมโครมเดย ดรมวฟเวอร

(Macromedia Dreamweaver) เปนโปรแกรมแกไข HTML พฒนาโดยบรษทแมโครมเดย (ปจจบนควบกจการรวมกบบรษท อะโดบซสเตมส) ส าหรบการออกแบบเวบไซตในรปแบบ WYSIWYG กบการควบคมของสวนแกไขรหส HTML ในการพฒนาโปรแกรมทมการรวมทงสองแบบเขาดวยกนแบบนท าให ดรมวฟเวอรเปนโปรแกรมทแตกตางจากโปรแกรมอนๆ ในประเภทเดยวกน ในชวงปลายปทศวรรษ 2533 จนถงปพศ 2544 ดรมวฟเวอรมสดสวนตลาดโปรแกรมแกไข HTML อยมากกวา 70 ดรมวเวอรมท งในระบบปฏบตการแมคอนทอช และไมโครซอฟทวนโดวส ดรมวฟเวอรยงสามารถท างานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจ าลองอยาง WINEได รนลาสดคอ ดรมวฟเวอร CS4การเรมก าหนดโครงสรางของเวบ กอนด าเนนการสรางเวบเพจ ขนแรกควรก าหนดใหขอมลตาง ๆ ทเกยวของอยใน Folder เดยวกน เพองายตอคนหาและจดเกบ ตวอยางเชนท าเวบเพจของหนวยงานกอนอนเราควรสราง Folder ชอของหนวยงานกอนอาจเปนภาษาองกฤษหรอภาษาไทยกได แลวใน Folder หนวยงานคอยสราง Folder ยอยอกท อาจประกอบดวยหลาย Folder ยอย เพอใชส าหรบแยกเกบไฟลตาง ๆ เปนหมวดหม เชน ไฟลรปภาพ ไฟล HTML และ ไฟล Multimedia ตาง ๆ

Dreamweaver เปนเครองมอในการสรางเวบเพจทมประสทธภาพสง ปจจบนDreamweaver ไดพฒนาเปน CS แลว เปนโปรแกรมสรางเวบเพจแบบเสมอนจรง ของคาย Adobe ซงชวยใหผทตองการสรางเวบเพจไมตองเขยนภาษา HTML หรอโคดโปรแกรม หรอทศพทเทคนคเรยกวา WYSIWYG โปรแกรม Dreamweaver มฟงกชนททา ใหผใชสามารถจดวางขอความ รปภาพ ตาราง ฟอรม วดโอรวมถงองคประกอบอนๆ ภายในเวบเพจไดอยางสวยงามตามทผใชตองการ โดยไมตองใชภาษาสครปตทยงยากซบซอนเหมอนกอน Dreamweaver มทงในระบบปฏบตการ แมคอนทอช และไมโครซอฟทวนโดวส ยงสามารถทา งานบนระบบปฏบตการแบบยนกซ ผานโปรแกรมจา ลองอยาง WINE ไดเวอรชนลาสดของโปรแกรมตวนคอ Adobe Dreamweaver CS55

18

ความสามารถของ Dreamweaver CS5 1 สนบสนนการทา งานแบบ WYSIWYG (What You See Is What You Get) หมายความวา

อะไรกตามทเราทา บนหนาจอ Dreamweaver กจะปรากฏผลแบบเดยวกนบนเวบเพจ ซงชวยใหการสรางและแกไขเวบเพจนนทา ไดงาย โดยไมตองมความรภาษา HTML เลย

2 มเครองมอในการสรางรปแบบหนาจอเวบเพจ ซงชวยอา นวยความสะดวกใหผใชงาน ไดมาก

3 สนบสนนภาษาสครปตตาง ๆ เชน Java ASP PHP CGI VBScript 4 มเครองมอทชวยในการ Upload หนาเวบทสรางไปท Server เพอทาการเผยแพรงานท

สรางบน Internet 5 รองรบการใชมนตมเดยตาง ๆ เชน เสยง กราฟฟก และภาพเคลอนไหว ทสรางโดย

โปรแกรม Flash Shockwave Firework เปนตน 6 มความสามารถทา การตดตอกบฐานขอมล เพอเชอมตอกบเวบไซต

สวนประกอบ Adobe Dreamweaver CS5 1 เมนบาร (Menu bar) เปนสวนทใชในการสรางและท างานกบโปรแกรม ซงมการแบงเปน

กลมค าสงตางๆ เปนหมวดหมและเกบไวเปนเมน โดยในแตละเมนกจะมเมนยอยๆ ไวเรยกใชงานตามตองการ

2 แถบเครองมอ (Insert bar) เปนสวนของการรวบรวมเครองมอทใชในการสรางวตถหรอองคประกอบตางๆ ของหนาเวบเพจ ซงแบงเปนกลมๆ มทงหมด 8 กลม คอ - Common เปนกลมเครองมอทใชงานบอยๆ ในการสรางเวบเพจ เชน การแทรกตาราง การแทรกรปภาพ เปนตน

- Layout ใชส าหรบวางวตถทใชจดโครงสรางของเวบเพจ เชน ตาราง เฟรม และ AP Element

- Forms ใชส าหรบวางวตถทใชสรางแบบฟอรมเพอรบขอมลจากผใชงานเวบไซต เชน การสมครสมาชก เปนตน - Data ใชส าหรบวางค าสงทใชจดการกบฐานขอมลและน าฐานขอมลออกมาแสดงบนหนาเวบเพจ - Spray ใชส าหรบวางวตถทใชเทคโนโลยของ Spary ในรปแบบตางๆ - InContext Editing ใชส าหรบสรางพนทเทมเพลตเพออ านวยความสะดวกตอผใชในการแกไขเนอหา - Text ใชส าหรบจดรปแบบของขอความภายในเวบเพจ เชน ตวหนา ตวเอยง หวขอ บลเลต และแทรกสญลกษณตางๆ ได - Favorites ใชส าหรบเพมเครองมอทเรยกใชงานบอยๆ โดยเพมจากกลมเครองมออนๆ ได

19

โดยคลกเมาสขวาบน Insert bar แลวเลอก Customize Favorites (ตวอยางดานลางเปนการดงเครองทใชงานบอยๆ คอ ตาราง รปภาพ และ Rollover Image)

หนาตางการท างาน (Document Window) เปนบรเวณทใชในการออกแบบและสรางเวบเพจตามตองการ ซงสามารถแทรกขอความ รปภาพ และวตถตางๆ ลงไปไดเลย

3 แถบสถานะ (Status bar) เปนสวนทแสดงขอมลเพมเตมเกยวกบงานทก าลงท าอย เชน การปรบขนาดการแสดงผลและเวลาทใชในการโหลดเวบเพจนนๆ

4 Properties Inspector ใชในการก าหนดคาคณสมบตของหนาเวบเพจและในสวนของวตถตางๆ ซงจะมรายละเอยดแสดงขนมา เมอมการคลกเลอกวตถนนๆ

5 พาเนล (Panel) เปนหนาตางหรอชดค าสงพเศษทใชงานเฉพาะดาน เชน ฐานขอมล ไฟลงานตางๆ สรางการเชอมโยง รวมถงเรองการอพโหลดไฟลงานขนเซรฟเวอร

4 Database (ฐานขอมล) คอระบบทรวบรวมขอมลไวในทเดยวกน ซงประกอบไปดวยแฟมขอมล (File) ระเบยน

(Record) และ เขตขอมล (Field) และถกจดการดวยระบบเดยวกน โปรแกรมคอมพวเตอรจะเขาไปดงขอมลทตองการได อยางรวดเรว ซงอาจเปรยบฐานขอมลเสมอนเปน electronic filing system

รปท 24 แสดงระบบฐานขอมล บต (bit) ยอมาจาก Binary Digit ขอมลในคอมพวเตอร 1 บต จะแสดงได 2 สถานะคอ 0

หรอ 1 การเกบขอมลตางๆไดจะตองน า บต หลายๆ บต มาเรยงตอกน เชนน า 8 บต มาเรยงเปน 1 ชด เรยกวา 1ไบตเชน 10100001 หมายถง ก 10100010 หมายถง ข

Database

File

Record

Field

Byte

Bit

A collection of related files

A collection of related records

A collection of related field

A collection of related byte

A collection of related bit

A binary digit 0 or 1

20

เมอเราน า ไบต (byte) หลายๆ ไบต มาเรยงตอกน เรยกวา เขตขอมล (field) เชน Name ใชเกบชอ Last Name ใชเกบ นามสกล เปนตนเมอน าเขตขอมล หลายๆ เขตขอมล มาเรยงตอกน เรยกวา ระเบยน (record) เชน ระเบยน ท 1 เกบชอนามสกล วนเดอนปเกด ของ นกเรยนคนท 1 เปนตนการเกบระเบยนหลายๆระเบยน รวมกน เรยกวา แฟมขอมล (File) เชน แฟมขอมล นกเรยน จะเกบชอนามสกล วนเดอนปเกด ของนกเรยน จ านวน 500 คน เปนตนการจดเกบ แฟมขอมล หลายๆ แฟมขอมล ไวภายใตระบบเดยวกน เรยกวา ฐานขอมล หรอ Database เชน เกบแฟมขอมล นกเรยน อาจารย วชาทเปดสอน เปนตนการเขาถงขอมลในฐานขอมลจงจ าเปนตองมระบบการจดการฐานขอมลมาชวยเรยกวา database management system (DBMS) ซงจะชวยใหผใชสามารถจดการกบขอมล ตามความตองการไดในหนวยงานใหญๆอาจมฐานขอมลมากกวา 1 ฐานขอมลเชน ฐานขอมลบคลากร ฐานขอมลลกคา ฐานขอมลสนคา เปนตน สาระส าคญ

ฐานขอมลเปนการจดเกบขอมลอยางเปนระบบ ท าใหผใชสามารถใชขอมลทเกยวของในระบบงานตาง ๆ รวมกนได โดยทจะไมเกดความซ าซอนของขอมล และยงสามารถหลกเลยงความขดแยงของขอมลดวย อกทงขอมลในระบบกจะถกตองเชอถอได และเปนมาตรฐานเดยวกน โดยจะมการก าหนดระบบความปลอดภยของขอมลขนนบไดวาปจจบนเปนยคของสารสนเทศ เปนทยอมรบกนวา สารสนเทศเปนขอมลทผานการกลนกรองอยางเหมาะสม สามารถน ามาใชประโยชนอยางมากมาย ไมวาจะเปนการน ามาใชงานดานธรกจ การบรหาร และกจการอน ๆ องคกรทมขอมลปรมาณมาก ๆ จะพบความยงยากล าบากในการจดเกบขอมล ตลอดจนการน าขอมลทตองการออกมาใชใหทนตอเหตการณ ดงนนคอมพวเตอรจงถกน ามาใชเปนเครองมอชวยในการจดเกบขอมล การประมวลผลขอมล ซงท าใหระบบการจดเกบขอมลเปนไปไดสะดวก ทงนโปรแกรมแตละโปรแกรมจะตองสรางวธควบคมและจดการกบขอมลขนเอง ฐานขอมลจงเขามามบทบาทส าคญอยางมาก โดยเฉพาะระบบงานตาง ๆ ทใชคอมพวเตอร การออกแบบและพฒนาระบบฐานขอมล จงตองค านงถงการควบคมและการจดการความถกตองตลอดจนประสทธภาพในการเรยกใชขอมลดวย

ระบบจดการฐานขอมลซอฟตแวรส าหรบจดการฐานขอมลนน โดยทวไปเรยกวา ระบบจดการฐานขอมล หรอ ด บเอมเอส (DBMS -Database Management System) สถาปตยกรรมซอฟตแวรของดบเอมเอสอาจมไดหลายแบบ เชน ส าหรบฐานขอมลขนาดเลกทมผใชคนเดยว บอยครงทหนาหมดจะจดการดวยโปรแกรมเพยงโปรแกรมเดยว สวนฐานขอมลขนาดใหญทมผใชจ านวนมากนน ปกตจะประกอบดวยโปรแกรมหลายโปรแกรมดวยกน และโดยทวไปสวนใหญจะใชสถาปตยกรรมแบบรบ-ใหบรการ (client-server)โปรแกรมสวนหนา (front-end) ของดบเอมเอส (ไดแก โปรแกรมรบบรการ) จะเกยวของเฉพาะการน าเขาขอมลการตรวจสอบ และการรายงานผลเปนส าคญ ในขณะทโปรแกรมสวนหลง (back-end) ซงไดแก โปรแกรมใหบรการ จะเปนชดของ

21

โปรแกรมทด าเนนการเกยวกบการควบคม การเกบขอมล และการตอบสนองการรองขอจากโปรแกรมสวนหนา โดยปกตแลวการคนหา และการเรยงล าดบ จะด าเนนการโดยโปรแกรมใหบรการรปแบบของระบบฐานขอมล มหลากหลายรปแบบดวยกน นบตงแตการใชตารางอยางงาย ทเกบในแฟมขอมลแฟมเดยว ไปจนกระทง ฐานขอมลขนาดใหญมาก ทมระเบยนหลายลานระเบยน ซงเกบในหองทเตมไปดวยดสกไดรฟ หรออปกรณหนวยเกบขอมลอเลกทรอนกสรอบขาง (peripheral) อนๆ

การออกแบบฐานขอมลการออกแบบฐานขอมล (Designing Databases) มความส าคญตอการจดการระบบฐานขอมล (DBMS) ทงนเนองจากขอมลทอยภายในฐานขอมลจะตองศกษาถงความสมพนธของขอมล โครงสรางของขอมลการเขาถงขอมลและกระบวนการทโปรแกรมประยกตจะเรยกใชฐานขอมล ดงนน เราจงสามารถแบงวธการสรางฐานขอมลได 3 ประเภท

1 รปแบบขอมลแบบล าดบขน หรอโครงสรางแบบล าดบขน (Hierarchical data model) วธการสรางฐาน ขอมลแบบล าดบขนถกพฒนาโดยบรษท ไอบเอม จ ากด ในป 1980 ไดรบความนยมมาก ในการพฒนาฐานขอมลบนเครองคอมพวเตอรขนาดใหญ และขนาดกลาง โดยทโครงสรางขอมลจะสรางรปแบบเหมอนตนไม โดยความสมพนธเปนแบบหนงตอหลาย (One- to -Many) 2 รปแบบขอมลแบบเครอขาย (Network data Model) ฐานขอมลแบบเครอขายมความคลายคลงกบฐาน ขอมลแบบล าดบชน ตางกนทโครงสรางแบบเครอขาย อาจจะมการตดตอหลายตอหนง (Many-to-one) หรอ หลายตอ หลาย (Many-to-many) กลาวคอลก (Child) อาจมพอแม (Parent) มากกวาหนง ส าหรบตวอยางฐานขอมลแบบเครอขายใหลองพจารณาการจดการขอมลของหองสมด ซงรายการจะประกอบดวย ชอเรอง ผแตง ส านกพมพ ทอย ประเภท

3 รปแบบความสมพนธขอมล (Relation data model) เปนลกษณะการออกแบบฐานขอมลโดยจดขอมลใหอยในรปของตารางทมระบบคลายแฟม โดยทขอมลแตละแถว (Row) ของตารางจะแทนเรคอรด (Record) สวน ขอมลนแนวดงจะแทนคอลมน (Column) ซงเปนขอบเขตของขอมล (Field) โดยทตารางแตละตารางทสรางขนจะเปนอสระ ดงนนผออกแบบฐานขอมลจะตองมการวางแผนถงตารางขอมลทจ าเปนตองใช เชนระบบฐานขอมลบรษทแหงหนง ประกอบดวย ตารางประวตพนกงาน ตารางแผนกและตารางขอมลโครงการ แสดงประวตพนกงานตารางแผนก และตารางขอมลโครงการการออกแบบฐานขอมลเชงสมพนธการออกแบบฐานขอมลในองคกรขนาดเลกเพอตอบสนองความตองการของผใชงานอาจเปนเรองทไมยงยากนก

เนองจากระบบและขนตอนการท างานภายในองคกรไมซบซอน ปรมาณขอมลทมกไมมาก และจ านวนผใชงานฐานขอมลกมเพยงไมกคน หากทวาในองคกรขนาดใหญ ซงมระบบและขนตอนการท างานทซบซอน รวมท งมปรมาณขอมลและผใชงานจ านวนมาก การออกแบบ

22

ฐานขอมลจะเปนเรองทมความละเอยดซบซอน และตองใชเวลาในการด าเนนการนานพอควรทเดยว ทงนฐานขอมลทไดรบการออกแบบอยางเหมาะสมจะสามารถตอบสนองตอความตองการของผใชงานภายในหนวยงานตาง ๆ ขององคกรได ซงจะท าใหการด าเนนงานขององคกรมประสทธภาพดยงขน เปนผลตอบแทนทคมคาตอการลงทนเพอพฒนาระบบฐานขอมลภายในองคกรทงน การออกแบบฐานขอมลทน าซอฟตแวรระบบจดการฐานขอมลมาชวยในการด าเนนการ สามารถจ าแนกหลกในการด าเนนการได 6 ขนตอน คอ

1 การรวบรวมและวเคราะหความตองการในการใชขอมล 2 การเลอกระบบจดการฐานขอมล 3 การออกแบบฐานขอมลในระดบแนวคด 4 การน าฐานขอมลทออกแบบในระดบแนวคดเขาสระบบจดการฐานขอมล 5 การออกแบบฐานขอมลในระดบกายภาพ 6 การน าฐานขอมลไปใชและการประเมนผล

5 ทฤษฏ HTML คอ ภาษาทใชในการเขยนเวบเพจ ยอมาจากคา วา Hypertext Markup Language โดย

Hypertext หมายถง ขอความทเชอมตอกนผานลงค (Hyperlink) Markup หมายถง วธในการเขยนขอความ language หมายถงภาษา ดงนน HTML จงหมายถง ภาษาทใชในการเขยนขอความ ลงบนเอกสารทตางกเชอมถงกนใน Cyberspace ผาน Hyperlink นนเองHTML เรมขนเมอ ป 1990 เพอตอบสนองความตองการในการสอสารแลกเปลยนขอมลกนของนกวทยาศาสตรระหวางสถาบนและมหาวทยาลยตางๆทวโลก โดย Tim Berners-Lee นกพฒนาของ CERN ไดพฒนาภาษาทมรากฐานมาจาก SGML ซงเปนภาษาทซบซอนและยากตอการเรยนร จนมาเปนภาษาทใชไดงายและสะดวกในการแลกเปลยนเอกสารทางวทยาศาสตรผานการเชอมโยงกนดวยลงคในหนาเอกสาร เมอ World Wide Web เปนทแพรหลาย HTML จงถกนามาใชจนเกดการแพรหลายออกไปยงทวโลก จากความงายตอการใชงานHTML ในปจจบนพฒนามาจนถง HTML 401 และ HTML 5 นอกจากนยงมการพฒนาไปเปน XHTML ซงคอ Extended HTML มความสามารถและมาตรฐานทมากกวาเดมโดยอยภายใตการควบคมของ W3C (World Wide Web Consortium)

6 ทฤษฏ PHP เกดในป 1994 โดย RasmusLerdorf โปรแกรมเมอรอเมรกนไดคดคนสรางเครองมอทใชในการพฒนาเวบสวนตว โดยใชขอดของภาษา C และ Perl เรยกวา Personal Home Page และไดสรางสวนตดตอกบฐานขอมลทชอวา Form Interpreter ( FI ) รวมทงสองสวน เรยกวา PHPFI ซงเปนจดเรมตนของ PHP มผทเขามาเยยมชมเวบไซตและชอบจงตดตอขอเอาโคดไปใช และนา ไปพฒนาตอในลกษณะของ Open Source ภายหลงมความนยมขนเปนอยางมากภายใน 3 ป มเวบไซตทใช PHPFIในตดตอฐานขอมลและแสดงผลแบบ ไดนามกและอนๆ มากกวา 50000ไซต PHP2

23

(ในตอนนนใชชอวา PHPFI) ในชวงระหวาง 1995-1997 RasmusLerdorf ไดมผทมาชวยพฒนาอก 2 คนคอ ZeevSuraski และ AndiGutmans ชาวอสราเอล ซงปรบปรงโคดของ Lerdorf ใหมโดยใช C++ ใหมความสามารถจดการเกยวกบแบบฟอรมขอมลทถกสรางมาจากภาษาHTML และสนบสนนการตดตอกบโปรแกรมจดการฐานขอมล MySQL จงทาให PHP เรมถกใชมากขนอยางรวดเรว และเรมมผสนบสนนการใชงาน PHP มากขน โดยในปลายป 1996 PHP ถกนา ไปใชประมาณ15000 เวบทวโลก และเพมจา นวนขนเรอยๆ ตอมามผมาชวยพฒนาอก 3 คน คอ StigBakken รบผดชอบความสามารถในการตดตอ Oracle Shane Caraveo รบผดชอบดแล PHP บน Window9xNT และ Jim Winsteadรบผดชอบการตรวจความบกพรองตางๆ และไดเปลยนชอเปน ProfessionalHome Page ในเวอรชนท 2PHP3 ออกมาในชวงระหวางเดอน มถนายน 1997 ถง 1999 มคณสมบตเดนคอสนบสนนระบบปฏบตการทง Window 9598MENT Linux และเวบเซรฟเวอร อยาง IIS PWS ApacheOmniHTTPdสนบสนน ระบบฐานขอมลไดหลายรปแบบเชน SQL Server MySQL mSQL OracleInformix ODBCPHP4 ต งแต 1999 - 2007 ซงไดเพม Functions การทา งานในดานตางๆใหมากและงายขนโดย บรษท Zend ซงม Zeev และ AndiGutmansไดรวมกอตงขน (httpwwwzendcom ) ในเวอรชนนจะเปน compile script ซงในเวอรชนหนานจะเปน embed script interpreter ในปจจบนมคนไดใช PHPสงกวา 5100000ไซตในทวโลก และผพฒนาไดตงชอของ PHPใหมวา PHP Hypertext Preprocessorซงหมายถงมประสทธภาพระดบโปรเฟสเซอรสา หรบไฮเปอรเทกซPHP5 ตงแต 2007-ปจจบน ม ไดเพม Functions การทา งานในดานตาง ๆ เชน Object Oriented Model

1 การก าหนดสโคป publicprivateprotected 2 Exception handling 3 XML และ Web Service 4 MySQLi และ SQLite 5 Zend Engine 20

ลกษณะเดนของ PHP 1 สามารถใชไดฟร 2 PHP เปนโปรแกรมวงขาง Sever ดงนนขดความสามารถไมจา กด 3 Conlatfun นนคอ PHP วงบนเครอง UNIX Linux Windows ไดหมด 4 เรยนรงาย เนองจาก PHP ฝงเขาไปใน HTML และใชโครงสรางและไวยากรณภาษา

งายๆ 5 ใชรวมกบ XML ไดทนท 6 ใชกบระบบแฟมขอมลได 7 ใชกบขอมลตวอกษรไดอยางมประสทธภาพ

24

8 ใชกบโครงสรางขอมลใชไดแบบ Scalar Array Associative array 9 ใชกบการประมวลผลภาพได

โปรแกรมฐานขอมลทนยมใช

โปรแกรมฐานขอมล เปนโปรแกรมหรอซอฟแวรทชวยจดการขอมลหรอรายการตาง ๆ ทอยในฐานขอมล ไมวาจะเปนการจดเกบ การเรยกใช การปรบปรงขอมล โปรแกรมฐานขอมล จะชวยใหผใชสามารถคนหาขอมลไดอยางรวดเรว ซงโปรแกรมฐานขอมมลทนยมใชมอยดวยกนหลายตว เชน Access FoxPro Clipper dBase FoxBase Oracle SQL เปนตน โดยแตละโปรแกรมจะมความสามารถตางกน บางโปรแกรมใชงายแตจะจ ากดขอบเขตการใชงาน บงโปรแกรมใชงานยากกวา แตจะมความสามารถในการท างานมากกวาโปรแกรม Access นบเปนโปรแกรมทนยมใชกนมากในขณะน โดยเฉพาะในระบบฐานขอมลขนาดใหญสามารถสรางแบบฟอรมทตองการจะเรยกดขอมลในฐานขอมล หลงจากบนทกขอมลในฐานขอมลเรยบรอยแลว จะสามารถคนหาหรอเรยกดขอมลจากเขตขอมลใดกได นอกจากน Access ยงมระบบรกษาความปลอดภยของขอมล โดยการก าหนดรหสผานเพอปองกนความปลอดภยของขอมลในระบบไดดวย

โปรแกรม FoxPro เปนโปรแกรมฐานขอมลทมผใชงานมากทสด เนองจากใชงายทงวธการเรยกจากเมนของ FoxPro และประยกตโปรแกรมขนใชงาน โปรแกรมทเขยนดวย FoxPro จะสามารถใชกลบ dBase ค าสงและฟงกช นตาง ๆ ใน dBase จะสามารถใชงานบน FoxPro ได นอกจากนใน FoxPro ยงมเครองมอชวยในการเขยนโปรแกรม เชน การสรางรายงาน

โปรแกรม dBase เปนโปรแกรมฐานขอมลชนดหนง การใชงานจะคลายกบโปรแกรม FoxPro ขอมลรายงานทอยในไฟลบน dBase จะสามารถสงไปประมวลผลในโปรแกรม Word Processor ได และแมแต Excel กสามารถอานไฟล DBF ทสรางขนโดยโปรแกรม dBase ไดดวย

โปรแกรม SQL เปนโปรแกรมฐานขอมลทมโครงสรางของภาษาทเขาใจงาย ไมซบซอน มประสทธภาพการท างานสง สามารถท างานทซบซอนไดโดยใชค าสงเพยงไมกค าสง โปรแกรม SQL จงเหมาะทจะใชกบระบบฐานขอมลเชงสมพนธ และเปนภาษาหนงทมผนยมใชกนมาก โดยทว ไปโปรแกรมฐานขอมลของบรษทตาง ๆ ทมใชอยในปจจบน เชน Oracle DB2 กมกจะมค าสง SQL ทตางจากมาตรฐานไปบางเพอนใหเปนจดเดนของแตละโปรแกรมไป

ความส าคญของการประมวลผลแบบระบบฐานขอมลจากการจดเกบขอมลรวมเปนฐานขอมลจะกอใหเกดประโยชนดงน

25

1 สามารถลดความซ าซอนของขอมลได การเกบขอมลชนดเดยวกนไวหลาย ๆ ทท าใหเกดความซ าซอน (Redundancy) ดงนนการน าขอมลมารวมเกบไวในฐานขอมล จะชาวลดปญหาการเกดความซ าซอนของขอมลได โดยระบบจดการฐานขอมล (Database Management System DBMS) จะชวยควบคมความซ าซอนไดเนองจากระบบจดการฐานขอมลจะทราบไดตลอดเวลาวามขอมลซ าซอนกนอยทใดบาง

2 หลกเลยงความขดแยงของขอมลไดหากมการเกบขอมลชนดเดยวกนไวหลาย ๆ ทและมการปรบปรงขอมลเดยวกนน แตปรบปรงไมครบทกททมขอมลเกบอยกจะท าใหเกดปญหาขอมลชนดเดยวกนอาจมคาไมเหมอนกนในแตละททเกบขอมลอย จงกอใหเกดความขดแยงของขอมลขน (Inconsistency)

3 สามารถใชขอมลรวมกนไดฐานขอมลจะเปนการจดเกบขอมลรวมไวดวยกน ดงนนหากผใชตองการใชขอมลในฐานขอมลทมาจากแฟมขอมลตางๆ กจะท าไดโดยงาย

4 สามารถรกษาความถกตองเชอถอไดของขอมลบางครงพบวาการจดเกบขอมลในฐานขอมลอาจมขอผดพลาดเกดขน เชน จากการทผปอนขอมลปอนขอมลผดพลาดคอปอนจากตวเลขหนงไปเปนอกตวเลขหนงโดยเฉพาะกรณมผใชหลายคนตองใชขอมลจากฐานขอมลรวมกน หากผใชคนใดคนหนงแกไขขอมลผดพลาดกท าใหผอนไดรบผลกระทบตามไปดวย ในระบบจดการฐานขอมล (DBMS) จะสามารถใสกฎเกณฑเพอควบคมความผดพลาดทเกดขน

5 สามารถก าหนดความเปนมาตรฐานเดยวกนของขอมลไดการเกบขอมลรวมกนไวในฐานขอมลจะท าใหสามารถก าหนดมาตรฐานของขอมลไดรวมทงมาตรฐานตาง ๆ ในการจดเกบขอมลใหเปนไปในลกษณะเดยวกนได เชนการก าหนดรปแบบการเขยนวนทในลกษณะวนเดอนปหรอ ปเดอนวน ทงนจะมผทคอยบรหารฐานขอมลทเราเรยกวา ผบรหารฐานขอมล (Database Administrator DBA) เปนผก าหนดมาตรฐานตางๆ

6 สามารถก าหนดระบบความปลอดภยของขอมลไดระบบความปลอดภยในทน เปนการปองกนไมใหผใชทไมมสทธมาใช หรอมาเหนขอมลบางอยางในระบบผบรหารฐานขอมลจะสามารถก าหนดระดบการเรยกใชขอมลของผใชแตละคนไดตามความเหมาะสม

7 เกดความเปนอสระของขอมลในระบบฐานขอมลจะมตวจดการฐานขอมลทท าหนาทเปนตวเชอมโยงกบฐานขอมล โปรแกรมตาง ๆ อาจไมจ าเปนตองมโครงสรางขอมลทกครง ดงนนการแกไขขอมลบางครง จงอาจกระท าเฉพาะกบโปรแกรมทเรยกใชขอมลทเปลยนแปลงเทานน สวนโปรแกรมทไมไดเรยกใชขอมลดงกลาว กจะเปนอสระจากการเปลยนแปลง

7 ทฤษฎส สเปนสงทมความส าคญตอวถชวต นบแตสมยดกด าบรรพจนถงปจจบน ไดน าสมาใชให

เกดประโยชนโดยใชเปนสญลกษณในการถายทอดความหมายอยางใดอยางหนง สจงเปนสงทควรศกษาเพอใชประโยชนกบวถชวตของเราเพราะสรรพสงทงหลายทแวดลอมตวเราประกอบไปดวยส

26

ทงสนในงานศลปะสเปนองคประกอบส าคญอยางหนงและในวถชวตของเราสเปนองคประกอบทมอทธพลตอ ความรสก อารมณ และจตใจแมส ประกอบดวย ส แดง สเหลอง และสน าเงน ซงเมอน าแมสทงสามมาผสมกนในอตราสวนตาง ๆ กจะเกดสขนมามากมาย ซงประโยชน จากการทเราน าสมาผสมกนท าใหเรา สามารถเลอกสตาง ๆ มาใชไดตามความพอใจ สรางสรรคผลงานศลปะทงดงามตามความพอใจขอผสรางสทเกดจากการน าเอาแมสมาผสมกน เกดสใหมเมอน ามาจดเรยงอยางเปนระบบรวมเรยกวาวงจรส

รปท 25 ภาพแสดงวงจรของสทเกดจากการน าแมสมาผสมกน

การเกดสดงภาพ เกดจากการน าเอาแมสมาผสมกน ในอตราสวนตางๆกนซงสรปไดดงน สขนท1 (Primary Color) คอสพนฐานมแมส 3 ส

1 สพนฐานแมส

รปท 26 สพนฐานแมส

1 แดง 2 สเหลอง 3 สน าเงน

27

สขน ท 2 (Binary Color) คอสท เกดจากการน าเอาสข น ท 1 หรอแมสมาผสมกนในอตราสวนเทากนจะท าใหเกดสใหม 3 สไดแก

1 สเขยว เกดจากการน าเอา สเหลอง กบ สน าเงน มาผสมกนในอตราสวนเทา ๆ กน 2 สสม เกดจากการน าเอา สเหลอง กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน 3 สมวง เกดจากการน าเอา สน าเงน กบ สแดง มาผสมกนในอตราสวนทเทา ๆ กน

สขนท 3 (Intermediate Color) คอ สทเกดจากการผสมกนระหวางสของแมสกบสขนท 2 จะเกดสขนอก 6 สไดแก

รปท 27 สเหลองแกมเขยว

- สเหลองแกมเขยว เกดจาก การผสมกนระหวางสเหลองกบสเขยวอยางละเทาๆ

รปท 28 สน าเงนแกมมวง

- สน าเงนแกมมวง เกดจากการผสมกนระหวางสน าเงนกบสมวงอยางละเทาๆกน

รปท 29 สแดงแกมมวง

- สแดงแกมมวง เกดจากการผสมกนระหวางสแดงกบสมวงอยางละเทาๆกน

28

รปท 210 สแดงแกมสม

- สแดงแกมสม เกดจากการผสมกนระหวางสแดงกบสสมอยางละเทาๆกน

รปท 211 สเหลองแกมสม

- สเหลองแกมสม เกดจากการผสมกนระหวางสเหลองกบสสมอยางละเทาๆกน

รปท 212 สน าเงนแกมเขยว

- สน าเงนแกมเขยวเกดจากการผสมกนระหวางสน าเงนกบสเขยวอยางละเทาๆกน คณลกษณะของสม 3 ประการ คอ

- สแทหรอความเปนส(Hue) หมายถงสทอยในวงจรสธรรมชาตทง 12 ส สทเราเหนอยทกวนนแบงเปน 2 วรรณะ โดยแบงวงจรสออกเปน 2 สวน จากสเหลองวนไปถง สมวง คอ - สรอน (Warm Color) ใหความรสกรนแรงรอนตนเตนประกอบดวย สเหลองสมวง สเหลองสม สสม สแดงสม สแดง สมวงสม - สเยน (Cool Color) ใหความรสกเยนสงบสบายตาประกอบดวย สเหลอง สเขยวเหลอง สเขยว สน าเงนเขยว สน าเงน สมวงน าเงน สมวงเราจะเหนวา สเหลอง และสมวง เปนสทอยไดทง 2 วรรณะ คอเปนสกลาง เปนไดทงสรอน และสเยน

29

ความเขมของส (Intensity) เกดจาก สแท คอสทเกดจากการผสมกนในวงจรส เปนสหลกทผสมขนตามกฎเกณฑและ

ไมถกผสมดวยสกลางหรอสอน ๆ จะมคาความเขมสงสด หรอแรงจดทสด เปนคาความแทของสทไมถกเจอปน เมอสเหลาน อยทามกลางสอน ๆ ทถกผสมใหเขมขน หรอออนลง ใหมด หมน หรอเปลยนคาไปแลว สแทจะแสดงความแรงของสปรากฏออกมาใหเหน อยางชดเจน ซงจะท าใหเกดจดสนใจขนในผลงานลกษณะเชนน เหมอนกบ ดอกเฟองฟาสชมพสด หรอบานเยน ทอยทามกลางใบเฟองฟาทเขยวจด ๆ หรอ พลทถกจดสองสวางในยามเทศกาล ตดกบสมด ๆ ทบ ๆ ของทองผายามค าคน เปนตน

น าหนกของส (Value)

เปนการใชสโดยใหมคาน าหนกในระดบตาง ๆ กน และมสหลาย ๆ ส ซงถาเปนสเดยว กจะมลกษณะเปนสเอกรงค การใชคาน าหนกของส จะท าใหเกดความกลมกลน เกดระยะใกลไกล ตนลก ถามคาน าหนกหลาย ๆ ระดบ สกจะกลมกลนกนมากขนแตถามเพยง1 - 2 ระดบทหางกน จะท าใหเกดความแตกตาง ความรสกของส

การใชวรรณะรอนเชนสแดงสม ท าใหเกดความรสกอบอน ทาทาย เคลอนไหวสงตาง ๆ ทเราสมผสดวยสายตา จะท าใหเกดความรสกขนภายในตอเรา ทนททเรามองเหนส ไมวาจะเปน การแตงกาย บานทอยอาศย เครองใชตาง ๆ แลวเราจะท าอยางไร จงจะใชสไดอยางเหมาะสม และสอดคลองกบหลกจตวทยา เราจะตองเขาใจวาสใดใหความรสกตอมนษยอยางไร ซงความรสกเกยวกบสสามารถจ าแนกออกไดดงน

30

รป ส ความหมาย

สแดง ใหความรสกรอนรนแรง กระตน ตนเตน เราใจ ความอดมสมบรณความมงคง ความรก

สสม ใหความรสก รอน มชวตชวา วยรน ความคกคะนอง การปลดปลอย ความเปรยว การระวง

สเหลอง ใหความรสกแจมใส ความสดใส ความราเรง ความมชวตใหม ความสข

สเขยว ใหความรสกสงบ เงยบ รมเยน การพกผอน การผอนคลาย ธรรมชาต ความสขม เยอกเยน

สน าเงน ใหความรสกสงบเงยบ สขม สภาพ ละเอยด สงางาม มศกดศร เปนระเบยบถอมตน

สมวง ใหความรสก มเสนห นาตดตาม มอ านาจความรก ความเศราความสงบ ความผดหวง ความสงศกด

สฟา ใหความรสก ปลอดโปรงโลง กวาง เบา โปรงใส สะอาด ปลอดภย ความสวาง

สด า ใหความรสก มด ลกลบ ความสนหวง จดจบ ความตาย โหดราย อดทนหนกแนน เขมแขง มพลงความเศรา

สชมพ ใหความรสกอบอน ออนโยน นมนวล ออนหวาน ความรก ความนารก ความสดใส

สเทา ใหความรสก เศรา อาลย ทอแท ความลกลบ ความหดห ความชรา สขมความสงบ ความเงยบ สภาพ ถอมตน

สทอง ใหความรสก ความหรหรา โออา มราคา สงคา สงส าคญ ความมงคงความเจรญรงเรอง

ตารางท 23 ความรสกของส

31

สกบการออกแบบ ผสรางสรรคงานออกแบบจะเปนผทเกยวของกบการใชสโดยตรงมณฑนากรจะคดคนส

ขนมาเพอใชในงานตกแตงคนออกแบบฉากเวทการแสดงจะคดคนสเกยวกบแสง จตรกรกจะคดคนสขนมาระบายใหเหมาะสมกบความคดและจนตนาการของตนแลวตวเราจะคดคนสขนมาเพอความงามความสขส าหรบเรามไดหรอสทใชส าหรบการออกแบบนนถาเราจะใชใหเกดความสวยงามตรงตามความตองการของเรา มหลกในการใชกวางๆ อย 2 ประการ คอ การใชสกลมกลนกนและการใชสตดกน

การใชสกลมกลนกน การใชสใหกลมกลนกนเปนการใชสหรอน าหนกของสใหใกลเคยงกนหรอคลายคลงกนเชน การใชสแบบเอกรงคเปนการใชสสเดยวทมน าหนกออนแกหลายล าดบการใชสขางเคยงเปนการใชสทเคยงกน 2 ndash 3 ส ในวงส เชน สแดง สสมแดง และสมวงแดง การใชสใกลเคยงเปนการใชสทอยเรยงกนในวงสไมเกน 5 ส ตลอดจนการใชสวรรณะรอนและวรรณะเยน (warm tone colors and cool tone colors) ดงไดกลาวมาแลว

การใชสตดกน สตดกนคอสทอยตรงขามกนในวงจรส การใชสใหตดกนมความจ าเปนมากในงานออกแบบ เพราะชวยใหเกดความนาสนใจในทนททพบเหน สตดกนอยางแทจรงมอยดวยกน6 คสคอ

- สเหลอง ตรงขามกบ สมวง - สสม ตรงขามกบ สน าเงน - สแดง ตรงขามกบ สเขยว - สเหลองสม ตรงขามกบ สมวงน าเงน - สสมแดง ตรงขามกบ น าเงนเขยว - สมวงแดง ตรงขามกบ สเหลองเขยว

การใชสตดกน ควรค านงถงความเปนเอกภาพดวย วธการใชมหลายวธ เชน ใชสใหมปรมาณตางกน เชน ใชสแดง 20 สเขยว 80 หรอ ใชเนอสผสมในกนและกนหรอใชสหนงสใดผสมกบสคทตดกนดวยปรมาณเลกนอยรวมทงการเอาสทตดกนมาท าใหเปนลวดลายเลก ๆ สลบกน ในผลงานชนหนง อาจจะใชสใหกลมกลนกนหรอตดกนเพยงอยางใดอยางหนงหรออาจจะใชพรอมกนทง 2 อยาง ทงนแลวแตความตองการและความคดสรางสรรคของเราไมมหลกการหรอรปแบบทตายตวในงานออกแบบหรอการจดภาพหากเรารจกใชสใหมสภาพโดยรวมเปนวรรณะรอน หรอวรรณะเยนเราจะสามารถควบคมและสรางสรรคภาพใหเกดความประสานกลมกลนงดงามไดงายขนเพราะสมอทธพลตอ มวล ปรมาตร และชองวางสมคณสมบตทท าใหเกดความกลมกลน หรอขดแยงได สสามารถขบเนนใหใหเกดจดเดน และการรวมกนใหเกดเปนหนวยเดยวกนไดเราในฐานะผใชสตองน าหลกการตางๆของสไปประยกตใชใหสอดคลองกบเปาหมายในงานของเราเพราะสมผลตอการออกแบบคอ

32

- สรางความรสกสใหความรสกตอผพบเหนแตกตางกนไปทงนขนอยกบประสบการณและภมหลงของแตละคนสบางสสามารถรกษาบ าบดโรคจตบางชนดไดการใชสภายในหรอภายนอกอาคารจะมผลตอการสมผสและสรางบรรยากาศได

- สรางความนาสนใจสมอทธพลตองานศลปะการออกแบบจะชวยสรางความประทบใจและความนาสนใจเปนอนดบแรกทพบเหน

- สบอกสญลกษณของวตถซงเกดจากประสบการณหรอภมหลง เชนสแดงสญลกษณของไฟหรออนตรายสเขยวสญลกษณแทนพชหรอความปลอดภยเปนตน

- สชวยใหเกดการรบรการออกแบบตองการใหผพบเหนเกดการจดจ าใจรปแบบแลผลงาน หรอเกดความประทบใจ การใชสจะตองสะดดตา และมเอกภาพ โครงการทเกยวของ นางสาวน าฝน มานะกจ และ นางสาวสพศตรา พ งสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคาเครองประดบแฟชน พฒนาเวบไซตทางดานการขายสนคาเกยวกบเครองประดบแฟชนและใหลกคาสามารเขามาเลอกซอสนคาไดผานทางเวบไซตพฒนาทกษะการออกแบบเวบไซตเพอไปตอยอดในการท างาน มการออกแบบเวบไซตโดยใช Logo Banner และปมทใชในการท างาน มระบบ Login เขาสเวบไซต เพอเลอกซอสนคาและวธการช าระเงนใหสะดวกในการใชงานและดนาสนใจอกดวย

นายสถาพร ผวด า และ นายเอกรตน วงษจอม (2559) การจดท าโครงการ ldquoระบบขายสนคาออนไลนประเภท รานออรานออมวสคrdquo มจดมงหมายเพอ สนบสนนและสงเสรมการพฒนาโปรแกรมบนเวบไซต เพอใหผเขาใชอนเทอรเนตนนไดเลอกชมเวบไซตทมสนคาทหลากหลาย และเพอใหลกคาสามารถพดคยเรองราวสนคากบผดแลเวบไซตได

นางสาวโสภดา แยมโสพศ และ นางสาวเสาวรส งามขา (2558) ในการท าโครงการประเภทเวบไซต เรองระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหมไทยครงน เพอใชในการขายระบบสนคาออนไลนท าใหเปนชองทางในการสงเสรมการขายโดยผานระบบอนเทอรเนตเพอใหลกคาไดสงสนคาทตรงตามความตองการและมความสะดวกสบายใหแกลกคา

25 การน าคอมพวเตอรเขามาใชในระบบ

1 โปรแกรม Adobe Dreamweaver CS5 ในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS51 ในการตกแตงภาพ 3 โปรแกรม Appserv ในการจ ารองเครอง Server 4 โปรแกรม PHP My Admin ในการท าฐานขอมล 5 โปรแกรม Microsoft Visio 2007 ในการท า Flowchart

บทท 3

การออกแบบระบบงานดวยคอมพวเตอร 31 การออกแบบระบบงาน (Flowchart)

รปท 31 การออกแบบระบบงาน (Flowchart)

ลอกอน

34

1 Flowchart การสมครสมาชก

รปท 32 Flowchart การสมครสมาชก

Y

สมครสมาชก

ขอมลซ ากบในระบบ

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

N

จบการท างาน

สมครสมาชก

35

1 Flowchart การเขาสระบบ

รปท 33 Flowchart การเขาสระบบ

N

เขาสระบบ

ตรวจสอบ ขอมลสมาชก

เรมตน

กรอกขอมล

บนทกขอมล

แสดงขอมลการสมครสมาชก

Y

จบการท างาน

36

32 การออกแบบแผนภาพบรบท (Context Diagram)

รปท 34 การออกแบบแผนภาพบรบท (Context Diagram)

-ขอมลการสงซอ

0 ระบบขายเสอผาแฟชนผหญง E-Commerce for Fashion of

Womenrsquos Clothing

ลกคา

ผดแลระบบ

-ขอมลการช าระเงน

-รายละเอยดสนคา

-ขอมลสมาชก

-รายละเอยดของสมาชก -รายละเอยดของสนคา -รายละเอยดการช าระเงน -รายละเอยดใบเสรจรบเงน -ใบเสรจรบเงน

-วธการช าระเงน -ขอมลรายการสนคา -ขอมลสมาชก

-รายงานสมาชก

-รายงานรายละเอยดสนคา

-รายงานการสงซอ -รายงานการช าระเงน

37

1 แผนภาพการไหลของขอมล (Data Flow Diagram) 11 Data Flow Diagram Level 1

รปท 35 Data Flow Diagram Level 1 ระบบขายเสอผาแฟชนผหญง

1

สมาชก

ลกคา

ผดแลระบบ

D1

D2

แฟมลกคา

ขอมลลกคา รายงานการ เปนสมาชก

รายงานการสมคร

ขอมลลกคา

ยนยนการเขาสระบบ ชอผใชรหสผาน

สงซอสนคา แฟมขอมลสนคา

รายงานการสมคร

ชอผดแลระบบ

2

เขาสระบบ

แฟมลกคา

จดเกบขอมล

ตรวจสอบ ชอผใชรหสผาน ยนยนการตรวจสอบ

รายงานการสงซอ

รายละเอยดสนคา

ขอมลลกคา

3

สงซอสนคา

4

รายงาน

D3

D1

คยรหสสนคา

ช าระเงน ใบเสรจรบเงน รายงานการสงซอ

คนหารหสสนคา รายละเอยดสนคา รายงานการช าระเงน

ขอมลการสงซอ แฟมขอมลการสงซอ

คนหารายการสงซอ

รายการสงซอสนคา รายงานการสงซอสนคา คนหารายการสงซอ

38

12 Data Flow Diagram Level 1 Process 1

รปท 36 Data Flow Diagram Level 1 Process 1 ระบบ สมาชก

11

คยขอมลสมครสมาชก

12

บนทกขอมลการสมคร

13

แสดงขอมลสมาชก

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

ขอมลลกคา

39

13 Data Flow Diagram Level 1 Process 2

รปท 37 Data Flow Diagram Level 1 Process 2 ระบบ สมาชก

21

คยขอมลเขาสระบบ

12

ตรวจสอบการเขาระบบ

13

แสดงผลการเขาสระบบ

ลกคา

ผดแลระบบ

D1 แฟมลกคา

ขอมลลกคา

ขอมลลกคา

แสดงผลการเขาสระบบ แสดงผลการเขาสระบบ

ขอมลผดแลระบบ

40

14 Data Flow Diagram Level 1 Process 3

รปท 38 Data Flow Diagram Level 1 Process 3ระบบสงซอสนคา

35

บนทกสนคา ขอมลการสงซอ

31

คยรหสสนคา

33

แสดงรายการสนคา

34

สงซอสนคา

ลกคา

ขอมลสนคา

D2 แฟมขอมลสนคา

D3 แฟมขอมลการสงซอ

ขอมลการสงซอ

32

คนหารหสสนคา

36

ช าระเงน

37

ใบเสรจ

ขอมลสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลการช าระเงน

รายการสนคา

ขอมลสนคา

ขอมลสนคา

ขอมลใบเสรจ

41

15 Data Flow Diagram Level 1 Process 4

รปท 39 Data Flow Diagram Level 1Process 4 แสดงผลรายงาน

41

เลอกรายการ

43

ยนยนการคนหา

44

แสดงรายการ

ผดแลระบบ

D2 แฟมขอมลการสงซอ

42

คนหาขอมล

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมลการสงซอ

ขอมล การสงซอ

ขอมลการสงซอ

42

33 การออกแบบแผนภาพความสมพนธของขอมล (Entity Relationship Diagram)

รปท 310 E-R Diagramระบบการขายสนคาออนไลนประเภทเสอผามอสอง

มสนคา

เบอรโทร ชอสนคา

มสนคา รหสผสงซอ

M

N

สนคา สมาชก การสงซอ

ล าดบสนคา

เพศ ชอผเขาใช

รหสลกคา ชอ-นามสกล

ทอย

อเมล

รหสสมาชก

M

รหสสนคา

ชอสนคา

M

M

ชนด

1

ราคาสนคา

รหสสนคา

รปสนคา ราคาสนคา

ชอสนคา รหสประเภทสนคา

ใบเสรจ

ชอผสงซอ

อเมลผสงซอ

เบอรผสงซอ

ทอยผสงซอ

ยอดรวมการสงซอ วนทสงซอ

43

34 พจนานกรมขอมล (Data Dictionary) ออกแบบฐานขอมล ระบบขายสนคาออนไลนประเภทเสอผาแฟชนผหญงดงน 1 ตารางขอมลสมาชก (tb_member)

ตารางท 31 ตารางขอมลสมาชก

2 ตารางขอมลใบเสรจ (tb_order) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

Id_oreder Int 11 เลขทใบเสรจ PK Name_order varchar 60 ชอผสงซอ Email_order varchar 60 อเมลผสงซอ Tel_order varchar 20 เบอรผสงซอ Address_order text ทอยผสงซอ Total_order int 11 ยอดรวมการ

สงซอ

Date_order date วนทสงซอ

ตารางท 32 ตารางขอมลการสงซอ

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id int 11 รหสลกคา PK username varchar 20 ชอผเขาใช password varchar 30 รหสผเขาใช name varchar 60 ชอลกคา sex varchar 5 เพศ email varchar 30 อเมล telephone varchar 10 โทรศพท address varchar 100 ทอย

44

3 ตารางขอมลรายละเอยดสงซอ (tb_order_detail)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

key_id_order int 11 รหสใบสงสนคา PK ref_product int 11 ชอสนคา number int 11 ล าดบสนคา price int 11 ราคาสนคา

ตารางท 33 ตารางขอมลรายละเอยดสงซอ 4 ตารางขอมลสนคา (tb_product)

Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_prd int 11 รหสใบสงสนคาสนคา

PK

name_prd varchar 60 ชอสนคา price_prd int 11 ราคาสนคา proto_prd varchar 50 รปสนคา

ตารางท 34 ตารางขอมลสนคา

5 ตารางขอมลประเภทสนคา (tb_type) Field Name ชอฟลด

Type ชนดของขอมล

Field Side ขนาดฟลด

Description ใชเกบขอมล

หมายเหต

id_type int 5 รหสประเภทสนคา

PK

nametape varchar 60 ชอสนคา ตารางท 35 ตารางขอมลประเภทสนคา

45

หนาแรก

หนาห

ลก

หนาห

ลก

สนคา

วธการส

งซอ

วธการช

าระเง

น การจดส

งสนค

า ตด

ตอเรา

ชดแซ

ชดเสอแ

ฟชนต

างๆ

Login

ชดกางเก

ง+กระโปร

สนคา sa

le

35 กา

รออก

แบบ

Sitem

ap

รปท 31

1 การออก

แบบ

Site M

ap

สมครสม

าชก

ชองท

างตด

ตอ

ทางไปร

ษณย

เบอรโท

Fac

ebo

ok

Lin

e

โอนผ

านธน

าคาร

QR C

ode

46

36 การออกแบบ Story Board

รปท 312 หนาหลกของเวบไซต

รปท 313 หนาสงซอสนคา

47

รปท 314 การเลอกซอสนคาใสตระกรา

รปท 315 วธการช าระเงนผานทางธนาคารและ QR CODE

48

รปท 316 วธการตดตอผขาย

รปท 317 หนาผจดท า

49

รปท 318 หนาผจดท า

บทท 4

การพฒนาระบบเวบไซตขายเสอผาออนไลน

41 เครองมอและอปกรณทใช 1 โนตบค

- AMD A10-7300 - 8 GB (695 GB usable) - Memory 8 GB DDR3 - 1 TB HDD - Windows 10 Home (64 Bit)

42 โปรแกรมทงหมดทใชพฒนา 1 โปรแกรม Adobe Dreamweaver CS6 ใชในการท าเวบไซต 2 โปรแกรม Adobe Photoshop CS6 ใชในการตกแตงรปภาพ 3 โปรแกรม appserv-win32-860ใชในการเชอมตอฐานขอมล 4 โปรแกรม Microsoft Office Word 2016 ใชในการท าเอกสาร

5 โปรแกรม Microsoft Office PowerPoint 2016 ใชในการท างานน าเสนอ 43 วธการตดตงโปรแกรม

โปรแกรม appserv 2510

51

รปท 41 double click ทตวโปรแกรม appserv 2510

รปท 42 รอสกครจะปรากฏหนาจอ Welcome ใหกดปม Next เพอไปยงหนาตอไป

52

รปท 43 กดปม I Agree เพอยอมรบขอตกลงในการใชซอฟตแวร

รปท 44 ก าหนดโฟลเดอรส าหรบตดตงโปรแกรม AppServ จากนนกดปม Next

53

รปท 45 เลอกองคประกอบ (Components) ส าหรบการตดตง แลวกดปม Next

รปท 46 จะปรากฏหนาจอส าหรบใหกรอกขอมลของเซรฟเวอร (Server Information) ประกอบดวย ชอเซรฟเวอร หรอ ยอารแอล (URL) อเมลของผดแลเซรฟเวอร พอรตส าหรบใชงาน กรอกชอ Server Information และ E-mail จากนน กดปม Next เพอไปหนาตอไป

54

รปท 47 ขนตอนตอไปคอการก าหนดคาส าหรบ MySQL Server ซงตองระบ รหสผาน(Password) ส าหรบ root ชดภาษา (Character Sets and Collations) ทใช หลงจากก าหนดคาดงกลาว แลว ใหกดปม Install

รปท 48 เมอการตดตงเสรจสน ใหกดปม Finish ระบบจะท าการสตารท (Start) โปรแกรม Apache

55

รปท 49 ส าหรบองคประกอบตางๆ ของ AppServ จะถกตดตงไวทโฟลเดอร CAppServ

44 วธการตดตงระบบฐานขอมลลงในเครองเซรฟเวอร

รปท 410 เปดโปรแกรมเวบบราวเซอรและพมพ localhostphpmyadmin เพอท าการเขาสระบบ

ฐานขอมลภายในเครองจะปรากฏหนาตางใหใส ldquo ชอผใชrdquo และ ldquoรหสผานrdquo ทท าการตงไวตงแตตอนลง โปรแกรม โดยชอผใชจะเปน ldquorootrdquo สวนรหสผานนนเปนรหสทตงขน ในรปภาพท 47 กรณทลมรหสผาน ใหท าการลบโปรแกรม Appserv ออก แลวท าการตดตงใหม

56

รปท 411 เมอเขาสระบบเรยบรอยแลว ใหพมพ ldquoPersonality Developmentrdquo ลงในชองการสราง ฐานขอมลใหม จากนน คลก ldquo สรางrdquo เพอท าการสรางโฟลเดอรฐานขอมลขนมา พมพ ตามตวอกษรทใหไว หามมตวใหญหรอพมพตกหลนเดดขาด

รปท 412 เมอท าการกด สราง และปรากฏชอ แสดงวาไดสรางโฟลเดอรของฐานขอมลเรยบรอย

แลว คลกเลอกท ldquoImportrdquo จากนน คลก ldquo เลอกไฟล rdquo เพอท าการน าฐานขอมลของโปรแกรมมาลงภายในเซรฟเวอรของเครอง

57

รปท 413 เมอคลกปม เลอกไฟล จะปรากฏหนาตางขน ใหท าการเปดโฟลเดอร ProgramWeb ทลง ไวในเครอง จากนนเลอกไฟล pd(1)sql แลวกด Open เพอท าการเลอกไฟล

รปท 414 หลงจากท าการเลอกไฟลเสรจแลว ใหกดปม ldquo ลงมอ rdquo เพอน าฐานขอมลของโปรแกรม เขาสเซรฟเวอร

58

รปท 415 เมอน าฐานขอมลของโปรแกรมเขาสเซรฟเวอรเรยบรอยแลว จะปรากฏตารางของฐาน ขอมล ประกอบไปดวย 2 ตาราง คอ ตางราง Login และ ตาราง Test ดงภาพ ซงเปนอน เสรจสมบรณในการตดตงระบบฐานขอมล

รปท 416 ไปทไดรฟ C จากนนเปดโฟลเดอร Appserv แลว ดบเบลคลกทโฟลเดอร www

59

รปท 417 ใหท าการคดลอกไฟลงานของโปรแกรม ไปวางไวในโฟลเดอร www

รปท 418 เมอท าการคดลอกไฟลงานไปใสไวในโฟลเดอร www แลว จะสามารถ Run โปรแกรมผาน Appsevr ได

60

45 วธการใชงานเวบไซต

รปท 419 เปดโปรแกรมเวบบราวเซอรและพมพ localhost ProjectIndexphp ทงชอโฟลเดอรและชอไฟลงาน ตองตรงกนกบชอทตงไวใน โฟลเดอร www

หนาเวบตางๆของเวบไซตขายเสอผามอสองออนไลน แสดงหนาจอรปท 1 หนาเขาสเวบไซต ( Index )

รปท 420 แสดงหนาจอรปท 2 หนาหลก

61

รปท 421 แสดงหนาจอรปท 2 แสดงหนาสนคา

รปท 422 แสดงหนาจอรปท 3 แสดงหนาผจดท า

62

รปท 423 แสดงหนาจอรปท 4 แสดงหนาLogin

รปท 424 แสดงหนาจอรปท 5 แสดงหนาสมครสมาชก

บทท 5 สรปผลการท าโครงการ

51 สรปผลโครงการ

1 ไดเวบไซตทผศกษานนมความรความเขาใจเกยวกบเวบไซตเสอผามอสอง 2 ไดเวบไซตทผใชสามารถเขาเวบไซตเกยวกบเสอผามอสอง 3 ไดเวบไซตทผใชเวบไซตสามารถลอกอนเขาระบบไดจรง 4 ไดเวบไซตทผใชนนสามารถเผยแพรเวบไซตเกยวกบการขายเสอมอสอง

511 สรปขนาดของโปรแกรม ท ชอไฟล ขนาดของไฟล หมายเหต 1 Index 8 KB หนาแรกของเวบไซต 2 Home 6 KB หนาหลกของเวบไซต 3 Login 6 KB หนาเขาสระบบ 4 register 7 KB หนาสมครสมาชก 5 Order 9 KB หนาสนคา 6 Contact 3KB หนาตดตอเรา

ตารางท 51 แสดงขนาดของโปรแกรม

512 สรปขอผดพลาดทมตอการออกแบบระบบงาน

1 Banner ไมเคลอนไหวตองออกแบบและแกไขใหม 2 โครงสรางโปรแกรมบางสวนมขนาดไมเหมาะสมและดไมเขากบเนอหา 3 พนหลงของโปรแกรมเรยบเกนไป ท าใหดไมนาสนใจ จงตองเพมเตมลวดลายใหม

64

513 สรปขอผดพลาดทมในโปรแกรม 1 โคดปญหาไมสามารถ Run ได โคดทบซอนกนเปดไมตด

2 รปภาพในเวบไซตไมมแสดง ตองหารปภาพใหมมาแกไข 3 ตวอกษรในเวบไซต มขนาดเลกใหญไมเทากน

4 ไฟลโปรแกรมชอบ Link สลบกนไปมา 5 เชอมฐานขอมลส าเรจ แตไมสามารถเรยกใชงานได 6 ฐานขอมลไมจดจ าขอมลทท าการปอนคาเขาไป 7 เมอน าฐานขอมลไปเชอมตอกบเครองเซฟเวอรอน จะมฐานขอมลซ ากนท าใหขอมลไม ตรงกนกบโปรแกรม 8 ปมตวอกษรบางตวมภาพและสทคลายคลงกบพนหลงโปรแกรมท าใหไมคอยชดเจน

52 ปญหาและอปสรรคในการด าเนนงาน 1 คอมพวเตอรมอาการช ารด หนาจอคาง ตองเปลยนมาใช Note Book ในการท างานแทน

2 โปรแกรม Adobe Dreamweaver CC 2018 มปญหาระหวางใชงาน เชน เกดอาการคาง 3 แบงเวลางานไมด ท าใหโปรแกรมเสรจชาและไมสมบรณเทาทควร

65

53 สรปการด าเนนงานจรง

รายการ มถนายน 61 กรกฎาคม 61 สงหาคม 61 กนยายน 61

ระยะเวลา 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

อบรมการท าโครงการนกศกษา ปวช3 และปวส2

29-30 มถนายน 61

เสนอหวขอ ATC01โครงการ รอบท 1 (บทท1)

3-7 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 1

14 กรกฎาคม 61

เสนอหวขอโครงการ รอบท 2 (บทท1)

17-20 กรกฎาคม 61

ประกาศผลหวขอโครงการ รอบท 2

21 กรกฎาคม 61

สงบทท 2

24-28 กรกฎาคม 61

สงบทท 3

31 กค ndash 20 สค 61

สอบหวขอโครงการ

9 กนยายน 61

สงความคบหนา 70

18-22 กนยายน 61

สงความคบหนา 80

25-29 กนยายน 61

รายการ พฤศจกายน 61 ธนวาคม 61 มกราคม 62 กมภาพนธ 62

หมายเหต 1 2 3 4 5 1 2 3 4 1 2 3 4 1 2 3 4

สงความคบหนา 100

1-10 พฤศจกายน 61 เปนตนไป

สอบโปรแกรม ระดบปวส2

4 พฤศจกายน 2561

สอบโปรแกรม ระดบ ปวช3

11 พฤศจกายน 2561

สงบทท 4

6-16 ธนวาคม 61

สงบทท 5

16-20 มกราคม 62

สงรปเลม ซด และคาเขาเลม

23 มกราคม ndash 14 กมภาพนธ 2562

ตารางท 52 สรปเวลาการด าเนนงานจรง หมายเหต เสนสด า คอ ระยะเวลาทก าหนด เสนสแดง คอ ระยะเวลาในการด าเนนงานจรง

66

54 สรปคาใชจายในการด าเนนการจรง

ล าดบ รายการ จ านวน ราคา (บาท) 1 กระดาษDouble A A4 2 รม 240 2 หมกเครอง Printer สด าแดงน าเงนเหลอง 1 ชด 900 3 คาเยบเลมเอกสาร 1 เลม 250 4 คาเดนทาง - 500 รวมเปนเงน 1890

ตารางท 53 สรปคาใชจายในการด าเนนงานจรง

67

บรรณานกรม จระพงษ โพพนธ (2559) Dreamweaver คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpswwwkrui3comcontentdreamweaver ฐดารตน ชนธงชย (2559) Photoshop คออะไร คนขอมลวนท 16 ตลาคม 2561

จาก httpssitesgooglecomsitecombnwphotoshop-khux-xari ดนภพ พงคส (2559) สอนการท าเวบไซต HTMLและ Microsoft SQLServer คนขอมลวนท

19 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=nFDNEqBHbh4 ดนภพ พงคส (2559) สอนสรางตะกราสนคา PHP ใน Dreamweaver CS6 คนขอมลวนท

20 ตลาคม 2561 จาก httpswwwyoutubecomwatchv=vnu1DtjkjX0 น าฝน มานะกจ และสพศตรา พงสขแดง (2559) โครงการขายสนคาออนไลนประเภทสนคา

เครองประดบแฟชน หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

บรษท แอมทบมารเกตตง (2559) E-Commerce คออะไร คนหาขอมล วนท 17 ตลาคม 2561 จาก httpswwwam2bmarketingcothweb-development-article

รชกฤช วรภญโญภาส และภาสกร นชเทยน (2561) โครงการขายเสอผามอสองออนไลนหลกสตร ประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

สถาพร ผวด า และเอกรตน วงษจอม (2559)ระบบขายสนคาออนไลนประเภท รานออ รานออมวสค หลกสตรประกาศนยบตรวชาชพชนสง (ปวส)สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

โสภดา แยมโสพศ และเสาวรส งามขา (2559)ระบบขายสนคาผานเวบไซต ประเภทสนคาผาไหม ไทย หลกสตรประกาศนยบตรวชาชพชนสง(ปวส)สาขาวชาคอมพวเตอรธรกจวทยาลยเทคโนโลยอรรถวทยพณชยการ

Purinut Thongsakul (2557) AppServ คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httppurinutzabablogspotcom201402appservhtml

Wipaporn Perry (2560) Database คออะไร คนขอมลวนท 16 ตลาคม 2561 จาก httpsmindphpcomคมอ73-คออะไร2055-database-คออะไร23html

Woraphan Pagulanon (2561) ทฤษฏสวงจรสเทคนคในการใชสคนขอมลวนท 22 ตลาคม 2561 จาก httpswwwjammerstudiocomsingle-post

ภาคผนวก - ใบเสนอขออนมตการท าโครงการระบบคอมพวเตอรธรกจ (ATC01) - ใบอาจารยทปรกษารวม (ATC02) - ใบขอสอบปองกนโครงการระบบคอมพวเตอรธรกจ (ATC03) - รายงานความคบหนาโครงการระบบคอมพวเตอรธรกจ (ATC04) - ใบบนทกการเขาพบอาจารยทปรกษาโครงการ (ATC05)

73

ประวตผจดท ำ นายรชกฤช วรภญโญภาส เกดเมอว นท 20 กรกฎาคม 2541 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนบญวฒนาเมอปการศกษา 2556 จบการศกษาหลกสตรประกาศนยบตรวชาชพ(ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลย อรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศยอย 34 ซลวนเจออนสรณ1 แขวง บางนา เขต บางนา จกรงเทพมหานคร 10260 เบอรโทรศพท 080-0601400 E-mail Nurserykillergmailcom Line ID Nurserytubaband

นายภาสกร นชเทยน เกดเมอวนท 26 พฤษภาคม 2542 ส าเรจการศกษาชนมธยมตอนตนจากโรงเรยนนครบางยางพทยาคม เมอปการศกษา 2554 จบการศกษาหลกสตรประกาศนยบตรวชาชพ (ปวช)สาขางานคอมพวเตอรธรกจ ทวทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2559 ปจจบนก าลงศกษาในระดบประกาศนยบตรวช าชพช น สง (ปวส) ท วทยาลยเทคโนโลยอรรถวทยพณชยการ ปการศกษา 2561 ปจจบนอาศย อยบานเลขท 20429 แขวงบางนา เขตบางนา จกรงเทพฯ 10260 เบอรโทรศพท 098-5307050 E-mail passagon2542gmailcom Line ID 0847047046

ATCOI

orcruoo4fifi rirlnrcnrrvuf norufiarno

crrrisrnorufi rrerofq fi o

iyr srdurm fl lulaEs niyrdfl fi sunr-id-tuyt 2 lftou ftrfifl1ail fr2561

rior rorauooqfrfifirln-rnrsulnorufileroiqrfin

rSuu JysrunrunrfirrmourT6virInrrryilunorufirnorfio

drnrr t uruirnqv rfiqlqnra rTarinfins rux zvduil rtztq

2 ulrJRldR qslyruu riarinfinsr 36848 zsffit illru+

fi Er r r ru il v a rifi r In r nr s u r n o rufi rm o fu fr r rh s rn yr rt u lryd E-commerce

dolnrnrnrurlnu rdofirfioasrui$o [FrnlRtulolnqu Second hand clothes

Iqflfi orridfirJfnurndn 6o ormtlurnrf rirrlvy iurgt t

uiorufr [6uurronarilvnoilflrtorduolnrnrsrLunorufirrnof uvrfi t firuau t ryrr

4distaa0 t uutJl[T0 tiliailtlat10rila

uroffuliuih1 raiilUl f -rin dn s r

(uroivnqv rfiqlcgnray

rirrrirnru1aflr

I hu

46rs0

qdfrlufl alHun0Js n u fl l

nasflriRl ftgrlv ft5lt Rt

68

rduo o1o rrrifi rji nu r iauln R 1

nsu tcunlcY

Aqsryruu

ATC02

iI

aaadlfl 151nOilYrnOqnr

ivr urdurnn lu In6o nfl dil nr^vun rqdAuYr 14 dfilnil Tf2561

Ato

TU1J

4 a dt i rlt r lJ 0r uurssu0l 01u[lJuvtrJ rRU 1 il ln snr

aao101ufl1I d1lRrJ

drnrflr t uuirnqfl

2 uluflldn

aearTarInfrnul 35628 zzdu il1d 2t4

n-afnfrnul 36848 zvdn il1d zt+

d r J 4-- a dqa q dr jlunrrruilsarriosrorEuilrfrq o101rJfrvr duriu rurrflufiilinurjrrulnn1rondil

Ernrflr dcldfndrlnnlilvrflyr E-commr dolnrn1nlurulmu rdofirfioaor-ct r

rnr5orufr [rirruilrondlilsfl orJfl trduoriroJn n1iltdu

4-4 i s r a a0ttu tJltY0 tlj9t1I 01il1oUtjgt

a r u fi o do ffnqd aafi U[ orf- rin f n u r 4unflnu1

dAaluiloso

(uruirnqu rfiqlqnray (urunrcn r1nfrou

ffirrtifrrjfnuriru(orordfiin arilriu)

70

ATC03

ขอสอบโครงการระบบคอมพวเตอร

สาขาวชาคอมพวเตอรธรกจ วทยาลยเทคโนโลยอรรถวทยพณชยการ

วนท 22 เดอนสงหาคม พศ 2561 เรอง ขอสอบโครงการระบบคอมพวเตอรธรกจ (ครงท 1) เรยน คณะกรรมการพจารณาการสอบปองกนโครงการระบบคอมพวเตอรธรกจ ขาพเจา 1 นายรชกฤช วรภญโญภาส รหสนกศกษา 35628 ระดบ ปวส 24 2 นายภาสกร นชเทยน รหสนกศกษา 36848 ระดบ ปวส 24 มความประสงคท าโครงการระบบคอมพวเตอรธรกจ ประเภท เวบไซต E-commerce ชอภาษาไทย เสอผามอสอง ชอภาษาองกฤษ Second hand clothes โดยม อาจารยทปรกษาหลก คอ อาจารยนราภรณ บวนช อาจารยทปรกษารวม คอ อาจารยศรพร สงบภย พรอมนไดแนบเอกสารประกอบการขอสอบโครงการระบบคอมพวเตอร โปรแกรมระบบคอมพวเตอร (Software) จ านวน 1 ชด โครงการระบบคอมพวเตอรธรกจ (เอกสารบทท 1-3) จ านวน 1 ชด จงเรยนมาเพอโปรดพจารณาอนมต ----------------------------------------------------------------------------------------------------------------------------- -------- ลายมอชอนกศกษา (นายรชกฤช วรภญโญภาส) หวหนากลมโครงการ

Tl

ATCt4

luriuiinrsqrunrrufiumdr ororcldrjeuronsrnfrn uarororddileuronsriaru

Inrnr rdeutoaor

Secondhand clothes

drJeuronsttdnlnRr orord urnaf rirrlrdrjeuroncrdailInrrRr orrrtl ffin cufrfl

alnil tl00lt iurrdourfl riltaloltSlluRurrofl ororrddrJinuril

nrnriuufi t2561

I rauofirolnnl orfi t AprptuQ wt2 rirroncrumfi t lhratubt ldlaJ rironarilnft z lkafithl Ndu4 riqrsnarumfi g Lbtffitb-4 L 5

r2dttofldl [[0U PowerPoint tfrOnroiutlfluo r0ncflSuytYt I - 3

ftr2th (

nrnfiuufi 2256r

6 ri6nn rrJ rlnruIa n17 7 o 22rffirh1 Wr -K7 cffiuildrlilunrulnrnr 80 0rarkI vo 68 rir n^unrJrhJ rrnu In nr loo tt11tbt v( A9 rironar uns 1lunilln nr

rfronrf rnuo lilnnrulnqnr7riLithl r

t0 ciIilunrulnrnrj 9u s erdyrttfr lljlra (eurotltJ)

Lr-41ru

(

lt eimnarrvrfi + 912t11 WT2 cisronaruyrfi s zErALt61 ty13 rir ro nar grJ reiru nrTuarur oi 9rrtr12 Wt4

raddcr9t iltokbZ +( t

15or9tT13n1rtuail Qrrh rtu

77

luriuiinnrrilnnu or orrdfi rteurouot

It1tillt1 l ulucunqs rfiolanra

2 u1CIRldfl

aaladl tt s1 no ilv lsr o R t

assqltadalltJmutTn [u tnuo BYtuilarsuRl

rmiufr t

riarinfinul 35628 sudy iru+

rierindnur 36848 zxdv illretu+

UqU

dillJRU

q$rYruu

In r nr rJc rnvr fi r tryd E-commercei C r[o1 lfloFtluodo

airlt v J Ior0ttJytlJflu1lan o1tluu1RBt

lA ta r aa0lt1uvlilnu1u oltltff1t5

nvt uytv9

1tt0fllt11111d

aJtqu tut8lilq

4 4 blotlba Sroan ffiNhnr4 L6u2 46lAl L4 Saeansrnm t^ MVq 4btffi I b4 haannnmd 1 4--

4^ 27-lo4lt4 hanttdtrvrirvnonrr tzq 7 t41164 3a an t t ffrv rirfireon 6]rv ( W6 4L[rtrllt4 FrtnrrrtttestJvseil lF1 211471b4

(i)crrnitnrrYrfra 0

q 2Tl4Llt4 ilnansrvtrJ tr

72

  • 1 ปกโครงการ
  • 2 หนาอนมตเลม
  • 3บทคดยอ
  • 4กตตกรรมประกาศ
  • 5 คำนำ
  • 6 สารบญ
  • 7สารบญ รป
  • 8 สารบญ ตาราง
  • 9 บทท-1
  • 10 บทท-2
  • 11 บทท-3
  • 12 บทท-4
  • 13 บทท-5
  • 14 บรรณานกรม
  • 15 ภาคผนวก
  • 16ประวตผจดทำ
  • ATC-01
  • ATC-02
  • ATC-03
  • ATC-04
  • ATC-05
Page 14: Website E-commerce Second hand clothes
Page 15: Website E-commerce Second hand clothes
Page 16: Website E-commerce Second hand clothes
Page 17: Website E-commerce Second hand clothes
Page 18: Website E-commerce Second hand clothes
Page 19: Website E-commerce Second hand clothes
Page 20: Website E-commerce Second hand clothes
Page 21: Website E-commerce Second hand clothes
Page 22: Website E-commerce Second hand clothes
Page 23: Website E-commerce Second hand clothes
Page 24: Website E-commerce Second hand clothes
Page 25: Website E-commerce Second hand clothes
Page 26: Website E-commerce Second hand clothes
Page 27: Website E-commerce Second hand clothes
Page 28: Website E-commerce Second hand clothes
Page 29: Website E-commerce Second hand clothes
Page 30: Website E-commerce Second hand clothes
Page 31: Website E-commerce Second hand clothes
Page 32: Website E-commerce Second hand clothes
Page 33: Website E-commerce Second hand clothes
Page 34: Website E-commerce Second hand clothes
Page 35: Website E-commerce Second hand clothes
Page 36: Website E-commerce Second hand clothes
Page 37: Website E-commerce Second hand clothes
Page 38: Website E-commerce Second hand clothes
Page 39: Website E-commerce Second hand clothes
Page 40: Website E-commerce Second hand clothes
Page 41: Website E-commerce Second hand clothes
Page 42: Website E-commerce Second hand clothes
Page 43: Website E-commerce Second hand clothes
Page 44: Website E-commerce Second hand clothes
Page 45: Website E-commerce Second hand clothes
Page 46: Website E-commerce Second hand clothes
Page 47: Website E-commerce Second hand clothes
Page 48: Website E-commerce Second hand clothes
Page 49: Website E-commerce Second hand clothes
Page 50: Website E-commerce Second hand clothes
Page 51: Website E-commerce Second hand clothes
Page 52: Website E-commerce Second hand clothes
Page 53: Website E-commerce Second hand clothes
Page 54: Website E-commerce Second hand clothes
Page 55: Website E-commerce Second hand clothes
Page 56: Website E-commerce Second hand clothes
Page 57: Website E-commerce Second hand clothes
Page 58: Website E-commerce Second hand clothes
Page 59: Website E-commerce Second hand clothes
Page 60: Website E-commerce Second hand clothes
Page 61: Website E-commerce Second hand clothes
Page 62: Website E-commerce Second hand clothes
Page 63: Website E-commerce Second hand clothes
Page 64: Website E-commerce Second hand clothes
Page 65: Website E-commerce Second hand clothes
Page 66: Website E-commerce Second hand clothes
Page 67: Website E-commerce Second hand clothes
Page 68: Website E-commerce Second hand clothes
Page 69: Website E-commerce Second hand clothes
Page 70: Website E-commerce Second hand clothes
Page 71: Website E-commerce Second hand clothes
Page 72: Website E-commerce Second hand clothes
Page 73: Website E-commerce Second hand clothes
Page 74: Website E-commerce Second hand clothes
Page 75: Website E-commerce Second hand clothes
Page 76: Website E-commerce Second hand clothes
Page 77: Website E-commerce Second hand clothes
Page 78: Website E-commerce Second hand clothes
Page 79: Website E-commerce Second hand clothes
Page 80: Website E-commerce Second hand clothes
Page 81: Website E-commerce Second hand clothes
Page 82: Website E-commerce Second hand clothes
Page 83: Website E-commerce Second hand clothes
Page 84: Website E-commerce Second hand clothes