Archive for the ‘ webdev ’ Category
จากบล๊อคที่แล้ว ดึงข้อมูลจาก Google Analytic มาแสดงด้วย PHP ทำให้เกิดอยากเขียนสิ่งที่คนชอบให้เอามาไว้หน้าเว็บอีกอย่างหนึ่ง คือ Visible Stat หรือ Counter แบบเดิมๆที่เราเคยเห็นนั่นเอง ซึ่งโดยธรรมชาติของ google analytics นั้นเราไม่สามารถดึงจำนวนครั้งที่มีคนเข้าเว็บมาโชว์หน้าเว็บได้ แต่ด้วย Analytic Data Extract API ก็เลยทำให้มีวิธีดึงข้อมูลออกมาได้ เป็น counter แบบเชยๆที่คุ้นตาได้ ดังตัวอย่าง [ READ MORE ]
ปัญหามันเกิดจากบางครั้งเราทำเว็บให้คนที่ไม่ค่อยมีความรู้เรื่องคอม แล้วจะใช้ Google Analytic ในเว็บเขา ทีนี้ก็สมัคร Account ให้ เอาโค้ทมาใส่ให้ สอนให้ลอคอินเข้าไปดูสถิติในเว็บ google แต่ไม่นานก็จะเกิดงานเข้า เพราะเขาจำไม่ได้ว่าเข้าดูยังไง ภาษาอังกฤษใช้ไม่คล่อง ฯลฯ ก็เลยอยากจะเอาสถิติจาก GA มาไว้ในหน้าแรกของ backoffice เว็บเขาเลย จะได้ดูชัดๆ ง่ายๆ ก็เลยนั่งเขียน PHP class เพื่อติดต่อกับ Google Analytic Data Export API(จริงๆมันก็ยังอยู่ใน lab แต่พอใช้งานได้) และก็ใช้ Google Chart มาช่วยในการแสดงผล ได้ออกมา ดังนี้ Screenshot: [ READ MORE ]
ปรากฎการณ์ลึกลับที่เกิดขึ้นมากมายใน ie6 ทำให้คนทำเว็บอย่างเราๆต้องเสียเวลาไปมากในการมานั่งตามแก้ไข ซึ่งหนึ่งในปัญหาสำคัญที่เจอใน ie6 คือปัญหาที่เกี่ยวกับการใช้ float กรณีศึกษา “กล่องหล่น” ทดลองสร้างกล่อง 2 กล่อง กล่องละ 200px(รวมขอบแล้ว) อยู่ภายใต้กล่องขนาดใหญ่ขนาด 400px โดยให้ทั้งสองกล่อง float ไปทางซ้าย และกล่องแรกอยู่ห่างจากขอบด้านซ้าย 5 pixels เมื่อดูใน ie8(และบราวเซอร์อื่นๆ) จะได้ผลลัพท์ที่ถูกต้อง ดังนี้ แต่ถ้าดูใน ie6 หล่ะ? งานเข้าหล่ะสิ มันเกิดอะไรขึ้นเนี่ย กรอบขนาด 400 ใส่กล่องขนาด 200 สองชิ้น ก็รวมเป็น 400 พอดี แล้วทำไมมันตกลงมาได้ ???! ก่อนที่จะถอนหายใจเฮือกใหญ่แล้วเปลี่ยนใจกลับไปใช้ table ลองมาศึกษาปัญหาอย่างเป็นระบบ แล้วหาทางแก้ไขอย่างถูกต้อง(เท่าที่จะถูกได้ใน ie6) เพื่อชีวิตที่ดีกว่า [ READ MORE ]
จากคนเคยหากินกับ php มาเนิ่นนานจนจำไม่ได้แล้วว่าเริ่มเมื่อไหร่ แต่ด้วยความอยากรู้อยากเห็นเลยตั้งโจทย์กับตัวเองไว้ว่าโปรเจคส่วนตัวชิ้นต่อไปจะใช้ภาษาอื่นที่ไม่ใช่ php ซะบ้าง ก็เริ่มมองหาหลายๆตัวเลือก โดยพิจารณาจริงจังที่ python, ruby on rails และ java แล้วก็ลองศึกษาดูว่ามันยังไงกันบ้างนะ ลองอ่านลองเขียนอยู่นานสุดท้ายก็มาลงเอยที่ ruby on rails ด้วยเหตุผลหลายๆอย่างที่พอมาคิดๆดูก็ไม่ค่อยมีเหตุผลเท่าไหร่ แต่เอาหล่ะ rails ก็ rails [ READ MORE ]
จากโพสที่แล้ว php oop #1: panda class ว่าด้วยเรื่องการเขียน php oop แบบง่ายๆ แต่ดูไม่มีประโยชน์เท่าไหร่นัก เพราะถ้าดูดีๆมันก็ไม่ต่างจากเขียนฟังก์ชั่นเท่าไหร่ เลยมาว่าต่อถึงคุณสมบัติจริงๆของ object oriented บ้าง เริ่มต้นจากอย่างแรกก่อน คือคอนเซปต์การ encapsulation หรือขอเรียกง่ายๆว่า การห่อ ซึ่งก็เป็นเหมือนการซ่อนข้อมูลภายในคลาสไว้ไม่ให้สามารถเข้าถึงได้โดยตรงจากส่วนอื่นๆของโปรแกรม ลองดูโค้ทกันเลยน่าจะง่ายกว่านั่งอธิบายให้ยืดยาว class Panda{ private $name; function eat(){ echo "eating bamboo leaf"; } } ก็เล่นกันง่ายๆเลย คือเปลี่ยนตัวแปร name ให้เป็น private ซะ คราวนี้การเรียกถึงตัวแปรแบบตรงๆอย่างที่เห็นในตัวอย่างที่แล้วก็จะไม่สามารถทำได้อีกต่อไป แต่เมื่อต้องการเรียกใช้เราก็อาจจะเพิ่ม method เข้าไป เช่น function setName($pname){ [ READ MORE ]
วิธีง่ายๆที่จะเปลี่ยนจากการเขียน html layout โดยใช้ตารางมาเป็น css/div layout สำหรับคนที่กำลังลังเลที่จะใช้ css แทนตารางแบบเดิมๆ ก่อนอื่นดูตารางก่อน โค้ทของตาราง This is Header Main Menu -Menu1 Content goes here! This is content! ดูแล้วก็ง่ายๆ ตามสไตล์ที่คุ้นเคย แต่ดูแล้วยุ่งยากใจพิลึก ทีนี้เราจะจับเจ้า layout ที่คุ้นเคยนี้แหละมาเขียนเป็น css [ READ MORE ]
ว่ากันเรื่องการเขียนโปรแกรม php แบบ oop หรือ object oriented programming นั่นเอง ก่อนจะไปว่ากันเรื่อง php ก็ต้องอธิบาย oop กันก่อน สำหรับคนที่คุ้นๆกันอยู่แล้วก็ข้ามไปได้เลย เอาง่ายๆแบบไม่ยืดยาว oop คือการเขียนโปรแกรมที่ให้ความสำคัญกับ “วัตถุ” คุณสมบัติ และความสัมพันธ์ของมัน โดยมีศัพท์ที่ต้องรู้จัก ดังนี้ Class(ชนิดของวัตถุ) เป็นเหมือนเทมเพลท เพื่อบอกว่าวัตถุชนิดนี้จะมีคุณสมบัติใดบ้าง โดยคุณสมบัติประกอบด้วย 2 อย่าง คือ สถานะ(state) และ พฤติกรรม(behavior) คลาส หมีแพนด้า มีสถานะคือ ชื่อหมี และมีพฤติกรรมคือ กินไผ่ Object(วัตถุ) สร้างขึ้นมาจากคลาส โดยเมื่อเป็นวัตถุแล้ว state จะกลายเป็น instance variable(ตัวแปรนั่นแหละ) และ behavior จะถูกเรียกว่า method วัตถุ หมีแพนด้า ที่มีชื่อ หลินฮุ่ย สามารถ กินไผ่ ได้ นั่นคือ ถ้าพูดว่า “หมีแพนด้า” ขึ้นมาลอยๆโดยไม่ระบุวัตถุว่าเป็นแพนด้าตัวไหน มันก็จะไม่มีชื่อ [ READ MORE ]
ไฟล์ .png กับการทำเว็บสมัยนี้เป็นของคู่กัน ซึ่งคนที่รู้จักกับมันแล้วจะลืม .gif ไปเลย หลักๆคือความสามารถในการทำให้ส่วนใดๆของภาพโปร่งแสง(transparent) และพื้นหลังใสได้อย่างสนิทใจ แต่ปัญหามันก็เกิดกับบราวเซอร์ที่รักเจ้าเก่าของเรา ไม่ใช่ใครที่ไหน ie6 นั่นเอง สำหรับคนทำเว็บแล้วก็อยากจะลืมๆเจ้าบราวเซอร์นี้มันไปซะ แต่พอเหลือบมาดูสถิติ browser ที่ใช้กันในบ้านเราแล้วก็ไม่สามารถจริงๆ (Truehits.net::2008-11 IE6 51.1%) ดังนั้นก็ต้องมาตามแก้กันไป วิธีทำให้ไฟล์ png แสดงผลได้อย่างปกติสุขใน ie6 นั้นมีหลายวิธีแล้วแต่ความถนัด สำหรับวิธีที่จะพูดถึงนี้ส่วนตัวแล้วชอบเพราะว่าไม่ต้องดัดแปลงโค้ทมากนัก ก่อนอื่นก็มาดูการแสดงผลไฟล์ png ของ ie6 เทียบกับ ie7 กันก่อน จะเห็นว่าใน ie6 นั้นส่วนพื้นหลังมันไม่ใสจริง แต่มีพื้นที่สีเทาๆมาทับ background(รูปไม้บรรทัด) ด้านข้างหมด คราวนี้มาดูวิธีแก้กัน [ READ MORE ]
มันเริ่มจากการอ่านเว็บไปเรื่อยๆและเจอกระแส tableless html layout มานาน แต่ก็บอกตัวเองว่าไม่มีเวลาสักทีที่จะเปลี่ยนสไตล์การเขียนเว็บของตัวเองจาก “old school html” ที่เน้นใช้ตารางในการจัดหน้า html มาเป็น css based layout ที่ใช้ div และ css เป็นหลัก บอกว่าไม่มีเวลาจริงๆแล้วก็เป็นข้ออ้างนั่นแหละ เพราะการเปลี่ยนจากสิ่งที่คุ้นเคยมาใช้อะไรใหม่ๆมันต้องเรียนรู้อะไรมากมาย ทำให้ไม่อยากจะเปลี่ยนแปลงอะไรในบางจังหวะของชีวิตที่ยึดเอาความขี้เกียจเป็นที่ตั้ง จนกระทั่งได้จังหวะก็เริ่มมาศึกษาจริงๆจัง กว่าจะเขียนได้คล่องก็ไม่ง่ายแต่ก็ไม่ได้ยากมากมายอย่างที่คิดไว้ [ READ MORE ]