ปัญหาของคน(เริ่ม)เขียนเว็บ … HTML CSS JavaScript PHP SQL อยากได้แบบนี้ต้องใช้อะไรเขียน?

การเขียนเว็บหรือพัฒนาเว็บขึ้นมานั้นเป็นอะไรที่ไม่ค่อยยากมากนั้นเมื่อ เทียบกับการเขียนโปรแกรมแบบอื่นเช่น แบบ Desktop และ Mobile เพราะส่วนใหญ่แล้วเว็บเวลาแสดงผลในหนึ่งหน้าจะเป็นอะไรที่ไม่ค่อยซับซ้อนมาก นัก (ในกรณีที่เว็บของคุณไม่ได้มีท่ายากวิเศษพิสดารอะไรนะ)

การแสดงผลของเว็บก็ไม่ยากอะไรมากยิ่งถ้าเทียบกับโปรแกรม Desktop ด้วยแล้วเพราะมันมี HTML เอาไว้ร่างโครงสร้างสำหรับแสดงผลอยู่แล้ว

แต่ส่วนใหญ่ปัญหาของคนที่เริ่มเริ่มเขียนเว็บก็คือ

อยากได้แบบเนี้ยะ? ใช้อะไรเขียนล่ะ

ตัวอย่างเช่น

  • อยากให้กดปุ่มนี้แล้วแสดงกล่องล๊อกอินขึ้นมา
  • อยากเขียนระบบโพสต์กระทู้ได้
  • อยากแสดงข้อมูลของสินค้าจาก Database
  • อยากให้ทำปุ่มไลค์

เนื่องจากเทคโนโลยีเว็บมีมากมายหลายตัว มีทั้งที่ใช้ในฝั่ง Client และฝั่ง Server

ภาษาที่ใช้ในการพัฒนาเว็บ

ฝั่ง Client

ประกอบไปด้วย 3 อย่างคือ

  1. Structure หรือส่วนที่บอกโครงสร้างของเว็บ ซึ่งมีอยู่ตัวเดียวที่ใช้กันคือ HTML
  2. Style หรือส่วนที่คุมการแสดงผล ธีม การตกแต่งเว็บที่เป็น HTML ให้สวยงามนั่นเอง
  3. Action มีแค่โครงสร้างกับความสวยงามไม่เพียงพอแล้วในยุคนี้ เว็บต้อง "ตอบโต้กับผู้ใช้ได้ด้วย" เราเรียกส่วนนี้ว่า Client-Side-Script ซึ่งที่ได้รับความนิยมมากที่สุดคือ JavaScript

ฝั่ง Server

ถ้าคุณเปิด facebook.com ขึ้นมาแล้วได้ผลที่แสดงขึ้นมาใน news feed เหมือนกันทุกครั้งเราก็คงจะไม่เข้า facebook บ่อยๆ กันหรอก

แล้วจะ ทำยังไงให้หน้าเพจเปลี่ยนแปลงข้อมูลได้ตลอดเวลาด้วยตัวเอง (เพราะคงไม่มีใครมานั่นเขียน HTML ใหม่ทุกรอบที่มีคนเข้ามาคอมเม้นท์หรอกนะ)

หรือสมาชิกคนนี้ล๊อกอินเข้ามา เขาควรจะได้ HTML แบบไหนกลับไปแสดงผลดีนะ

นั่นแหละหน้าที่ของ Server-Side-Script

ตามชื่อของมัน Server-Side-Script ก็ต้องเป็น Script ที่ทำงานในฝั่ง Server ตัวอย่างภาษาก็เช่น PHP Python Ruby ASP.NET

หน้าที่ หลักๆ คือดูว่าการที่ผู้ใช้เรียกหน้าเพจนี้น่ะ เขาควรจะได้ HTML แบบไหนกลับไป หรือพูดง่ายๆ มันมีหน้าที่เขียน HTML แทนเรานั่นแหละ

และในฝั่ง Server นี้เองที่จะมีความสามารถพิเศษที่ฝั่ง Client ไม่สามารถทำได้ นั่นคือ Database

ซึ่ง การ เพิ่ม แก้ไข ลบทิ้ง เรียกข้อมูลออกมาใช้ (ที่เขาเรียกกันว่า INSERT UPDATE DELETE SELECT) นั้นก็เป็นหน้าที่ของ Server-Side-Script ในการเชื่อมต่อ และใช้ภาษา SQL ในการคุยกับ Database นั่นเอง

จาก Flowchart ข้างบน เป็นข้อสรุปอย่างย่อยๆ ว่าสเต็ปไหนเราควรใช้อะไรเขียน

  • อยากให้กดปุ่มนี้แล้วแสดงกล่องล๊อกอินขึ้นมา: เป็น action ที่ตอบโต้กับผู้ใช้ เพราะต้องให้ผู้ใช้กดปุ่มก่อนถึงจะทำงาน --> JavaScript
  • อยากเขียนระบบโพสต์กระทู้ได้: หน้าตั้งกระทู้ไม่มีอะไรมาก เปิดมากี่ครั้งก็เป็นกล่องให้กรอกเนื้อหาเหมือนเดิม --> HTML ธรรมดาก็เพียงพอ ... แต่ต้องส่ง form GET/POST กลับไปหา Server อีกที
  • อยากแสดงข้อมูลของสินค้าและรายละเอียดมาแสดง: ต้องการข้อมูลสินค้าซึ่งส่วนใหญ่เก็บใน Database --> ต้องใช้ Server-Side-Script เชื่อมต่อไปถาม Database ด้วย SQL แล้วนำข้อมูลที่ได้กลับมาเขียน HTML สำหรับแสดงผลต่อไป
  • อยากให้ทำปุ่มไลค์: มีการติดต่อกับผู้ใช้โดยการให้ผู้ใช้กดไลค์ แต่ข้อมูลการไลค์ต้องบันทึกไว้ด้วยใน Database --> หน้าเพจต้องไม่กระพริบหรือ refresh หน้าใหม่ --> Ajax

พวกนี้เป็นตัวอย่างคร่าวๆ เท่านั้น เวลาเราเขียนจริงๆ คงต้องใช้ละเอียดกว่านี้ แต่ก็หวังว่าแนวทางนี้จะช่วยมือใหม่ได้นิดหน่อย

7799 Total Views 3 Views Today
Ta

Ta

สิ่งมีชีวิตตัวอ้วนๆ กลมๆ เคลื่อนที่ไปไหนโดยการกลิ้ง .. ถนัดการดำรงชีวิตโดยไม่โดนแสงแดด
ปัจจุบันเป็น Senior Software Engineer อยู่ที่ Centrillion Technology
งานอดิเรกคือ เขียนโปรแกรม อ่านหนังสือ เขียนบทความ วาดรูป และ เล่นแบดมินตัน

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องที่ต้องการถูกทำเครื่องหมาย *