Front-end ค ออะไร ม เทคโนโลย และภาษาอะไรท เก ยวข อง

การทำเว็บแอพพลิเคชั่นในปัจจุบันประกอบด้วยส่วนต่างๆซึ่งใช้บุคลากรต่างกันออกไป บทความนี้จะพูดถึงตำแหน่งต่างๆอย่างคร่าวๆ แต่จะลงลึกในส่วนของ front-end engineer เพียงตำแหน่งเดียวครับ

เรามาดูกันว่าตำแหน่งต่างๆในทีมนั้นมีอะไรบ้าง

Back-end engineer — รับผิดชอบเกี่ยวกับระบบหลังบ้านทั้งหมด อาจจะมีแยกย่อยลงไปได้อีกในแง่ของความรับผิดชอบ เช่น ระบบฐานข้อมูล API ที่ใช้เชื่อมต่อ เป็นต้น

Front-end engineer — รับผิดชอบส่วนเชื่อมต่อกับผู้ใช้ทั้งหมด บางครั้งอาจทำส่วนของ API ที่เชื่อมต่อกับเซิฟเวอร์ด้วย

Quality engineer — รับผิดชอบในส่วนของคุณภาพของแอพพลิเคชั่น ส่วนมากจะทำการเขียน Automated test หรือการเขียนโปรแกรมให้ทดสอบแอพพลิเคชั่นนั่นเอง

Product Owner — รับผิดชอบการวางแนวทางของแอพพลิเคชั่นว่าจะให้มีฟังก็ชั่นการใช้งานอะไรบ้าง เป็นผู้ให้รายละเอียดต่างๆเกี่ยวกับฟังก์ชั่นต่างๆ

เมื่อลองดูความรับผิดชอบของแต่ละตำแหน่งแล้ว หลายๆท่านอาจจะคุ้นเคยกับ Back-end engineer มากกว่า เนื่องจากมีความใกล้เคียงกับสิ่งพื้นฐานที่เรียนมาในมหาวิทยาลัยมากกว่า ทำให้หลายๆท่านรวมถึงตัวผมเองด้วยเข้าใจว่าการทำ Front end นั้นง่าย

ทำไมหลายๆท่านคิดว่างานนี้ง่าย?

การที่มีตัวช่วยในการทำเว็บไซต์มากมายอาจจะเป็นสาเหตุหนึ่งที่ทำให้หลายๆท่านคิดว่างานนี้ไม่ยากเลย เมื่อพูดถึงการทำเว็บไซต์ปกติที่ไม่ได้มีอะไรซับซ้อน หลายๆคนอาจจะเลือกใช้ CMS ต่างๆที่มีอยู่มากมายเช่น WordPress, Joomla และ Drupal รวมถึงตัวช่วยอย่าง WIX, Squarespace, Weebly ทำให้คนสามารถสร้างเว็บไซต์เองได้ง่ายมากๆ แต่นั่นยังไม่ใช่เว็บแอพพลิเคชั่นที่เราพูดถึงกันในบทความนี้ครับ

ผมก็เป็นคนนึงที่เคยคิดว่า front end ง่ายและไม่น่าสนใจ ตั้งแต่เรียนมาเราอยู่กับ Back-end มาโดยตลอด อีกทั้งยังคิดว่า front end มีแค่ HTML กับ CSS เท่านั้น แถมไม่ค่อยมีโอกาสที่จะได้สัมผัสว่าจริงๆแล้วเค้าทำอะไรกัน รวมถึงผมเองก็เขียนเว็บไซต์มาก่อนโดยใช้ตัวช่วยต่างๆตั้งแต่สมัย Netscape Composer ทำให้คิดว่ามันไม่เห็นจะยากเลย แต่พอได้มาทำงานในตำแหน่งนี้แล้วจึงรู้ว่ามันมีอะไรที่มากกว่านั้น

ทำไมต้องมี engineer เฉพาะทาง?

หน้าที่หลักๆของ Front-end engineer คืออะไร คำตอบก็คือเขียนเว็บแอพพลิเคชั่นให้ได้งามตามที่ออกแบบมาโดยที่มีประสิทธิภาพ (Performance) ที่ดี และเข้าถึงได้จากผู้ใช้ทุกคนด้วย (Accessibility) การทำให้เว็บหน้าตาเหมือนกับที่ designer ออกแบบใน Photoshop อาจจะไม่ยาก แต่การทำให้ผู้ใช้ทุกคนเข้าถึงส่วนต่างๆของ application เราได้นั้นยากกว่ามาก ประสิทธิภาพของแอพพลิเคชั่นขึ้นอยู่กับปัจจัยต่างๆมากมาย และต้องทำให้ทำงานได้ในทุกๆบราวเซอร์ ซึ่งข้อนี้แตกต่างกับงาน back-end ตรงที่เราไม่สามารถกำหนดได้ว่าแอพพลิเคชั่นของเราจะทำงานในสภาพแวดล้อมใด ซึ่งความท้าทายต่างๆของ Front-end engineer มีดังนี้ครับ

Accessibility

การทำให้ผู้ใช้สามารถเข้าถึงแอพพลิเคชั่นของเราได้นั้นเป็นสิ่งสำคัญอันดับต้นๆของการพัฒนาแอพพลิเคชั่น ตอนผมเรียนปี 4 ผมได้มีโอกาสทำโปรเจคจบในห้องปฏิบัติการวิจัยเทคโนโลยีช่วยเหลือซึ่งตอนนั้นทำเกี่ยวกับการช่วยเหลือผู้พิการทางสายตา ผมได้เห็นเทคโนโลยีต่างๆเช่น โปรแกรมอ่านหน้าจอ โปรแกรมสังเคราะห์เสียงภาษาไทย เป็นต้น และเมื่อผมเริ่มทำงาน ที่ทำงานแรกก็มีห้องปฏิบัติการเกี่ยวกับการเข้าถึงโดยเฉพาะ ที่นี่ผมได้เรียนรู้ว่าผู้ใช้งานของเรานั้นมีทั้งผู้ที่ไม่สามารถใช้ mouse ได้ ขยับตัวไม่ได้และใช้สายตาในการควบคุม รวมถึงผู้พิการทางสายตาด้วย ในอเมริกามีสิ่งที่เรียกว่า 508 Compliance ซึ่งกำหนดให้ผู้ที่ได้รับเงินทุนจากรัฐบาลต้องทำให้ผู้ใช้งานทุกคนเข้าถึงได้

Performance

ประสิทธิภาพของเว็บแอพพลิเคชั่นในส่วนของ front end ผมจะขอพูดถึงสองส่วนใหญ่ๆดังนี้

ประสิทธิภาพด้านหน่วยความจำและประมวลผล

ปัญหานี้อาจจะไม่เกิดขึ้น ถ้าคุณเขียนแอพพลิเคชั่นเล็กๆ ข้อมูลไม่มากเท่าไหร่ไม่มีอะไรซับซ้อน การใช้เฟรมเวิร์คที่เหมาะสมก็น่าจะช่วยให้คุณได้แอพพลิเคชั่นที่มีประสิทธิภาพดีได้แล้ว แต่เมื่อคุณต้องทำงานที่ซับซ้อนมากขึ้น ข้อมูลมีขนาดใหญ่ขึ้น คุณอาจจะต้องหาวิธีใหม่ที่ดีกว่า การส่งข้อมูลในรูปแบบเดิมอาจจะไม่ดีเหมือนเดิม ตัวอย่างเช่น คุณอาจจะเคยดึงข้อมูลทั้งหมดจากเซิฟเวอร์มาเก็บไว้รอแสดงผล แต่เมื่อข้อมูลมากขึ้นการทำแบบนี้ทำให้คุณเสียหน่วยความจำไปกับข้อมูลที่ผู้ใช้อาจจะไม่เห็นเลยก็ได้

ประสิทธิภาพที่ผู้ใช้รู้สึก (User Perceived Performance)

ปัญหานี้เป็นปัญหาใหญ่ของหลายๆแอพพลิเคชั่น ผู้ใช้ส่วนมากจะเลิกใช้งานเว็บนั้นๆหากใช้เวลาโหลดมากกว่า 3 วินาที แอพพลิเคชั่นส่วนใหญ่จึงพยายามแสดงผลให้ผู้ใช้ได้รับรู้ว่ากำลังทำงานอยู่ ตัวอย่างเช่น การแสดงข้อความว่ากำลังโหลดข้อมูล หรือแถบแสดงความคืบหน้าของการทำงาน

เนื่องจากผมทำงานเกี่ยวกับการแสดงผลข้อมูลที่มีขนาดใหญ่ (Big data) ผมจึงได้แก้ปัญหาเกี่ยวกับประสิทธิภาพด้านนี้บ่อยมาก ตัวอย่างหนึ่งคือการแสดงผลข้อมูลขนาดใหญ่ในรูปแบบตารางที่สามารถเลื่อนขึ้นลงอย่างไหลลื่น ทางทีมต้องหาวิธีใหม่ๆมาแก้ปัญหาเพราะวิธีปกติไม่สามารถให้ผลที่ต้องการได้ (รายละเอียดสามารถอ่านได้ใน blog ของบริษัท ครับ)

ตลาดงาน

หลายปีที่ผ่านมามีความต้องการ front-end engineer สูงมาก แต่ทว่าคนที่เข้าใจด้านนี้จริงๆกลับมีน้อย ทำให้เป็นที่ต้องการในตลาดมาก การจะหาคนเข้ามาร่วมทีมใช้เวลานานมากและบริษัทต่างๆก็ต้องต่อสู้กันเองเพื่อแย่งคนเก่งๆ จากประสบการณ์ของผม คนที่สมัครในตำแหน่งนี้แล้วผ่านการคัดเลือกจากทีมมีเพียงแค่ 20% และ 90% ในจำนวนนั้นได้รับการตอบรับเข้าทำงานจากหลายบริษัท ทำให้บริษัทต่างๆต้องแข่งกันในเรื่องของเงินเดือนและหุ้นที่จะให้

จากที่ผมเคยเป็นทั้งผู้สัมภาษณ์และผู้ถูกสัมภาษณ์ ผมไม่เคยถามหรือถูกถามเกี่ยวกับเฟรมเวิร์คที่บริษัทนั้นๆใช้อยู่ ทั้งนี้เพราะทุกๆคนเชื่อว่าถ้ามีคุณมีพื้นฐานที่ดีแล้วคุณจะสามารถเรียนรู้เฟรมเวิร์คใหม่ๆได้อย่างไม่มีปัญหา

เพราะฉะนั้นสิ่งสำคัญไม่ใช่ว่าคุณเก่งเฟรมเวิร์คไหนแล้วจะมีงานรองรับมากกว่า แต่สิ่งที่ทุกคนมองหาคือพื้นฐานที่ดี มีความเข้าใจในตัวภาษาและวิธีปฏิบัติที่ดี (Best Practices) รวมถึงความสามารถในการแก้ปัญหาและประยุกค์ใช้ความรู้ในการแก้ปัญหาครับ

สรุป

Front-end engineer อาจจะเป็นงานที่หลายๆคนมองว่าง่าย แต่ส่วนตัวผมนั้นคิดว่างานนี้มีความยากในตัวมันเองและมีความท้าทายไม่แพ้ทางด้าน Back-end engineer เพียงแต่งานด้านนี้เป็นการแก้คนละปัญหาทำให้เปรียบเทียบกันได้ยาก

ต้องยอมรับว่าตัวผมเองไม่เคยคิดจะสมัครงานด้าน front-end มาก่อน เพราะผมคิดว่ามันน่าเบื่อและไม่ท้าทาย แต่โชคชะตาทำให้ผมได้งานแรกเป็น front-end engineer และนั่นทำให้ผมได้เรียนรู้อะไรมากมายซึ่งมีค่ามากต่อความก้าวหน้าในอาชีพของผมครับ