Web Application หรือ Web App คืออะไร

Sep 29, 2023

Web application หรือ "Web app" คือแอปพลิเคชันซอฟต์แวร์ที่ทำงานบนเว็บเบราว์เซอร์ ต่างจากแอปพลิเคชันซอฟต์แวร์แบบดั้งเดิมที่ต้องติดตั้งบนอุปกรณ์ของผู้ใช้ สามารถเข้าได้จากเว็บเบราว์เซอร์ เช่น Chrome, Firefox, Safari หรือ Edge พื้นฐานของอุปกรณ์คอมพิวเตอร์ที่ใช้งานกันในปัจจุบัน ไม่ว่าจะเป็นระบบปฏิบัติการใดก็ตาม สิ่งที่ทุกอุปกรณ์ต้องมีคือการเชื่อมต่ออินเตอร์เน็ต ซึ่งหนึ่งในแอพพลิเคชั่นที่ต้องมีติดทุกเครื่องคือเว็บบราวเซอร์ที่ทำหน้าที่เป็นตัวแสดงผลข้อมูลทางอินเตอร์เน็ต โดยเว็บแอพพลิเคชั่นคือหนึ่งในปลายทางที่สามารถเข้าถึงได้ผ่านบราวเซอร์

Web application ลบข้อจำกัดเดิม

เข้าถึงได้จากทุกที่ที่มีอินเทอร์เน็ต

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

ไม่จำเป็นต้องติดตั้ง

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

การปรับใช้

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

ตอบสนองวัตถุประสงค์ได้หลากหลาย

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

ประเภทของเว็บแอปพลิเคชัน

1) Client web app (Front end application)

เว็บแอปพลิเคชันฝั่งไคลเอ็นต์ เรียกว่า "แอปฝั่งไคลเอ็นต์" หรือ "Front end application" เป็นเว็บแอปพลิเคชันประเภทที่แสดงผลให้ผู้ใช้ได้ใช้งาน การแสดงผลเกิดขึ้นบนอุปกรณ์ของผู้ใช้ (ฝั่งผู้ใช้)

  • ลักษณะและส่วนประกอบ

    User Interface  (UI)
    การออกแบบผู้ใช้ของเว็บแอปฝั่งไคลเอ็นต์ได้รับการออกแบบโดยใช้ HTML สำหรับการจัดโครงสร้างเนื้อหา, CSS สำหรับการตกแต่งและ JavaScript สำหรับการโต้ตอบ โดยสามารถเปิดได้จากเว็บบราวเซอร์โดยตรง

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

    Single Page Application (SPA)
    เว็บส่วนมากถูกสร้างขึ้นเป็นแอปพลิเคชันหน้าเดียว โดยที่โหลดเป็นหน้า HTML เดียว จากนั้นมีการพัฒนาให้เว็บสามารถตอบโต้ได้โดยการใช้ JavaScript โดยใช้เฟรมเวิร์ก เช่น React Angular หรือ Vue.js โดยเฟรมเวิร์คเหล่านี้จะช่วยให้เว็บแอพมีความเสถียรและราบรื่นมากยิ่งขึ้น

    Data Retrieval
    เว็บแอพมักจะส่งคำขอแบบ asynchronous ไปยังเซิร์ฟเวอร์หรือ API ภายนอกโดยใช้เทคโนโลยี เช่น AJAX หรือ Fetch API เพื่อดึงข้อมูล ข้อมูลที่ดึงมาสามารถแสดงแบบไดนามิกบนเพจได้โดยไม่ต้องโหลดซ้ำทั้งหน้า

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

    Security
    ความปลอดภัยถือเป็นข้อกังวลที่สำคัญสำหรับแอปฝั่งไคลเอ็นต์ เนื่องจากโค้ดและข้อมูลที่ละเอียดอ่อนถูกเปิดเผยต่อผู้ใช้ นักพัฒนาต้องใช้มาตรการรักษาความปลอดภัยเพื่อป้องกันช่องโหว่ เช่น การเขียนสคริปต์ข้ามไซต์ (XSS) และการเปิดเผยข้อมูล

2) Server side web app (Back end)


แอปพลิเคชันเหล่านี้ประมวลผลข้อมูลบนเซิร์ฟเวอร์ก่อนที่จะส่งข้อมูลไปยังเบราว์เซอร์ของผู้ใช้ ประกอบไปด้วยเทคโนโลยีหลายด้าน เช่น ภาษาสคริปต์ฝั่งเซิร์ฟเวอร์ (เช่น PHP, Python, Ruby) และฐานข้อมูล โดยเป็นเว็บแอปพลิเคชันประเภทหนึ่งที่ตรรกะและการประมวลผลของแอปพลิเคชันเกิดขึ้นบนเซิร์ฟเวอร์ แทนที่จะเป็นบนอุปกรณ์ของผู้ใช้

  • ลักษณะและส่วนประกอบ

    Service Side Processing
    เซิร์ฟเวอร์จะประมวลผลคำขอจากไคลเอนต์ เชื่อมต่อกับฐานข้อมูล เพื่อส่งไปยังเบราว์เซอร์ของไคลเอ็นต์ เบราว์เซอร์ของลูกค้าได้รับเนื้อหาที่แสดงผลล่วงหน้า

    Database
    แอปพลิเคชันฝั่งเซิร์ฟเวอร์มักใช้ฐานข้อมูลเพื่อจัดเก็บและจัดการข้อมูล ระบบฐานข้อมูลทั่วไป ได้แก่ MySQL, PostgreSQL, MongoDB และอื่นๆ เซิร์ฟเวอร์โต้ตอบกับฐานข้อมูลเพื่อดึงและอัปเดตข้อมูล

    Server side scriping language
    ภาษาสคริปต์ฝั่งเซิร์ฟเวอร์ เช่น PHP, Python, Ruby, Node.js (JavaScript) และ Java มักใช้ในการพัฒนาเว็บแอปพลิเคชันฝั่งเซิร์ฟเวอร์ ภาษาเหล่านี้มีหน้าที่ในการจัดการคำขอของผู้ใช้ ประมวลผลข้อมูล และสร้างเนื้อหาแบบไดนามิก

    Dynamic Content Generation
    แอปฝั่งเซิร์ฟเวอร์สร้างเนื้อหาแบบไดนามิกตามอินพุตของผู้ใช้ การสืบค้นฐานข้อมูล หรือการคำนวณฝั่งเซิร์ฟเวอร์อื่นๆ เนื้อหานี้สามารถปรับให้เข้ากับผู้ใช้แต่ละคน ทำให้เหมาะสำหรับแอปพลิเคชันที่มีการอัปเดตแบบเรียลทาม เช่น ฟีดโซเชียลมีเดีย รอีคอมเมิร์ซ และเว็บ CMS

    Security
    ความปลอดภัยถือเป็นข้อกังวลที่สำคัญสำหรับแอปพลิเคชันฝั่งเซิร์ฟเวอร์ โดยต้องใช้มาตรการรักษาความปลอดภัยเพื่อป้องกันช่องโหว่บนเว็บทั่วไป เช่น การแทรก SQL, การเขียนสคริปต์ข้ามไซต์ (XSS) และการปลอมแปลงคำขอข้ามไซต์ (CSRF)

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

การประยุกต์ใช้

Web application (Web app) ใช้เพื่อวัตถุประสงค์ที่หลากหลายในอุตสาหกรรมและโดเมนต่างๆ สิ่งเหล่านี้กลายเป็นส่วนสำคัญของทั้งกิจกรรมส่วนบุคคลและทางธุรกิจเนื่องจากความสามารถในการเข้าถึง ความสามารถในการปรับขนาด และความเข้ากันได้ข้ามแพลตฟอร์ม ต่อไปนี้คือการใช้งานเว็บแอปพลิเคชันทั่วไปบางส่วน:

Content

- เว็บข่าว เว็บแอปช่วยหน้าฟีดของข่าวมีความเรียลทาม สามารถรีโหลดข้อมูลได้ตลอดเวลา  
- บล็อกและนิตยสารออนไลน์ ผู้สร้างเนื้อหาใช้เว็บแอปเพื่อเผยแพร่บทความ รูปภาพ และเนื้อหามัลติมีเดีย

Social Media

- Platform เช่น Facebook, Twitter, Instagram และอื่นๆ เป็นตัวอย่างของเว็บแอปที่ช่วยให้ผู้ใช้สามารถเชื่อมต่อ แชร์ และสื่อสารออนไลน์ได้
- Email hosting บริการอีเมลบนเว็บ เช่น Gmail, Yahoo Mail และ Outlook เป็นที่นิยมในการจัดการการสื่อสารทางอีเมล

Ecommerce

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

Collaboration

- Office suits เช่น  Google Workspace และ Microsoft 365 มีแอปพลิเคชันการแก้ไขเอกสารบนเว็บ โดยสามารถแก้ไขข้อมูลร่วมกันในไฟล์แบบเรียลทาม
- Project management เช่น Trello, Asana และ Jira ช่วยเหลือทีมในการจัดการโครงการ และ Workflow ร่วมกัน

Entertainment and Media

- Steaming platform เช่น Netflix, YouTube, Spotify และแพลตฟอร์มสตรีมมิ่งอื่นๆ ที่นำเสนอเนื้อหาบนคลาวผ่านแอพพลิเคชั่น
- Games เกมบนเบราว์เซอร์และแพลตฟอร์มเกมสามารถเข้าถึงได้ผ่านเว็บเบราว์เซอร์

Financial service

- Digital bank ธนาคารมีแอปพลิเคชันบนเว็บสำหรับทำธุรกรรม และจัดการการเงิน
- Stock Broker บริษัทนายหน้าและการลงทุนนำเสนอเว็บแอปสำหรับซื้อขายหุ้น พันธบัตร และหลักทรัพย์อื่นๆ

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

TeamCMD

We are CODEMONDAY team and provide a variety of content about Business , technology, and Programming. Let's enjoy it with us.