อบรมเชิงปฏิบัติการ

1. อบรมเชิงปฏิบัติการ การพัฒนาเว็บเพจ 23 – 25 พฤษภาคม 2552

2. ประเภทที่ 1 Static Web เป็นการเขียนเว็บไซต์แบบธรรมดา ใช้บราวเซอร์เรียกเว็บเพ็จที่สร้างด้วยภาษา HTML ล้วนๆ หรืออย่างมากก็มีสคริปต์ทางฝั่งไคลเอนต์ (Client-side Script) อย่าง JavaScript, VBScript หรือใช้ภาษา Java Applet ซึ่ง Static web ส่วนมากนิยมในหมู่นักเรียนนักศึกษาในการสร้างโฮมเพจส่วนตัว หลังจากทำเสร็จจะทำการอัพโหลดข้อมูลไปยังเว็บไซต์ที่ให้บริการพื้นที่เก็บเว็บฟรี เช่น www.geocities.com,www.Thai.net

3. ประเภทที่ 2 Dynamic Web พัฒนาต่อมาจากยุคที่ 1 มีการใช้สคริปต์ทางฝั่งเซิร์ฟเวอร์ (Server-side Script) มาช่วยในการเพิ่มความสามารถของเอกสาร HTML ในการติดต่อกับองค์ประกอบอื่นๆ ทางฝั่งเซิร์ฟเวอร์ อย่างฐานข้อมูล หรืออาศัยพลังในการประมวลผลของเว็บเซิร์ฟเวอร์เพื่อทำงานบางอย่าง เช่น Web board, Guestbook, Chat Room, Webmail เทคโนโลยีในการพัฒนาเว็บแบบไดนามิกในช่วงแรกคือ CGI (Common Gateway Interface) ภาษาที่ใช้เขียนสคริปต์นี้เช่น C, Perl เป็นต้น ต่อมาได้มีเทคโนโลยีต่างๆ เกิดขึ้นมาอีกมากมาย ซึ่งทำงานในฝั่งของเซิร์ฟเวอร์เช่นเดียวกับ CGI นั่นก็คือ ASP (Active Server Pager) ของไมโครซอฟต์, JSP(Java Server Page) ที่ใช้ภาษา Java ในการพัฒนา และ PHP (PHP Hypertext Preprocessor) ซึ่งเป็นเทคโนโลยีที่ได้รับความนิยมอย่างแพร่หลายในปัจจุบัน

4. HTTP SQL Web Browser : Web Server : Database : • Apache • IIS • MySQL • PostgreSQL • Microsoft SQL Server • Internet Explorer • Netscape / Mozila / Firefox • Opera Language : • ASP • PHP • JSP หลักการเบื้องต้นเกี่ยวกับ Web Site DataBase

5. ประเภทของเว็บแยกตามหน้าที่ประเภทของเว็บแยกตามหน้าที่ • งานประชาสัมพันธ์ (Advertise) • แหล่งข้อมูล (Data resource) • คลังภาพ (Gallery) • ดาวน์โหลด (Download) • กระดานข่าว (Web board) • สนทนา (Chat)

6. ประเภทของเว็บแยกตามหน้าที่ (ต่อ) • E-commerce • Search engine • Poll online • Quiz online • Game online

7. Content Management System (CMS) CMS คือ ตัวจัดการเว็บไซต์ใช่หรือไม่?? ใช่ ถ้าจะพูดอย่างนั้นก็ได้ CMS ย่อมาจาก Content management system ซึ่งแปลตามศัพท์ก็คือ ระบบบริหารจัดการเนื้อหา เนื่องจากตัว CMS นี้เป็นระบบดังนั้นจึงถูกสร้างขึ้นมาโดยภาษาใดๆ ก็ได้ ไม่ว่าจะเป็น PHP, ASP, Java, Python ฯลฯ ก็แล้วแต่ว่าผู้ที่สร้างนั้นจะใช้ภาษาอะไร ซึ่งการสร้างCMS นั้นก็มีจุดประสงค์ทั้งที่สร้างขึ้นมาใช้งานเอง และสร้างขึ้นมาแล้วทำการเผยแพร่ให้คนอื่นๆใช้งานด้วย ฉะนั้น CMS แบบหลังนี้จะมีลักษณะเป็น Open Source และกำลังได้รับความนิยมมากขึ้น และจะเป็นภาษา PHP เนื่องจากเป็นภาษาที่ฟรีนั่นเอง

8. HTML (HyperText Markup Language) • HTML (HyperText Markup Language)เป็นภาษาหลักของเวิร์ลไวด์เว็บ (WWW เป็นบริการหนึ่งที่ใช้ในอินเตอร์เน็ต) ปัจจุบันมาตรฐาน HTMLถูกดูแลภายใต้องค์กร W3C (http://www.w3c.org) • แต่เดิม HTMLถูกใช้สำหรับสร้างทุกส่วนประกอบของเว็บเพจ ตั้งแต่การกำหนดสี สร้างเฟรม สร้างตาราง สร้างฟอร์ม กำหนดขนาดอักษร ฯลฯ แต่ปัจจุบันมาตรฐาน HTMLถูกปรับแต่งใหม่ให้ทำหน้าที่อย่างจำกัดมากยิ่งขึ้น โดยมุ่งเฉพาะการกำหนดโครงสร้างของเว็บเพจเท่านั้น เช่น การกำหนดส่วนหัว HEADและ BODYหรือ การสร้างตัวเชื่อม (นิยมเรียกกันว่าลิงค์) เป็นต้น

9. PHP

10. Introduction PHP PHP เป็นภาษาจำพวก scripting languageคำสั่งต่างๆ จะเก็บอยู่ในไฟล์ที่เรียกว่า สคริปต์ (script) และเวลาใช้งานต้องอาศัยตัวแปลชุดคำสั่ง ตัวอย่างของภาษาสคริปต์ก็ เช่น JavaScript, Perl เป็นต้น

11. Introduction PHP (ต่อ) ลักษณะของ PHP ที่แตกต่างจากภาษาสคริปต์แบบอื่นๆ คือ PHP ได้รับการพัฒนาและออกแบบมา เพื่อใช้งานในการสร้างเอกสารแบบ HTML โดยสามารถสอดแทรกหรือแก้ไขเนื้อหาได้โดยอัตโนมัติ ดังนั้นจึงกล่าวว่า PHP เป็นภาษาที่เรียกว่า server-side หรือ HTML-embedded scripting language เป็นเครื่องมือที่สำคัญชนิดหนึ่งที่ช่วยให้เราสามารถสร้างเอกสารแบบ Dynamic HTML ได้อย่างมีประสิทธิภาพและมีลูกเล่นมากขึ้น เนื่องจากว่า PHP ไม่ได้เป็นส่วนหนึ่งของตัว Web Server ดังนั้นถ้าจะใช้ PHP ก็จะต้องดูก่อนว่า Web server นั้นสามารถใช้

12. Introduction PHP (ต่อ) ลักษณะเด่นของ PHP • ใช้ได้ฟรี • PHP เป็นโปรแกรมวิ่งข้าง Sever ดังนั้นขีดความสามารถไม่จำกัด • PHP รันบนเครื่อง UNIX , Linux , Windows ได้หมด • เรียนรู้ง่าย เนืองจาก PHP ฝั่งเข้าไปใน HTML และใช้โครงสร้างและ ไวยากรณ์ภาษาง่ายๆ • เร็วและมีประสิทธิภาพ โดยเฉพาะเมื่อใช้กับ Apache Server เพราะไม่ต้องใช้โปรแกรมจากภายนอก

13. Introduction PHP (ต่อ) • ใช้ร่วมกับ XML ได้ทันที • ใช้กับระบบแฟ้มข้อมูลได้ • ใช้กับข้อมูลตัวอักษรได้อย่างมีประสิทธิภาพ • ใช้กับโครงสร้างข้อมูลใช้ได้แบบ Scalar , Array , Associative array • ใช้กับการประมวลผลภาพได้

14. What is AppServ? • ทำความรู้จักกับ AppServ • AppServ คือ โปรแกรมที่รวบรวม packages ต่างๆที่เกี่ยวกับการใช้งานเว็บ เพื่อให้ผู้ใช้สะดวกในการติดตั้ง และสามารถนำไปใช้งานได้ทันที • AppServ ประกอบด้วย • Apache Web Server • MySql Database • PHP Script Language • phpMyAdminระบบ frontend จัดการ MySql

15. What is AppServ? • เวอร์ชั่น AppServ 2.4.3 ประกอบไปด้วยdownload http://www.appservnetwork.com/thai/index.php PHP 4.3.10 http://www.php.net Apache 1.3.33 http://www.apache.orgMySQL 4.1.8 http://www.mysql.comZend Optimizer 2.5.7 http://www.zend.com/store/products/zend- optimizer.php phpMyAdmin 2.6.1-rc1 http://www.phpmyadmin.net

16. What is AppServ? • เวอร์ชั่น AppServ 2.5.10 ประกอบไปด้วย • Apache 2.2.8 http://www.apache.org • PHP 5.2.6 http://www.php.net • MySQL 5.0.51b http://www.mysql.com • phpMyAdmin-2.10.3 http://www.phpmyadmin.net • Download Sourceforge.net :http://prdownloads.sourceforge.net/appserv/appserv-win32-2.5.10.exe?download

17. AppServ Installation - 1 • Download ไฟล์จาก http://www.appservnetwork.comซึ่งจะมีชื่อ file ดังนี้ appserv-win32-x.y.z.exe • Win32 คือ ใช้ได้เฉพาะ windows 32 bit ขึ้นไป ก็คือใช้ได้ตั้งแต่ Windows 98 • x และ y คือ Version ที่มีการเปลี่ยนแปลงหลัก • z คือ Version ที่มีการเปลี่ยนแปลงเล็กน้อย • เริ่มทำการ Setup

18. AppServ Installation - 2 • เลือก path ที่จะติดตั้ง program • เลือก setup type ในที่นี้จะเลือกแบบ custom • เลือก Component ที่จะติดตั้ง (เฉพาะ custom) • กำหนด ข้อมูลของ Apache • Server Name : เป็นชื่อที่ใช้ในการติดต่อ • Admin email : email ของผู้ดูแลระบบ • Http port : port สำหรับ apache โดย default แล้ว http จะใช้ port 80

19. AppServ Installation - 3 • กำหนด ข้อมูลของ MySql • Username กับ Password จะใช้สำหรับ Start ระบบ MySqlไม่ใช่ user ที่ใช้ในการติดต่อกับ MySql • การสร้าง User ที่จะใช้ในการติดต่อกับ MySqlจะใช้ผ่าน Grant ซึ่งจะมีการพูดถึงอีกทีหลังจากติดตั้งเสร็จแล้ว • Charsetกำหนด ตัวอักษรหลักที่ใช้ในการเก็บข้อมูล ถ้าเป็น ภาษาไทย แนะนำให้ใช้ tis-620 • เริ่มทำการติดตั้งโปรแกรม

20. AppServ Installation - 4 • ตรวจเช็คว่า Server ทำงานถูกต้องหรือไม่ โดย ดูจากการเปิด Port Command> netstat –an • Port ที่ใช้งาน • tcp80 -> Apache • tcp 3306 -> MySql

22. ติดตั้งระบบเพื่อใช้ในการพัฒนาWeb-based Application ด้วยภาษา PHP (2) • ทดสอบ Apache Web Server • เปิดเว็บไซต์ http://localhost/ • ทดสอบ PHP • เปิดเว็บไซต์ http://localhost/phpinfo.php • ทดสอบ MySQL Database และphpMyAdmin • เปิดเว็บไซต์ http://localhost/phpMyAdmin/

23. ทดลอง Script แรก ในการเขียน Script PHP เมื่อเขียนเสร็จแล้ว ให้นำ Script ไปวางไว้ใน Path ของ Server ซึ่ง Path ของ Server จะอยู่ที่ C:\AppServ\www 23

24. ใช้โปแกรม Notepad หรือ editor สร้างเอกสาร PHP โดยมีคำสั่งดังนี้ <html><title>ทดสอบ Script แรก</title><body><?phpecho" สามารถเขียน PHP ได้แล้วครับ ";?></body></html>

25. Save As Test1.php

27. จากนั้นให้ Runhttp://localhost/test1.php

28. รูปแบบของภาษา PHP จัดเป็นภาษาสคริปต์ภาษาหนึ่งที่ดำเนินที่ฝั่งเซิร์ฟเวอร์ ( Server-side )คือเมื่อโค้ดถูกเรียกใช้โดยบราวเซอร์ โปรแกรม PHP ที่อยู่ในเครื่องที่เป็นเว็บเซิร์ฟเวอร์จะทำการประมวลผลแล้วสร้าง ( generate ) ผลลัพธ์ที่อยู่ในรูปของภาษา HTML ขึ้นแล้วจึงส่งมาให้กับเครื่องไคลเอ็นต์เพื่อให้บราวเซอร์แสดงผลลักษณะการเขียนสคริปต์จะเขียนแทรกไว้ภายในไฟล์ HTML โดยเปิดด้วยแท็ก<?PHP>หรือ<?หรือ <script language=”php”>และปิดด้วย ?>หรือ </script>

29. Q/A