การทำ Wireframe

ในการพัฒนาเว็บไซต์ จะมีผู้ที่เกี่ยวข้องโดยตรงหลักๆ ได้แก่ 1. ทีมพัฒนาเว็บไซต์ หรือโปรแกรมเมอร์ อาจจะมีคนเดียว หรือทำงานกันเป็นทีมก็ได้ และ 2. ผู้ใช้ หรือลูกค้า จะเป็นผู้กำหนดความต้องการของเว็บไซต์ หลังจากที่ทีมพัฒนาเก็บรวบรวมความต้องการของลูกค้า และได้ทำการวิเคราะห์ความต้องการแล้ว ขั้นตอนถัดไป ก็จะเป็นการวางแผน ออกแบบ Layout คร่าวๆ ก่อน เพื่อให้ทีมพัฒนามีความเข้าใจที่ตรงกัน อีกทั้งยังสามารถนำเสนอต่อลูกค้า เพื่อให้ลูกค้าเห็นภาพรวมของเว็บไซต์ก่อนการลงมือออกแบบเว็บไซต์ และเขียนโค้ดจริง  เราเรียกกระบวนการออกแบบ Layout และนำเนื้อหาคร่าวๆ ในเว็บไซต์มาจัดเรียงบน Layout นี้ว่า “การทำ Wireframe” การทำ Wireframe นั้นไม่ได้มีรูปแบบตายตัว นักพัฒนาแต่ละคนอาจมีวิธีการที่แตกต่างกันไป แต่มีวัตถุประสงค์ในการทำที่เหมือนกัน คือ เพื่อให้เห็นภาพรวมของเว็บไซต์ ทำให้ทีมเข้าใจตรงกัน และพัฒนาไปในทางเดียวกัน ตัวอย่างเครื่องมือที่ใช้ทำ Wireframe ที่ทำได้ง่ายที่สุด คือการใช้ดินสอ วาด Layout ลงบนกระดาษ และจัดเรียงเนื้อหาคร่าวๆ ดังรูป หรือจะใช้โปรแกรมคอมพิวเตอร์ช่วยในการทำก็ได้แล้วแต่ความถนัดของแต่ละคน ซึ่งโปรแกรมคอมพิวเตอร์ที่ช่วยในการทำ Wireframe จะมีให้เลือกใช้มากมาย … Read more

เตรียมความพร้อมก่อนการพัฒนา Web Application

ในปัจจุบันนี้ต้องยอมรับว่าระบบอินเตอร์เน็ตเข้ามามีบทบาทสำคัญต่อการดำเนินกิจกรรมต่างๆ มากมาย ทั้งในด้านสังคม เศรษฐกิจ การเมือง การศึกษา หรือแม้กระทั่งวงการทหาร ดังนั้นแนวโน้มของโปรแกรมคอมพิวเตอร์จึงเน้นไปทางด้านโปรแกรมที่สามารถทำงานผ่านระบบอินเตอร์เน็ตได้ ประกอบกับอุปกรณ์ในการเข้าถึงอินเตอร์เน็ตมีความหลากหลายมากยิ่งขึ้นจึงมีผลต่อการพิจารณาเทคนิค วิธีการต่างๆ ที่จะนำมาใช้ในการพัฒนาระบบของผู้พัฒนาว่าควรจะเลือกใช้เทคโนโลยีใดบ้าง เพื่อให้โปรแกรมที่พัฒนาขึ้นมีความทันสมัย รองรับการใช้งานบนอุปกรณ์ต่างๆ ได้เป็นอย่างดี เนื่องจากอุปกรณ์ต่างๆ ไม่ว่าจะเป็น Computer, Tablet หรือ Mobile จะมีโปรแกรมพื้นฐานที่เรียกว่า Web Browser สำหรับเข้าใช้งานเว็บไซต์ต่างๆ อยู่แล้ว ดังนั้นการพัฒนาโปรแกรมในรูปแบบ Web หรือที่เรียกว่า Web Application จึงเป็นทางเลือกที่ได้รับความนิยมเป็นอย่างมาก สามารถตอบสนองความต้องการของผู้ใช้งานได้เป็นอย่างดี ก่อนการพัฒนาโปรแกรมทุกครั้ง ผู้พัฒนาระบบจะต้องทำการรวบรวมความต้องการของโปรแกรม (เป็นขั้นตอนแรกของการพัฒนาโปรแกรมตามกระบวนการ SDLC) เพื่อนำมาวิเคราะห์ และออกแบบระบบในขั้นตอนต่อไป ผลจากการวิเคราะห์ความต้องการในบางครั้งพบว่าเราไม่จำเป็นต้องพัฒนาโปรแกรมขึ้นมาใหม่ เนื่องจากโปรแกรมสำเร็จรูปบางตัวสามารถตอบโจทย์ความต้องการเหล่านั้นได้แล้ว เช่น Joomla, Moodle, WordPress เป็นต้น แต่ถ้าหากไม่ตอบโจทย์ความต้องการ ก็จะเป็นหน้าที่ของผู้พัฒนาที่จะต้องพัฒนาระบบขึ้นมาเอง ซึ่งในการที่จะพัฒนาระบบได้นั้น ผู้พัฒนาจะต้องมีความรู้พื้นฐานที่เกี่ยวข้อง เพื่อที่จะได้นำมาประกอบการตัดสินใจเลือกเทคนิคเหล่านั้นได้อย่างเหมาะสม ในบทความนี้เราจะมาทำความเข้าใจพื้นฐานที่ควรรู้สำหรับนักพัฒนาเว็บไซต์มือใหม่ได้แก่ความหมายของ Front-end,  Back-end และ Front-end … Read more

ตั้งค่า php ให้แสดงข้อความ error

อาการปัญหา: นำโค้ดอัพโหลดขึ้นเครื่องเว็บเซิร์ฟเวอร์จริง ลองทดสอบการใช้งาน ปรากฎว่าเจอแต่หน้าว่างๆ ขาวๆ

ตอบ: เซิร์ฟเวอร์ปิดการทำงานการแสดงผลข้อความ error ต่างๆ ของ php เพื่อความปลอดภัย ต้องทำการเปิดก่อนที่ php.ini มีขั้นตอนดังนี้

Read more

c# string concatenations

การต่อ String ใน C# ทำได้  4 แบบดังนี้ ใช้เครื่องหมาย plus (+) แบบยอดนิยมใช้งานกันบ่อยๆ. string txt = “aaa”+”bbb”+”ccc”; ใช้ string.Concat() สะดวกับการต่อ list หรือ array มาก. string [] s = { “ManU”, “Liverpool”, “Asenal” }; Console.WriteLine(string.Concat(s)); ใช้ string.Format() เหมาะสำหรับต่อ string และจัดการรูปแบบการแสดงผลด้วยไปในคราวเดียวกันเลย. string value1 = “Hello World!”; int value2 = 2557; DateTime value3 = DateTime.Now(); string result = string.Format(“{0}: {1:0.0} … Read more

วิธีตรวจสอบเว็บไซต์ที่โดน Hack #15

จาก วิธีตรวจสอบเว็บไซต์ที่โดน Hack #7 : การตรวจสอบ Windows Server ที่ถูก Hack ด้วย PowerShell ซึ่งเป็นกระบวนการตรวจสอบ Windows Server ซึ่งโดนเจาะด้วยช่องโหว่ JCE ของ Joomla ก็มีคนถามว่า จะมีกระบวนการแก้ไขป้องกัน เหมือนกับที่ทำกับ Apache ซึ่งแสดงใน วิธีตรวจสอบเว็บไซต์ที่โดน Hack #12 : เทคนิคการตั้งค่า Apache Web Server เพื่อให้ปลอดภัยจากช่องโหว่ ตอนนี้มีคำตอบแล้วครับ เทคนิคนี้ ใช้ผ่าน Internet Information Services (IIS) Manager โดยการแก้ไข Request Filtering ในระดับ Web Server เลย โดยดำเนินการตามวิธีการต่อไปนี้ เรียก Command ด้วย การกดปุ่ม Windows + R แล้ว พิมพ์ … Read more