CoP PSU IT Blog – Page 43 – แหล่งรวมบทความเกี่ยวกับ IT โดยชาว PSU IT

เขียนเว็บแอพแบบ SPA ด้วย Blazor (C#)

May 29, 2021 14:41

หากคุณเป็นนักพัฒนาเว็บแอพที่ชอบฟังเพลงยุค 90 คุณก็คงจะคุ้นเคยกับ Multiple Page Applications (MPA) เป็นอย่างดี MPA หรือเว็บแบบดั้งเดิมนั้นสามารถสังเกตุได้จากการที่เราคลิกดูข้อมูล หรือเปลี่ยน URL หน้าเว็บจะโหลดใหม่ทั้งหน้า เพื่อดึงข้อมูลมาแสดงผลใหม่ใน Browser ดังรูป ทุกวันนี้ก็ได้มีอีก Trend หนึ่งที่น่าสนใจ และมีการนำมาใช้สร้างเว็บแอพกันอย่างแพร่หลาย นั่นก็คือ Single Page Application หรือ SPA โดยเว็บแบบนี้จะทำการโหลดหน้าเว็บจาก Request ครั้งแรกเท่านั้น หลังจากนั้นจะเป็นการรับส่งข้อมูลกันโดยใช้ JavaScript เข้ามาช่วย ทำให้ลดการ Reload หน้าเว็บโดยไม่จำเป็นลงไปได้ ข้อดีของเว็บแบบนี้คือ มี User Experience ที่ดีกว่า ตอบสนองได้อย่างรวดเร็ว และลดการทำงานของฝั่ง Server ตัวอย่างเว็บไซต์แบบ SPA ที่เราใช้งานกันอยู่บ่อยๆ ได้แก่ Facebook, Instagram, Twitter, Google Mail เป็นต้น ตัวอย่างของ SPA Framework Vue.js React.js AngularJS Ember.js Knockout.js Meteor.js Blazor จาก Framework ตัวอย่างทั้งหมดจะเป็น JavaScript ยกเว้น Blazor ที่ใช้ C# แทน และในฐานะที่คุ้นเคยกับการเขียนโค้ด C# อยู่แล้ว Blazor จึงเป็นตัวเลือกที่น่าสนใจ การสร้างแอพด้วย Blazor เปิด Visual Studio 2019 คลิก Create a new project ก็จะเจอหน้าจอดังรูป จากนั้นให้เลือก Project templates เป็น Blazor Server App หน้าจอ Configure your new project ให้ตั้งชื่อ Project name ว่า FirstApp.Webระบุ Location เป็น C:\Source\ หน้าจอ Additional information ให้เลือก Target Framework เป็น .NET 5.0 ถึงขั้นตอนนี้แล้วทำให้ได้ Project ใหม่ที่มีไฟล์ตั้งต้นไว้ให้แล้ว โดยการเขียนเว็บด้วย Blazor นั้นจะใช้ไฟล์ชนิด Razor ซึ่งเป็นเทคโนโลยีการสร้าง View ของ ASP.NET MVC กด F5 หรือคลิกปุ่มรัน เพื่อดูผลลัพธ์กันก่อน จะเห็นว่ามีตัวอย่างไว้ให้ศึกษา 2 เมนู คือ Counter และ Fetch data เมนู Counter เป็นตัวอย่างของการสร้าง Blazor Component เมื่อคลิกปุ่ม Click me ก็จะทำให้ Current count มีค่าเพิ่มขึ้นทีละ 1 โดยสังเกตได้ว่า ในการคลิกปุ่มทุกครั้งจะไม่มีการ Reload หน้าเว็บใหม่ทั้งหน้า แต่มีการเปลี่ยนแปลงเฉพาะส่วนของตัวเลข Current count เท่านั้น โค้ดตัวอย่าง Counter จะอยู่ในโฟลเดอร์ Pages ชื่อไฟล์ Counter.razor เมื่อเปิดดูจะพบว่าโค้ดมีส่วนสำคัญ 3 ส่วน คือ a. Route หรือ URL ที่ใช้ในการเข้าถึงหน้าเว็บ ในที่นี้คือ /counter เวลาเข้าใช้งานก็จะเป็น https://localhost:44381/counter b. View หรือส่วนของ HTML ใช้ในการจัดรูปแบบการแสดงผล c. C# Code เป็นส่วนที่ใช้เขียนโค้ดควบคุมการแสดงผลของ View มาถึงจุดนี้แล้ว ก็สามารถทดลองเขียนโปรแกรมเล่นๆ ได้ เช่น ถ้าต้องการให้คลิกปุ่ม Click me แล้ว

การสร้างแบบสอบถามอย่างง่ายจาก Mentimeter

May 29, 2021 10:00

การสร้างแบบสอบถามอย่างง่ายโดยใช้เครื่องมือที่ชื่อว่า Mentimeter ลองมาดูกันว่าวิธีการง่าย ทำกันอย่างไร เข้าใช้งานไปที่ เว็บไซต์ https://www.mentimeter.com/ เมื่อเข้ามาให้คลิก “Sign up” เพื่อเข้าสู่ระบบ 2. จะแสดงหน้าให้ Create a free account แบบง่าย ก็ให้เลือกผ่าน Facebook หรือผ่าน Google ดังรูป 3. ในตัวอย่างโดยใช้ Facebook ดังรูป 4. เมื่อ Login เข้ามาแล้วจะเจอประเภทที่ให้เลือก ในตัวอย่างนี้จะใช้แบบ “Workshops” 5. ให้เลือกรูปแบบของการใช้งาน ตัวอย่างนี้เลือกแบบ Free โดยคลิก “Continue with free“ 6. เลือก “+New presentation“ 7. จะมีประเภท (Type) ให้เลือก ตัวอย่างนี้เลือกแบบ “Word Cloud“ 8. สามารถสร้างคำถาม ตัวอย่างถามว่า “คุณชอบกินอะไร” และเลือกคำตอบที่สามารถตอบได้ 3 ข้อ หลักจากนั้นคลิกปุ่ม “Share” ดังรูป 9. เมื่อคลิก “Share” จะมีให้เลือก จะเอาลิงก์ไปใส่ในหน้าเว็บอื่นๆ หรือจะสร้างเป็น QR code ในตัวอย่างสร้างเป็น QR code ดังรูป 10. เมื่อคลิกปุ่ม “Download” จะได้ QR code สำหรับเอาไปใส่ในเว็บต่างๆ QR code นี้สามารถใช้งานได้จริง ลองสแกน แล้วเข้าไปกรอกดูนะคะ 11. เมื่อสแกน QR code ผ่านมือถือจะได้คำถาม ดังรูป 12. ให้กรอกคำตอบได้ 3 ข้อ แล้วกรอกคำตอบที่ต้องการ แล้วคลิกปุ่ม “Submit” 13. เมื่อกรอกครบทั้ง 3 ข้อ จะแสดงข้อความขอบคุณในการตอบคำถาม จากที่เล่ามาด้านบนทั้งหมด เป็นแค่ตัวอย่างหนึ่งที่ตั้งคำถาม คำตอบแบบให้กรอกคำตอบแบบปลายเปิด ผู้ตอบแบบสอบถามสามารถเลือกบันทึกเองได้ แต่หากต้องการแบบสอบถามที่มีคำตอบชัดเจน ก็สามารถเลือกรูปแบบการทำแบบสอบถามได้ ดังนั้น นี่เป็นแค่ตัวอย่างง่ายๆ ที่คิดว่าทุกคนสามารถสร้างได้ ทำได้ และสามารถเอาไปประยุกต์ในงานต่างๆ ได้ แต่ข้อเสียคือ จะสามารถทำแบบสอบถามได้ 2 ข้อ หากต้องการคำถามที่เยอะกว่านี้ จะต้องมีค่าใช้จ่ายเกิดขึ้น

ตัดต่อ clip video อย่างง่าย ด้วย App Photos บน Windows10

May 28, 2021 22:56

จากบทความที่แล้วได้แนะนำ “การบันทึกหน้าจอคอมพิวเตอร์ Xbox Game Bar บน Windows10” ไปแล้ว ก็ถึงขั้นตอนการตัดต่อกันบ้าง ซึ่ง Windows10 ก็มี App ที่ทุกคนใช้งานกันอยู่เป็นประจำ นั้นก็คือ Photos หลายคนคงใช้ App Photos ใช้สำหรับดูรูปภาพเท่านั้น แต่รู้หรือไม่ว่ามันสามารถสร้าง ตัดต่อ ใส่ข้อความ ใส่เสียง และลูกเล่นต่าง ๆ ให้กับ clip ของของคุณได้อีกด้วย เริ่มต้นใช้งาน• พิมพ์ Photos ตรงช่องค้นหาด้านซ้ายของหน้าจอ แล้วเลือกเมนู • เมื่อเปิด App Photos ขึ้นมาคลิก New video และเลือก New video project • ใส่ชื่อ Name your video • เลือกไฟล์จากเครื่องของคุณโดยไปที่ +Add และเลือก From this PC ซึ่งสามารถเลือกได้ทั้งไฟล์รูปภาพและ clip video • คุณสามารถเลือกไฟล์ที่ต้องการทำclip video และกด Place in storyboard หรือ ลากรูปที่ต้องการลงในส่วนของ Storyboard ได้ทันที • เมื่อไฟล์ที่ต้องการตัดต่อ clip videoปรากฎใน Storyboard แล้ว คุณสามารถเลือกจัดการไฟล์รูปภาพและclip videoได้จากเครื่องมือต่าง ๆ ดังนี้ –Add title cardใช้สำหรับเพิ่ม card แสดงเพิ่มเติมจากไฟล์รูปหรือไฟล์ video –Backgroundใช้สำหรับใส่พื้นหลังให้กับ card ที่คุณได้เพิ่มเข้ามา –Durationใช้สำหรับใส่ระยะเวลาในการแสดงไฟล์ที่เลือกไว้ ซึ่งสามารถกำหนดโดยคลิกที่ Duration หรือที่ไฟล์ต้องการบน Storyboard ก็ได้ –Textใส่ข้อความ ซึ่งจะมีรูปแบบอักษร และ Layout ข้อความต่าง ๆ ให้เลือก –Motionใช้เลือกรูปแบบการเคลื่อนไหวของภาพ –3D effectsใช้สำหรับ ใส่ effects ลูกเล่นต่าง ๆ ให้กับไฟล์ที่เราต้องการ –Filtersใช้สำหรับใส่ Filters ให้กับไฟล์ภาพที่เราเลือก –Background musicใช้สำหรับเลือกเพลงบรรเลงให้กับ clip video ที่คุณกำลังสร้างอยู่ –Custom audioใช้สำหรับเลือกไฟล์ audio จากเครื่องของคุณเอง หากไฟล์ที่คุณนำเข้ามาตัดต่อเป็น clip video จะมีเมนูสำหรับใช้ในการตัดต่อเพิ่มขึ้นมา ได้แก่ –Trimใช้สำหรับตัดส่วน ต้น/ท้ายของ clip video –Splitใช้สำหรับแบ่งไฟล์ clip video เป็น 2 ส่วน –Speedใช้สำหรับกำหนดความเร็วของ clip ที่คุณเลือก เมื่อตกแต่งตัดต่อ clip ของคุณเรียบร้อยแล้ว ให้คลิกที่ Finish video เพื่อ Export ไฟล์โดยสามารถเลือกคุณภาพของไฟล์ที่ export ได้ เพียงเท่านี้คุณก็สามารถสร้างสื่อดี ๆ มานำเสนอได้แล้ว ใช้งานไม่ยาก แถมยังอยู่ใกล้ตัวด้วย คุณลองดูหรือยังค่ะ? ที่มา : ตัดต่อวีดีโอ บน windows10

การย่อ-ยุบแถวข้อมูลบน GridView โดยประยุกต์ใช้ร่วมกับ jQuery และ Collapse ใน Bootstrap (C#)

May 28, 2021 16:45

จากความเดิมตอนที่แล้ว เราได้พูดถึงวิธีการจัดการข้อมูลจำนวนมากด้วยการจัดกลุ่มหมวดหมู่ของข้อมูลใน GridView กันไปแล้ว ซึ่งหากผู้อ่านท่านใดต้องการทราบวิธีการจัดหมวดหมู่สามารถตามดูเนื้อหาในบทความได้จาก การจัดหมวดหมู่แถวของข้อมูลบน GridView ด้วย C# และในส่วนของบทความนี้จะเป็นเนื้อหาต่อยอดการทำงานจากการจัดหมวดหมู่ดังกล่าว โดยเพิ่มความสามารถให้หมวดหมู่หรือกลุ่มเหล่านั้นสามารถย่อ-ยุบได้ เพื่ออำนวยความสะดวกให้กับผู้ใช้ในการดูข้อมูลแยกส่วนกันชัดเจนมากยิ่งขึ้น หรือเพื่อตอบโจทย์ให้กับผู้ใช้บางท่านที่อาจมีความต้องการดูข้อมูลทีละส่วนได้ โดยจะนำ Component ที่ชื่อว่า Collapse ใน Bootstrap มาประยุกต์ใช้ในการแสดงผลร่วมกับ GridView และยังมี jQuery มาเป็นอีกหนึ่งตัวช่วยเพื่อให้สามารถแสดงผลตามที่ต้องการได้ โดยการอธิบายในบทความนี้ ทางผู้เขียนจะขอตัดตอนในส่วนของรายละเอียดขั้นตอนวิธีการจัดหมวดหมู่ไป และข้ามมาพูดถึงขั้นตอนที่ต้องจัดทำเพิ่มเติมในการทำย่อ-ยุบเลยละกันนะคะ ก่อนจะไปเริ่มในส่วนของการเขียนโค้ด เรามาทำความรู้จักกับ ค่าที่จำเป็นต้องใช้ในการระบุให้กับแถวหลัก(parent)เพื่อให้สามารถย่อยุบได้ กันก่อนนะคะ data-toggle=”collapse” data-target=”.multi-collapse” เพื่อกำหนด target ที่เราต้องการให้ย่อยุบได้ โดยใช้สไตล์ชีทเป็นตัวช่วยเพื่อแยกแต่ละกลุ่มออกจากกัน ซึ่งในที่นี้จะตั้งชื่อสไตล์ชีท multi-collapse ตามด้วยรหัสของประเภทกลุ่มนั้น โดยต้องระบุสไตล์ชีทนี้ให้กับแถวย่อย(child)ด้วย aria-controls=”demo1 demo2 demo3 demo4 demo5” เพื่อกำหนดพื้นที่ที่จะย่อยุบ โดยสามารถกำหนดได้มากกว่า 1 พื้นที่ ซึ่งจะแยกด้วยการเว้นวรรคชื่อ id ของแถวย่อย(child) ในตัวอย่างนี้ คือ แถวย่อยของแถวหลักนี้ ประกอบด้วย 5 แถว คือ แถวที่มี id ชื่อ demo1,demo2,demo3,demo4, demo5 นั่นเอง class = “collapseToggle” เป็นการระบุสไตล์ชีทเพื่อใช้ในการระบุตำแหน่งในการเปลี่ยนไอคอนเวลากดย่อ-ยุบ โดยเรียกใช้งานผ่าน jQuery(ซึ่งจะกล่าวถึงในส่วนถัดไป) หลังจากเรารู้จักค่าที่จำเป็นต้องใช้กันไปแล้ว เราก็มาเริ่มปรับแก้โค้ดเพิ่มเติม เพื่อเพิ่มความสามารถให้ GridView ของเรากันเลยค่ะ 1. ปรับแก้ในส่วนของ GroupGv_DataBound เพิ่มเติม เพื่อกำหนดค่าที่ระบุไว้ข้างต้นในแถวของหมวดหมู่ที่แทรกเข้ามา 2.จัดทำให้ไอคอนสามารถเปลี่ยนเป็น + หรือ – ได้ เมื่อกดย่อ-ยุบ ด้วย jQuery เพิ่มเติม : ท่านสามารถสร้างสไตล์ชีทตกแต่งเพิ่มเติมให้กับแถวของข้อมูลได้ ในกรณีนี้ได้ทำการสร้างสไตล์ชีทเพื่อไว้สำหรับเวลาเอาเม้าส์ชี้ที่แถวที่สามารถย่อ-ยุบได้ จะแสดงเป็นรูปมือ เพื่อให้ผู้ใช้ทราบว่าสามารถกดได้ค่ะ ผลลัพธ์ เกร็ดความรู้เพิ่มเติม : จากตัวอย่างข้างต้น ตอนเปิดหน้าจอครั้งแรก ทุกหมวดหมู่จะถูกยุบอยู่ หากต้องการให้การแสดงผลครั้งแรก ทุกหมวดหมู่ถูกขยายอยู่ สามารถปรับแก้โค้ดอีกเพียงเล็กน้อย ดังนี้ค่ะ เพิ่มคำว่า “show” เข้าไปในสไตล์ชีทตอนกำหนดให้แถวย่อย ดังนี้ค่ะ แบบเดิม แบบใหม่ 2.ปรับแก้ให้ไอคอนแรกที่ต้องการแสดงเป็นเครื่องหมายลบ ดังนี้ค่ะ แบบเดิม แบบใหม่ ผลลัพธ์ จากตัวอย่าง การแสดงผลครั้งแรกก็จะเปลี่ยนเป็นขยายทั้งหมด และแสดงไอคอนเป็นเครื่องหมายลบ(-)ตั้งต้นไว้ให้ และสามารถย่อ-ยุบตามปกติได้แล้วค่ะ เพิ่มเติม นอกจากนี้ ผู้เขียนขอแถมให้อีกนิดสำหรับท่านที่ต้องการจะย่อประเภทกลุ่มทั้งหมด หรือต้องการให้แสดงประเภทกลุ่มทั้งหมด อาจจะทำเป็นปุ่มให้ผู้ใช้กด ซึ่งมีวิธี ดังนี้ค่ะ 1. สร้างปุ่ม 2 ปุ่ม เพื่อกดขยายทั้งหมด และย่อทั้งหมด 2. เขียนฟังก์ชั่นในการซ่อน/แสดงทั้งหมด ผลลัพธ์ หมายเหตุ : ในการทำงานนี้จะใช้ jQuery และ Bootstrap ร่วมด้วย ผู้ที่จะนำไปใช้งานอย่าลืมอ้างอิงไฟล์สไตล์ชีทและสคริปท์ของ Bootstrap รวมทั้งไฟล์ของ jQuery เพื่อให้โค้ดข้างต้นสามารถทำงานได้นะคะ ทั้งหมดนี้ก็เป็นเพียงหนึ่งในตัวอย่างวิธีการที่จะแก้ปัญหาในการแสดงผลข้อมูลแบบตารางด้วย GridView แบบจัดกลุ่มและสามารถย่อ-ยุบข้อมูลภายในกลุ่มได้ โดยนำความสามารถของ Component อย่าง collapse ใน Bootstrap เข้ามาช่วยเท่านั้น แต่ในส่วนของรูปแบบ วิธีการ แต่ละท่านสามารถปรับเปลี่ยนและพลิกแพลงเพิ่มเติมได้ตามความเหมาะสม อีกทั้งยังสามารถนำเกร็ดความรู้นี้ไปประยุกต์ใช้กับงานของท่านได้อีกด้วย และขอบคุณที่ติดตามนะคะ ^^ แหล่งอ้างอิง https://getbootstrap.com/docs/4.0/components/collapse/https://www.geeksforgeeks.org/how-to-change-symbol-with-a-button-in-bootstrap-accordion/

งานกราฟฟิกฟรี ถูกลิขสิทธิ์มีอยู่จริง

May 28, 2021 16:19

ปัจจุบันงานกราฟฟิกได้เข้ามามีบทบาทมากมายในด้านการโฆษณา การขาย การออกแบบและดีไซน์ผลงานต่างๆ รวมถึงการนำมาใช้พัฒนาระบบ หรือ แอพพลิเคชันต่างๆมากมายโดยมาจากการใช้ชุดอักขระ (Font) หรือรูปภาพ Vector ต่างๆมาเป็นส่วนประกอบ เราจะเห็นได้ว่าส่วนใหญ่แล้วเป็นงานลิขสิทธิ์ทั้งสิ้น การที่จะนำมาใช้งานได้ต้องมีการซื้อ License การใช้งานหรือการขออนุญาตจากเจ้าของผลงานก่อน จะทำยังไงหละถ้าเราอยากใช้งานแบบถูกลิขสิทธิ์แถมไม่ต้องจ่ายเงินสักบาท เว็ปไซต์ Creative Market https://creativemarket.com/ เป็นอีกหนึ่งเว็ปไซต์ที่รวบรวมงานศิลปะ, งานกราฟฟิก Vector, Font, Template สำหรับงานออกแบบ, Template สำหรับการสร้างเว็ปไซต์, รูปถ่าย หรือจะเป็น Brush หัวพู่กันในโปรแกรมต่างๆ มารวมไว้เป็น Market ของนักออกแบบหลายๆคนรวมอยู่ในเว็ปไซต์ เราสามารถเข้าไปกดซื้อ แล้วนำมาใช้งานได้เลย สะดวกรวดเร็ว เชื่อถือได้ แต่ แต่ แต่ ไหนบอกว่าฟรีหละ ทาง Creative Market ได้มีการทำระบบ Free Goods of the Week https://creativemarket.com/free-goods ซึ่งจะนำงานกราฟฟิกต่างๆในระบบแจกฟรีๆ สัปดาห์ละ 6 รายการ โดยการเข้าไปที่เมนู Get Inspired แล้วเลือก Free Goods (ที่ไม่ได้แปลว่าถูกดีนะ แต่แปลว่า สินค้าฟรีนั้นเองครับ) ให้เราทำการ Sign Up สมาชิกกับทางระบบก่อน เพื่อที่จะใช้ในการเก็บสินค้าที่แจกฟรีเข้าไปไว้ใน Account ของเราเอง สามารถกลับมาโหลดไปใช้งานได้ในอนาคตครับ เมื่อเราเข้ามาในหน้า Free Goods แล้วก็จะมีในส่วนของ เวลาที่นับถอยหลัง ตรงนี้คือเวลาที่จะแจกสินค้า จะเริ่มนับจากต้นสัปดาห์ เราต้องเข้ามากด Free Download ให้ทันก่อนเวลาจะหมดเพื่อที่จะเก็บเข้า Account ของเรา ถัดมาจะเป็นหลอด Progress bar ถ้าเราซื้อครบ 15$ เราจะสามารถ Download สินค้าฟรีที่เป็น Extra ของสัปดาห์นั้นได้ และสุดท้ายคือรายการสินค้าที่แจกฟรี ซึ่งเราสามารถกด Sync to Dropbox ก็ได้ถ้ามีการเชื่อมต่อเอาไว้ หรือจะกด Free Download เพื่อดาวน์โหลดมาเก็บไว้ก็ได้ เพียงเท่านี้เราก็จะได้งานกราฟฟิกต่างๆมาแบบฟรีๆ มีลิขสิทธิ์โดยการเข้ามากดรับสินค้าทุกๆสัปดาห์ สะสมไว้เรื่อยๆ นำมาใช้ได้ในทุกๆโอกาส ทั้งนี้ทั้งนั้น การนำมาใช้ในเชิงพาณิชย์ กรุณาอ่านและศึกษา License เพิ่มเติมจากหน้ารายละเอียดสินค้าเนื่องจากบางครั้งก็ให้ License แบบ Personal Use ไม่ใช่ Commercial จะได้ไม่โดนฟ้องจากเจ้าของผลงานนะครับ กด Download แล้ว ไปตรวจสอบได้จากที่ไหนหละ ว่าสินค้านั้นเข้าตัวเราแล้ว ให้เราไปที่มุมขวา จะมีรูปโปรไฟล์ของท่านอยู่ ให้ทำการ Hover ไว้ จะมีเมนูโผล่ขึ้นมาแล้วเลือกเมนู My Purchases ก็จะมาในหน้าที่ชื่อว่า Purchases หรือสินค้าที่เคยซื้อไปแล้ว ตรงนี้ก็จะเป็นคลังที่เคยกดสะสมไว้ สินค้าที่เคยกด Download จากหน้า Free Goods ก็จะมีอยู่ที่หน้านี้ ซึ่งสามารถมากด Download ย้อนหลังได้เลยครับ Tips เล็กๆน้อยๆ ในการกด Free Download เพื่อเก็บสินค้าเข้า Account เรา ไม่จำเป็นต้อง Download ลงเครื่องเราจริงๆ เพียงแค่กด Free Download จะมีหน้าต่าง Browse File ขึ้นมาให้เลือกสถานที่บันทึกไฟล์ให้กด Cancel หรือยกเลิกออกมาได้เลย เท่านี้ระบบก็เข้าใจแล้วว่าเราได้ทำการซื้อสินค้าชิ้นนั้นไปแล้วจริงๆ (ตรวจสอบได้จาก Email แจ้งเตือนว่ามีการกดสินค้าชิ้นนั้นๆไป) จริงๆแล้วใน Creative Market ยังมีระบบ Blog แชร์เทคนิคการออกแบบและระบบ Community นักออกแบบด้วย ครบจบทุกอย่างเรื่องการออกแบบและดีไซน์ในเว็ปเดียว นอกจากกดของฟรีกันแล้ว ถ้ามีโอกาสอยากให้กดซื้อ ช่วยกันอุดหนุน นักออกแบบถ้ามีสินค้าที่ถูกใจเพื่อเป็นกำลังใจ เป็นค่าความคิดสร้างสรรค์ ค่าอุปกรณ์และอีกหลายๆอย่างนะครับ ขอบคุณทุกท่านที่เข้ามาอ่านครับ ไว้เจอกันโอกาสหน้าครับ 😀