วันอาทิตย์ที่ 22 กันยายน พ.ศ. 2556

What is jQuery เจคิวรี่ คืออะไร ?

ถ้าเพื่อนๆรู้จักภาษา JavaScript ก็คงจะเข้าใจเรื่องนี้ได้ง่ายมาก แต่ถ้าคนที่ยังไม่รู้ว่า JavaScript คืออะไร อันนี้ต้องคุยกันยาวเลย ผมขอข้ามไปก่อนก็แล้วกันนะครับ ผมคิดว่าคนที่ Search คำว่า jQuery ใน Google  นั้นอย่างน้อยจะต้องรู้จักกับภาษา JavaScript แน่นอน (บทความนี้จะยาวนิดหนึ่ง กดอ่านเพิ่มเติมที่  ”Continue Reading” ด้านล่างนี้ได้เลยครับ)คงมีอีกหลาย ต่อหลายคนที่ยังสงสัยว่า jQuery มันคืออะไร? ก็เลยปักหัวข้อนี้เอาไว้ก่อนเลย เวลาคนที่เข้ามาจากทาง Google และกำลังหาคำตอบจากคำว่า jQuery คืออะไร หรือ What is jQuery ? ก็จะได้เข้ามาอ่านกันตรงนี้ได้เลย จะได้หายสังสัยกันไปเลย
ภาษา JavaScript นั้นเกิดมานานพร้อมๆกับยุคแรกๆของ Internet แล้วละครับ เพื่อใช้ในการจัดการด้าน Client หรือการทำงานทางด้าน Browser นั้นเอง เราสามารถที่จะเขียนให้ Browser มันทำงานตามที่เราต้องการได้ สาเหตุที่ทำไมต้องเขียนโปรแกรมทางฝั่ง Browser ด้วยละ นั้นก็เพราะว่า พวกโปรแกรมทางด้าน Server Side นั้นไม่สามารถที่จะสั่งงาน Browser ได้โดยตรงครับ
ทำได้เพียงส่ง Script กลับมาให้ Browser ประมวลผล มันก็เลยถูกเรียกว่า ภาษา Script นั้นเอง เช่นเวลาคนเปิดเว็บอะไรสักเว็บหนึ่ง โปรแกรมทางด้าน Web Server มันก็จะส่ง Code HTML และ JavaScript นั้นกลับมาให้กับ Browser ของเรา จากนั้น Browser ของเรามันก็จะทำการประมวลผลครับ ถ้าเป็น Code HTML เราก็จะเรียกมันว่าการ Render หรือวาดภาพต่างๆที่เขียนจาก HTML อย่างเช่นแสดงรูปภาพ แสดงปุ่ม หรือ ตัวหนังสือต่างๆ ส่วนการจัดการแสดงผลเช่นสีหรือขนาด เราก็ใช้ Style Sheet จัดการอีกที
ตัวอย่าง Code HTML และ JavaScript ที่ Browser ของเราได้รับมา
พอ Browser ได้รับ Code จาก Web Server มาแล้วตามตัวอย่างด้านบน ก็ทำการประมวลผล พวก  HTML ธรรมดา ก็แสดงผลไปตามปกติ แต่พออ่านมาถึงบรรทัดของ JavaScript มันก็จะทำตามคำสั่งนั้น จากตัวอย่างเป็นการประกาศ Function init ขึ้นมา ตัว Browser มันก็เก็บลง Memory เอาไว้ว่ามี Function init() เอาไว้ให้เรียกใช้ได้นะ ส่วนจะเรียกใช้ตอนนั้นก็แล้วแต่เราจะเขียน ในตัวอย่างนี้ผมเขียนให้มันเรียกใช้ที่ Event onLoad ก็คือหลังจากที่ Browser มันโหลด DOM เสร็จแล้ว (ไม่รวมการโหลดรูปภาพจาก Tag IMG) มันก็จะทำการ เรียกใช้ Function init() ที่เราเขียนเอาไว้ขึ้นมาทันที ก็จะแสดง Popup ขึ้นมาครับ
ภาษา JavaScript นั้นเราจะต้องเขียนกันยืดยาวมาก และต้องรู้ทั้ง Event และสิ่งต่างๆอีกมากมายถึงจะสามารถเขียนได้ครบถ้วนกระบวนความ (ว่าไปนั้น) มันก็เลยเกิดคำถามขึ้นมาในหัวของ Developer ท่านหนึ่ง ว่า แล้วทำไมเราจะต้องเขียนอะไรที่มันยาวๆ แถมบางอันก็เขียนเหมือนเดิมด้วย ก็เลยเกิดไอเดียในการที่จะย่อทั้งคำสั่ง และ การใช้งานที่ง่ายขึ้นกว่าเดิม ไม่ต้องไปจำคำสั่งยากๆ เอาง่ายๆก็ทำงานได้แล้ว เช่น
แค่บรรทัดแรกเนี่ย ถ้าเขียนด้วย JavaScript เราจะเขียนกันได้ยืดยาวและยุ่งยากมากกกก แต่ jQuery JavaScript Framework ก็ช่วยทำให้ชีวิตเรานั้นง่ายขึ้น แค่เราจับ Object ที่เราต้องการจะทำงานกับมัน แล้วเอาไปต่อด้วย Function ต่างๆ มันก็สามารถที่จะทำงานได้ด้วยตัวของมันเอง จบและง่ายมาก

ส่วนที่ว่ามันจะง่ายแค่ใหน สั้นแค่ใหน ทำให้ชีวิตดีขึ้นแค่ใหนนั้น ผมว่าเพื่อนๆไปโหลดมาลองเล่น แล้วอ่านบทความในเว็บ jQuery.in.th นี้จะดีกว่า ลงมือทดลองกันไปเลย ง่ายๆ

มาทำความรู้จักกับ Macromedia Dreamweaver 8

โปรแกรม Macromedia Dreamweaver โปรแกรมสำหรับการสร้างเว็บเพจ บริหารจัดการเว็บไซต์ รวมไปถึงการพัฒนาเว็บแอปพลิเคชัน เนื่องจากตัว Dreamweaver มีความสามารถที่โดดเด่น ดังนี้ สามารถเขียนโปรแกรมสำหรับเว็บได้ทุกรูปแบบ เช่น ASP, ASP.Net, ColdFusion,JSP, PHP, XML, XHTML เมนูคำสั่งและเครื่องมือต่างๆ เรียกใช้งานได้ง่ายและสะดวกมีการปรับปรุงกลไกภายในให้มีประสิทธิภาพสูงขึ้น สามารถสร้างแอปพลิเคชันง่ายๆ โดยไม่จำเป็นต้องเขียนโปรแกรม สร้างเว็บเพจภาษาไทยได้ทันทีโดยไม่ต้องติดต้องโปรแกรมเสริมเพราะ Dreamweaver รองรับตัวอักษรแบบ Unicode
การเข้าสู่โปรแกรม Macromedia Dreamweaver 8
มีขั้นตอน คือ คลิกเลือก Start -> Program -> Macromedia -> Macromedia Dreamweaver 8 ในการเข้าสู่ระบบในครั้งแรกโปรแกรมจะถามรูปแบบการใช้งาน 2 รูปแบบ คือ
1. Designer หมายถึง การสร้างและออกแบบเว็บเพจโดยทั่วไป ส่วนมากนิยมเลือกรูปแบบนี้
2. Code หมายถึง วิธีการสร้างเว็บเพจที่เน้นการเขียนชุดคำสั่งเอง
 
(ข้อแนะนำ ในที่นี้ขอแนะนำให้เลือก Designer เพื่อง่ายต่อการทำความเข้าใจ)

ส่วนประกอบของหน้าต่างโปรแกรม Macromedia Dreamweaver 8
         โปรแกรม Macromedia Dreamweaver 8 มีองค์ประกอบของหน้าต่างโปรแกรม ดังต่อไปนี้
หน้าจอ Start Pageทุกครั้งเมื่อเปิดโปรแกรม Macromedia Dreamweaver 8 จะปรากฏหน้าจอเริ่มต้น (Start Page) สำหรับเปิดเอกสารเว็บเพจเดิมหรือสร้างเอกสารเว็บเพจใหม่ โดยทั่วไปแบ่งออกเป็น 3 กลุ่ม ดังต่อไปนี้
 
แต่ละส่วน มีรายละเอียด ดังต่อไปนี้
1. ใช้สำหรับเปิดไฟล์เอกสารเว็บเพจที่เคยใช้งานมาแล้ว (Open a Recent Item) เป็นส่วนแรกของหน้าจอเริ่มต้นใช้สำหรับเปิดงานที่เราทำค้างไว้ ซึ่งเลือกจากรายการชื่อที่แสดงอยู่ โดยโปรแกรมจะแสดงงานที่เปิดใช้บ่อยอยู่ด้านบน
2. การสร้างงานใหม่ (Create New) ในส่วนนี้เป็นการเลือกประเภทงานที่ต้องการสร้างใหม่ โดยเลือกประเภทไฟล์ต่างๆ ได้ เช่น HTML,PHP, ASP JavaScript, ASP VBScript, ASP.NET C#, ASP.NET VB, JSS, CSS หรือเลือกแบบฟอร์มอื่นๆ เป็นต้น
3. การสร้างงานตามแบบฟอร์ม (Create from Sample) เป็นสร้างเว็บเพจตามแบบฟอร์มที่โปรแกรมได้จัดไว้ให้แล้ว ซึ่งมีรูปแบบให้เลือกหลายประเภท

ส่วนประกอบของหน้าต่างโปรแกรม
         เมื่อเราเลือกประเภทการทำงานแล้ว (ในกรณีนี้ผู้สอนคลิกเลือก HTML จากส่วนของ Create New) จะปรากฏหน้าต่างการทำงานของโปรแกรม โดยมีรายละเอียดดังต่อไปนี้
 
1. แถบชื่อเรื่อง (Titlebar) เป็นส่วนที่ใช้แสดงชื่อโปรแกรม Dreamweaver 8 และชื่อไฟล์เอกสารเว็บเพจที่กำลังทำงานอยู่
2. แถบรายการคำสั่ง (Menu Bar) เป็นส่วนที่รวบรวมรายการคำสั่งการทำงานเอาไว้ สามารถเปิดรายการคำสั่งต่างๆ ขึ้นมาใช้งานโดยคลิกที่ชื่อรายการคำสั่งแล้วเลื่อนเมาส์ไปยังตำแหน่งที่ต้องการใช้งาน หากรายการคำสั่งใดมีรายการคำสั่งย่อยจะแสดงลูกศรอยู่มุมขวาของรายการ หากเลื่อนเมาส์ไปยังบริเวณดังกล่าว จะแสดงรายการคำสั่งย่อยเพื่อใช้งานต่อไป
3. แถบแทรก (Insert Bar) เป็นแถบที่ประกอบด้วยปุ่มคำสั่งที่ใช้ในการแทรกออบเจ็กต์หรือวัตถุต่างๆ ลงในเอกสารเว็บเพจ โดยแบ่งเป็นหมวดหมู่ มีรายละเอียดดังต่อไปนี้
Common เป็นชุดคำสั่งสำหรับแทรกออปเจ็กต์ที่เรียกใช้งานบ่อยๆ ในการสร้างเว็บเพจ เช่น รูปภาพ กราฟิก ตาราง ไฟล์มีเดีย เป็นต้น
 
Layout สำหรับเลือกมุมมองในการสร้างเว็บเพจ เช่น มุมมองปกติ มุมมองแบบขยาย เพื่อให้เห็นออปเจ็กต์ต่างๆ ได้อย่างชัดเจน
 
Forms ใช้สำหรับแทรกออปเจ็กต์ที่ใช้สร้างแบบฟอร์มรับข้อมูลจากผู้ชม เช่น ช่องรับข้อความ และฟิลด์ (Field) ชนิดต่างๆ
Text สำหรับจัดรูปแบบข้อความในเว็บเพจ เช่น หัวเรื่อง ตัวหนา ตัวเอียง จัดหัวข้อ จัดย่อหน้า และแทรกสัญลักษณ์พิเศษต่างๆ
Application สำหรับแทรกคำสั่งและการดึงข้อมูลจากฐานข้อมูลมาแสดงบนเว็บ
 
Flash element สำหรับนำไฟล์ Flash เข้ามาใช้งาน
 
 Favorite สำหรับจัดเก็บออบเจ็กต์ที่ชอบเพื่อความสะดวกในการใช้งาน
Show as Tabs เปลี่ยนแถบเครื่องมือให้แสดงผลในลักษณะแท็บคำสั่งเรียงต่อกันไป ลักษณะการแสดงผลจะเหมือนกับเวอร์ชั่นก่อนหน้านี้ เช่น Macromedia Dreamweaver MX, 2004 เป็นต้น

4. Toolbar เป็นแถบเครื่องมือที่เก็บปุ่มคำสั่งที่ต้องใช้งานบ่อยๆ ซึ่งประกอบด้วย 
 
  • Show Code View สำหรับแสดงการทำงานในรูปแบบ HTML นอกจากนี้ยังสามารถเขียนคำสั่ง HTML หรือคำสั่งภาษาสคริปต์ (Script) อื่นๆ ได้ด้วย
  • Show Code and Design สำหรับแสดงการทำงานแบบ HTML กับการแสดงพื้นที่ออกแบบ โดยจะแสดงส่วนของคำสั่งไว้ด้านบนและแสดงเว็บเพจปกติไว้ด้านล่าง
  • Show Design View สำหรับแสดงเว็บเพจคล้ายกับที่เราเห็นใจเบราเซอร์ เช่น ข้อความ กราฟิก หรือออปเจ็กต์อื่นๆ และสามารถแก้ไขเนื้อหาลงเว็บเพจได้

5. Document Area เป็นส่วนที่ใช้สำหรับสร้างหน้าเว็บเพจ โดยการใส่เนื้อหาและจัดองค์ประกอบต่างๆ นำมาวางใน Document Area และสามารถเลือกพื้นที่การทำงานได้หลายมุมมอง เช่น Show Code View,Show Code and Design View ดังที่ได้กล่าวไว้แล้วข้างต้น
 

6. Status Bar คือ แถบแสดงสถานะที่อยู่บริเวณด้านล่างของพื้นที่สร้างงาน (Document Area) ซึ่งประกอบด้วย 2 ส่วน คือ ทางด้านซ้ายเรียกว่า Tag Selector ใช้สำหรับแสดงคำสั่ง HTML ของส่วนประกอบในเว็บเพจที่เลือกอยู่ และทางด้านขวาเป็นส่วนที่บอกขนาดและเวลาที่ใช้ในการดาวน์โหลดเว็บเพจ
7. Properties Inspector เป็นหน้าต่างแสดงคุณสมบัติของออปเจ็กต์ที่เรากำลังเลือกในเว็บเพจ และสามารถกำหนดหรือแก้ไขคุณสมบัติของส่วนประกอบต่างๆ ในหน้าเว็บเพจได้ เช่น ข้อความ สี ขนาด ตาราง ลิงก์ เป็นต้น โดยรายละเอียดภายในหน้าต่าง Properties Inspector จะไม่เหมือนกันขึ้นอยู่กับว่าขณะนั้นเรากำลังเลือกทำงานกับออปเจ็กต์ใดอยู่

Properties Inspector ของภาพกราฟิก


Properties Inspector ของข้อความ


Properties Inspector ของตาราง

8. Panels เป็นกรอบเล็กๆ บริเวณด้านขวา ประกอบด้วยเครื่องมือสำหรับใช้ทำงานต่างๆ ซึ่งแต่ละส่วนของ Panels จะมีหน้าที่แตกต่างกันไป เช่น การจัดเก็บ Code, CSS, Behavior อีกทั้งไฟล์และโฟลเดอร์ภายในเว็บไซต์ (โดยรายละเอียดต่างๆ จะอธิบายใน Chapter ต่อๆ ไป) และเรียกขึ้นมาใช้งานโดยใช้คำสั่ง Windows จากนั้นเลือกชื่อ Panels ที่ต้องการเปิด/ปิด หรือใช้คีย์ลัดด้านหลังชื่อ Panels ก็ได้ เช่นกัน
 



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

แอนดรอยด์ (Android) คืออะไร?



วิธีที่จะเข้าใจว่า Android(แอนดรอยด์) คืออะไร? อย่างง่ายๆ ให้เราลองนึกถึง คอมพิวเตอร์ที่บ้านครับ ตอนนี้ใช้ Windows อะไรอยู่ครับ บางคนก็จะตอบว่า Windows 7, Windows Vista บางคนก็ตอบว่า Windows XP หรือบางคนอาจจะตอบว่า ผมไม่ใช้ Windows ผมใช้ Linux ซึ่งจะเป็น Linux รุ่นไหนก็ว่ากันไป … Windows หรือ Linux เราเรียกมันว่า ระบบปฏิบัติการ(OS) ซึ่งเป็นที่ทราบกันดีว่าถ้าคอมพิวเตอร์ไม่ลง Windows ก็จะเปิดเครื่องเพื่อทำงานไม่ได้ ฉันใดก็ฉันนั้น โทรศัพท์มือถือ SmartPhone ก็เช่นเดียวกันครับ มันต้องการ OS ซึ่งใน iPhone นั้นบริษัทแอปเปิ้ลใช้ OS ที่ชื่อว่า iPhone OS ครับ ในขณะที่บริษัทกูเกิ้ล(Google) บริษัทยักษ์ใหญ่แห่งวงการไอที อีกรายก็ได้ซุ่มพัฒนา OS ที่มีชื่อว่า Android(แอนดรอยด์) OS ขึ้นมา ซึ่ง Android(แอนดรอยด์) เวอร์ชั่น 1.0 ได้ถูกปล่อยออกมาใช้งานอย่างเป็นทางการครั้งแรกเมื่อวันที่ 28 กันยายน ค.ศ 2008

ต้นกำเนิด แอนดรอยด์ (Android)


ย้อนไปเมื่อประมาณ เดือน ตุลาคม ปี 2003 Andy Rubin ได้ก่อตั้งบริษัท แอนดรอยด์ (Android, Inc.) พร้อมกับเพื่อนร่วมงานที่ถือว่ามีความสามารถแตกต่างกันออกไปในแต่ละด้าน ร่วมกันพัฒนามาเรื่อยจนเมื่อวันที่ 23 กันยายน 2550 โทรศัพท์มือถือรุ่นแรก ที่ใช้ระบบปฏิบัติการ แอนดรอยด์ ก็ได้ออกวางจำหน่าย ซึ่งสมาร์ทโฟนรุ่นแรกที่ใช้ระบบปฏิบัติการแอนดรอยด์ คือ HTC Dream

Android 4.0 หรือ Android 4.1? ตัวเลขข้างหลังคืออะไร? เพื่ออะไร?


Android(แอนดรอยด์) 4.0 เป็นหมายเลขเวอร์ชั่นของ ระบบปฏิบัติการ แอนดรอยด์ ครับ เหมือนที่ Windows มีทั้ง Windows95, Windows 2000, Windows XP, Windows Vista ซึ่งทั้งหมดนี้เป็นเวอร์ชั่นที่พัฒนาต่อๆกันมาของ Windows ครับ ใน Android OS เองก็มีการพัฒนาอย่างต่อเนื่องทำให้ตอนนี้ Android OS มีทั้งหมด 10 เวอร์ชั่นแล้วครับและมีชื่อเล่นสำหรับเรียกง่ายๆด้วยครับ

       ซึ่ง ก็ได้แก่ Apple Pie(Android 1.0),Banana Bread(Android 1.1),CupCake(Android 1.5), Donut(Android 1.6), Éclair(Android 2.1), Froyo(Android 2.2), Gingerbread(Android 2.3), Honeycomb(Android 3.0), Ice Cream Sandwich(Android 4.0), Jelly Bean (Android 4.1) จะสังเกตุเห็นได้ว่า ชื่อรุ่นทุกรุ่นเป็นของหวานทั้งหมดเลยครับ และในรุ่น Android ที่จะพัฒนาในอนาคตซึ่งยังไม่มีการกำหนดเลขเวอร์ชั่นก็จะมีชื่อว่า Key lime pie อีกด้วย.