Web Application History | จุดเริ่มต้นของ Website ในปัจจุบัน

Boon Worayut Aksornukul
SCB Engineer
Published in
2 min readOct 16, 2023
Photo by Stanislav Kondratiev: https://www.pexels.com/photo/books-on-wooden-shelves-inside-library-2908984/

วันนี้จะพามารู้จักที่มาและการพัฒนาการของ Web Application ของแต่ละยุคกัน

หลายคนอยากจะรู้จักหรือคุ้นๆ หูกับ HTTP และ HTML กัน แต่หารู้ไม่ว่าสองสิ่งนี้เริ่มต้นจากคนๆเดียวกัน คน ๆ นั้นมีชื่อว่าคุณ Tim Berners-Lee ซึ่ง ณ เวลานั้นเค้าเป็นนักวิทยาศาสตร์อยู่ที่ CERN

  • HTTP = Hypertext Transfer Protocol
  • HTML = Hypertext Markup Language

จุดประสงค์แรกขง HTTP และ HTML นั้นเอาไว้สำหรับ การเขียน Research Paper

แล้ว Hypertext มันคืออะไร???

Hypertext มันก็คือ text หรือข้อความที่เชื่อมไปยัง text ต่างๆ ได้ ให้นึกถึง hyperlink ที่เราใช้ในการเชื่อมข้อความใน MS Word เพิ่มลิงค์ไปยังเว็ปไซต์อื่น ๆ

HTTP มันคือ Protocol หรือ กฎในการส่งข้อมูล ประมาณว่าต้องเขียนหัวกระดาษยังไงให้ server เข้าใจว่าเราต้องการข้อมูลส่วนนี้นะ

ส่วน HTML ตามชื่อเลย คือมันเป็น Markup Language เป็นภาษาที่บอก Web Browser ว่าจะให้แสดงข้อมูลอะไร แบบไหน อย่างเช่น ให้แสดงข้อความ โดยให้ส่วนไหนเป็น ตัวหนา (Bold) หรือ ตัวเอียง (Italic) เป็นต้น

ทีนี้ก็มีคนเห็นประโยชน์ของสิ่งที่คุณ Tim Berners-Lee ใช้ในเวลานั้น แล้วคิดว่ามันสามารถนำไปอย่างอื่นได้อีก เช่น ระบบยืมหนังสือ, เว็ปขายของ เป็นต้น

แต่ด้วย HTML ที่เป็นเพียงภาษาในการแสดงข้อมูลเฉยจะดูเป็นส่ิงที่ซับซ้อนเกินไป เลยต้องมีสิ่งที่เรียกว่า CGI

  • CGI = Common Gateway Interface

CGI เป็น โปรแกรมหนึ่งที่สามารถใส่ Business Logic ต่างๆ และแสดงผลร่วมกับ HTML ได้นั้นเอง

โปรแกรม CGI สามารถเขียนด้วยภาษาอะไรก็ได้ที่สามารถแสดงผลผ่านทาง Standard Output ได้ ส่วนภาษาที่นิยมใช้ เช่น C และ Perl ซึ่งในปัจจุบันบริษัทใหญ่ ๆ ที่ยังให้ CGI อยู่ คือ Booking.com

ด้านล่างนี้จะเป็นตัวอย่างการเขียน CGI ในภาษา C

#include <stdio.h>

int main() {
// Print the HTTP header to specify the content type as plain text
printf("Content-type: text/plain\n\n");

// Print the content
printf("Hello, World!\n");

return 0;
}

ด้านล่างนี้จะเป็นตัวอย่างการเขียน CGI ในภาษา Python

print("Content-type: text/html\n")
print("<html><head><title>Simple Python CGI</title></head><body>")
print("<h1>Hello, World!</h1>")
print("</body></html>")

สำหรับ Web Application ยุคที่ 1 (HTML + CGI) จะอยู่ในช่วงประมาณ 1990s ซึ่ง Business Logic ต่างๆ จะถูกเขียนอยู่ใน CGI และมีการแสดงผลโดยใช้ HTML นั้นเอง

ยุคต่อไปของ Web Application จะเป็นการรวม Business Logic ต่างๆ ลงไปในไฟล์เดียวกันกับ HTML ซึ่งทำให้การเขียนเว็ปสะดวกมากยิ่งขึ้น

ภาษาที่ได้รับความนิยมในยุคนี้คือ PHP (Hypertext Preprocessor) และยังสามารถเขียนด้วยภาษา Java ด้วย JSP หรือ JavaServer Pages ได้ด้วยเช่นกัน

ด้านล่างนี้จะเป็นตัวอย่างการเขียน PHP ในไฟล์ HTML

<!DOCTYPE html>
<html>
<head>
<title>Simple PHP in HTML</title>
</head>
<body>
<h1><?php echo "Hello, World!"; ?></h1>
</body>
</html>

ด้านล่างนี้จะเป็นตัวอย่างการเขียน Java (JSP)ในไฟล์ HTML

<!DOCTYPE html>
<html>
<head>
<title>Simple JSP in HTML</title>
</head>
<body>
<h1><% out.println("Hello, World!"); %></h1>
</body>
</html>

ยุคที่ 2 ของ Web Application นั้นเกิดขึ้นช่วงปลาย 1990s โดย PHP เกิดขึ้นปี 1995 และ JSP เกิดขึ้นช่วง 1999 โดยบริษัท Sun Microsystems (ในปัจจุบันได้ถูกซื้อโดย Oracle Corporation เป็นที่เรียบร้อยแล้ว)

ในยุคต่อไปของ Web Application จะเป็นยุคที่นิยมใช้ที่สุดในปัจจุบัน (ปัจจุบัน = วันที่เขียน October 2023) ซึ่ง Design Pattern ที่ใช้ในยุคนี้เรียกว่า MVC หรือ Model-View-Controller ซึ่งเมื่อ user มีการส่ง request เข้ามา จะถูกโปรแกรมดักไว้ทั้งหมด และ controller จำทำหน้าที่ส่งต่อ request ไปให้ subprogram หรือ function ที่ถูกต้องในการทำงานต่อไป

Simple diagram showing how the user requests are handled in MVC framework

โดยการเขียนด้วย Framework แบบนี้สามารถเขียนได้ด้วยหลายภาษา เช่น Ruby, Python, Java เป็นต้น โดยแต่ละภาษาจะมีชื่อเรียก Framework เป็นของตัวเอง เช่น

  • Rails (Ruby)
  • Django (Python)
  • Spring Framework (Java)
  • Laravel (PHP)

ตัวที่เป็นผู้บุกเบิกและผู้นำในยุคนี้คือ Rails Framework โดยใช้ภาษา Ruby

ในอดีตมีคนเคยคิด Framework นี้แล้วโดยใช้ Java แต่ตอนนี้ยังไม่ดังและเป็นที่รู้จัก และเนื่องจากมีปัญหาคอขวด หรือ Bottleneck Performance Issue จากการรับ Request ทั้งหมดมาเก็บไว้ก่อน

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

ถ้าถามว่าเรื่องในวันนี้จะรู้ไปทำไมนั้น ผมก็ไม่รู้เหมือนกัน 555 แต่ส่วนตัวที่ต้องการย้ายมาทำงานด้าน Software Developer/Engineer อย่างจริงจัง คิดว่าการรู้ที่มาที่ไปของแต่ละยุคทำให้การ coding สนุกขึ้นและทำให้เข้าใจจุดประสงค์ของ framework หรือ protocol ของแต่ละภาษาหรือเทคนิคมากขึ้น (ซึ่งหลายครั้ง ถ้ายังไม่เข้าใจที่มาแล้วทำตามตัวอย่างโค้ด ก็ได้แต่ อีหยังวะ ว่าทำไปทำไม 555)

--

--