Web Dev

เมื่อเร็ว ๆ นี้ผมได้มีโอกาสไปลงเรียนคอร์สการออกแบบเว็บไซต์บน Udemy ด้วยความอยากรู้ว่าปัจจุบันทิศทางการออกแบบเป็นอย่างไร และถ้าเราอยากออกแบบเว็บไซต์ได้สวยแบบที่เมืองนอกทำนั้น เขามีทริคหรือเคล็ดลับอะไรบ้าง เนื้อหาที่ผมได้เรียนรู้มานั้นน่าสนใจมากครับ จึงนำมาฝากเพื่อน ๆ ชาว START IT UP ได้เรียนรู้ร่วมกัน โดยทำเป็นคอร์สเรียนออนไลน์ในรูปแบบวิดีโอ ถือเป็นการฝึกทำคอร์สสอนไปในตัวครับ หากมีข้อผิดพลาดประการใดก็ขออภัยด้วยครับ โดยส่วนตัวผมเชื่อว่านักพัฒนาหลายคนน่าจะมีปัญหาเรื่องการออกแบบครับ โดยเฉพาะคนที่ทำสตาร์ทอัพบางครั้งในทีมคุณไม่มี Designer อยู่เลย ดังนั้นแนวทางการออกแบบต่อไปนี้จะช่วยให้นักพัฒนาสามารถใช้เป็น Guideline ในการพัฒนาเว็บไซต์ หรือแอพพลิเคชั่นที่สวยงามไม่แพ้...

บทความนี้ผมมาแนะนำนางแบบเอ้ย javascript library ที่น่าสนใจอีกหนึ่งตัว ชื่อ Color-Thief ซึ่งช่วยให้เราขโมยสีของรูปมาใช้ได้ เริ่มสงสัยแล้วใช่มั้ยครับ ว่าเอ๊ะ! แล้วมันขโมยสียังไง แล้วทำไมเราต้องขโมยสีด้วย งั้นมาดูรายละเอียดกันเลยดีกว่า การขโมยสีของ Color-Thief Color Thief ใช้อัลกอริทึมจำพวก image-processing เพื่อวิเคราะห์และสกัดสีออกมาจากรูป โดยผลลัพธ์ที่ได้คือค่าสี rgb ซึ่งการสกัดสีมี 2 รูปแบบ คือ Dominant color คือ...

จาก workshop ที่แล้ว ทำเว็บสไตล์ Pinterest ง่าย ๆ ด้วย Masonry หากใครที่ลองไป copy url รูปจากอินเทอร์เน็ตมาใส่แทน แล้วลองเปิดเว็บดู จะพบว่า Masonry มีปัญหาการแสดงผล grid ที่เพี้ยน คือ รูปมันจะมาซ้อน ๆ กัน ทำให้การเรียงรูปใน grid ดูไม่สวยงาม...

ใครที่เคยเข้าเว็บ Pinterest.com เพื่อหาดูไอเดียต่าง ๆ จะเห็นได้ว่า Pinterest เป็นเว็บที่มีการแสดงข้อมูลรูปภาพที่มีเอกลักษณ์มาก โดยรูปภาพในเว็บจะถูกแสดงซ้อน ๆ กันหลายรูป  การแสดงผลแบบนี้มีชื่อเรียกว่า staggered grid บทความนี้ผมพามาลุย workshop พาทำเว็บสไตล์ Pinterest อย่างง่าย ๆ ด้วย javascript library ที่ชื่อว่า Masonry ซึ่งเป็น js library ใช้ทำ...

ใครยังไม่ติดตั้ง XAMPP ให้ไปทำตามวิดีโอที่บทความ การติดตั้ง XAMPP สำหรับจำลองเครื่องคอมเราเป็น Web Server ก่อนนะครับ เพราะ Wordpress ที่จะสอนในวิดีโอนี้ จำเป็นต้องติดตั้งบน Web Server ซึ่ง XAMPP ช่วยจำลองเครื่องคอมเราให้อยู่แล้ว ที่ต้องติดตั้ง XAMPP เพราะ Wordpress ถูกพัฒนาขึ้นด้วยภาษา PHP ซึ่งเป็นภาษา Server-side script...