Front-end และ Back-end คืออะไร

Front-end และ Back-end เป็นส่วนหนึ่งของระบบ CMS (Content Management System) หรือ ระบบจัดการเนื้อหาของเว็บไซต์

front-end  หมายถึง โปรแกรมหนึ่งโปรแกรมใด หรือคอมพิวเตอร์เครื่องหนึ่งเครื่องใดที่ซ่อนรายละเอียดของการเข้าถึงข้อมูลเอาไว้ สรุปง่าย ๆ ได้ว่า ตัวโปรแกรมนั้นเองที่มีตัวเสริมหน้า เป็นตัวกันมิให้ใครเข้าถึงข้อมูลได้ นอกจากจะรู้จักคำสั่งต่าง ๆ จะเรียกกันสั้นๆว่า หน้าบ้าน หรือเป็นส่วนติดต่อผู้ใช้ (User interface) ไม่ว่าจะเป็น หน้าโฮม หน้าเว็บเพจ เนื้อหาต่างๆ รูปภาพ ลิงก์ เป็นต้น เป็นส่วนที่ user ทั่วไปสามารถเห็นและเข้ามาใช้งานได้ของเว็บไซต์ ส่วนนี้จะแสดงหน้าตาของเว็บไซต์ให้ผู้เข้าชมเห็น การออกแบบก็เป็นส่วนที่ช่วยดึงดูดและทำให้ผู้อื่นสนใจเว็บไซต์ ทั้งความสวยงาม การใช้งานเว็บไซต์ที่เข้าใจง่าย สะดวก และทำให้ผู้เข้าชมเห็นว่าเว็บไซต์มีการพัฒนาอยู่ตลอด

back-end หมายถึง ระบบจัดการเว็บไซต์ เปรียบได้กับหลังบ้าน ถือเป็นส่วนการจัดการเนื้อหารวมถึงโครงสร้างของเว็บไซต์ สำหรับให้ผู้ดูแลเว็บไซต์เข้ามาบริหารจัดการเว็บไซต์ จะเรียกกันสั้นๆว่า หลังบ้าน เช่น จัดการฐานข้อมูล โครงสร้างเว็บไซต์ การเขียนโค้ดควบคุม XML, text file, JAVA, PHP, C#, C++ เป็นต้น จะมีไว้สำหรับ admin หรือผู้ที่ได้รับอนุญาต เพื่อทำการ เพิ่ม ลบ แก้ไข เปลี่ยนแปลงเว็บไซต์ ในส่วนของ back-end มีความสำคัญเป็นอย่างยิ่ง ไม่ว่าจะเป็นการรักษาความปลอดภัยของข้อมูล ทั้ง username password ข้อมูลเว็บไซต์ต่างๆ รวมไปถึงการทำงานของเว็บไซต์ ความเร็วในการแสดงผล

Front-end และ Back-end เกี่ยวข้องกันอย่างไร

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

Front-end และ Back-end อะไรสำคัญกว่ากัน ?

          ถ้าการใช้งานเว็บไซต์เน้นการแสดงข้อมูลที่ไม่เยอะ front-end จะต้อง design ให้ออกมาสวยและถูกใจคนเข้าชมเว็บไซต์ แต่ถ้าหากเว็บไซต์ข้อมูลเยอะ ส่วน back-end จะต้องจัดการข้อมูลและจัดการเว็บไซต์อย่างไรเพื่อไม่ให้ระบบนั้นช้าลงในการแสดงผล

อ้างอิง : https://blog.sogoodweb.com/Article/Detail/54053

อ้างอิงรูปภาพ : https://www.designil.com/web-app-guide-2016.html