ถ้าต้องการจะหาเครื่องมืออะไรสักอย่างที่สามารถเขียนโค้ดได้ก่อนที่จะนำไปลงในโปรแกรม สำหรับผมแล้วจะค้นหาคำว่า Playground ลงใน Google นะครับ ซึ่งถ้าแปลตรงตัว (Playground จะแปลว่าสนามเด็กเล่น) การที่เราหาคำนี้ลงในโปรแกรมหรือภาษาสำหรับทดลองโค้ดก่อน ก็เปรียบเสมือนมาลองเล่นในสนามทดลองก่อนนั้นเอง
ซึ่งสำหรับตัวทดลองของ Flutter หรือภาษา Dart นั้นก็มีหลายตัวนะครับ แต่อยากมาแนะนำอันนี้เพราะรู้สึกว่าพิเศษ หรือเวลาเราค้นหาก็ไม่ได้ใช้คีเวิร์ด Playground ก็ได้นะครับ จะใช้ Complier ก็ได้ เช่นเวลาค้น “Dart Complier” , “Java Complier” , “Swift Complier” แต่สำหรับเนื้อหานี้คือใช้คือ “Dart Playground” ครับ
เว็บไซต์ DartPad
เราสามารถที่จะเขียนโค้ด Dart อะไรก็ได้ลงในแถบด้านซ้ายได้เลย จากนั้นมันจะแสดงผลลัพธ์ออกมาทางด้านหน้าจอด้านขวาตรง Console ครับ หรือถ้ามันจะมี Error ก็จะแจ้งออกมาก่อนที่จะแสดงผลลัพธ์
ข้อดี : คือสามารถที่จะทดลองการเขียนโค้ดได้ก่อนที่จะนำไปลงในโปรเจคครับ เพราะบางทีในโปรเจคมีโค้ดที่เยอะมาก ทำให้อาจจะมึนงงได้ โค้ดตีกันมั่วไปหมด การมาทดลองโค้ดก่อนจึงเป็นเรื่องที่ดี เพราะเราจะได้รู้ว่าสิ่งที่เราจะนำไปใส่ในโปรเจคของเรานั้นสามารถทำงานได้อย่างถูกต้องหรือไม่ ถ้าไม่ถูกก็จะแก้ใน DartPad ได้เลย วางตัวแปรต่างๆให้ครบและถูกต้องในนี้ แล้วค่อย Copy ไปใส่นั้นเองครับ
อย่างตัวอย่างนี้คือการ Get Http Request จากโดเมนนึงในภาพ เราสามารถรู้ได้ก่อนว่าผลลัพธ์มันจะออกมายังไง สามารถ Get มาได้รึเปล่า ถ้าได้ก็ในไปใส่ใน Function บนโปรเจคได้สบายๆ
แต่มีอีก 1 จุดที่เรียกได้ว่าเป็นพระเอกได้มั้ย นั้นคือสามารถเปิดตัวอย่าง Flutter ออกมาเล่นได้ด้วย ตอนแรกคิดว่าจะทดลองได้แค่โค้ด Dart แต่เราสามารถกดตรง Sample ที่ด้านบนขวาได้เลย จะมีตัวอย่างโปรเจค Flutter มาให้ลองเล่น ซึ่งมีหลายตัวอย่างเลยนะ และก็เช่นเคยครับ เราเขียนโค้ดทางซ้าย และแสดงผลลัพธ์ทางขวาแต่อันนี้ได้ออกมาเป็น UI ของ Flutter เลย เร็วกว่าไปนั่งเปิด Emulator แล้วกด Flutter run ครับ ซึ่งส่วนตัวมันช้ามาก และอาจจะรันไม่ผ่านด้วยเหตุผลต่างๆนาๆ
และนี้ก็เป็นเว็บไซต์ดีๆของคนเขียน Flutter นะครับ อยากให้ไปลองใช้กัน มันจะเป็นประโยชน์มาก ส่วนตัวผมใช้มาสักพักแล้ว ก็รู้สึกโค้ดและมีโค้ดหลายชุดที่ได้ Dartpad ช่วยไว้ครับ เช่น บางทีเราเขียน Array ที่มีการวนค่าหลายๆตัว การเขียน Playground ก่อนจะช่วยได้มาก เราจะรู้ได้ก่อนเลยว่าอะไรผิดหรือถูก
ดูตัวอย่าง Youtube : https://youtu.be/qCdg1hFT5FE
สอบถามเพิ่มเติมได้ที่ LineId : tanat29
