การเขียนคอมเม้นใน PHP

ใน PHP การเขียนคอมเมนต์ (Comments) เป็นสิ่งที่ช่วยให้โค้ดอ่านง่ายขึ้นสำหรับนักพัฒนา โดยเฉพาะเมื่อต้องการอธิบายว่าฟังก์ชันหรือส่วนของโค้ดทำงานอย่างไร และช่วยให้ผู้ที่อ่านโค้ดเข้าใจได้ง่ายขึ้นในอนาคต คอมเมนต์ใน PHP มีอยู่ 2 รูปแบบหลัก คือ Single-line comments และ Multi-line comments

Single-line Comments (คอมเมนต์บรรทัดเดียว)

ใช้สำหรับการคอมเมนต์ข้อความสั้น ๆ ในบรรทัดเดียว โดยเริ่มต้นด้วยเครื่องหมาย // หรือ #

Syntax

// This is a single-line comment
# This is also a single-line comment

ตัวอย่างการใช้งาน

<?php
// Print the message to the screen
echo "Hello, world!"; // This will output: Hello, world!

# This is another single-line comment
echo "PHP is awesome!";
?>

ในตัวอย่างนี้ // และ # ใช้เพื่ออธิบายโค้ดในบรรทัดเดียว

Continue reading “การเขียนคอมเม้นใน PHP”

PHP Syntax

PHP (Hypertext Preprocessor) เป็นภาษาสคริปต์ที่ใช้กันอย่างแพร่หลายในการพัฒนาเว็บ เพื่อให้เข้าใจง่าย ๆ เราจะเริ่มต้นจากพื้นฐานของโครงสร้างและไวยากรณ์ PHP ที่สำคัญ

การเริ่มต้นและสิ้นสุดของ PHP Code

โค้ด PHP จะอยู่ภายในแท็ก <?php และ ?>

<?php
  // โค้ด PHP ของเราจะเขียนอยู่ที่นี่
?>

หรือสำหรับ short tag

<?
  // โค้ด PHP อยู่ที่นี่ (ใช้แท็กแบบสั้น)
?>

หมายเหตุ Short tag อาจจะถูกปิดในการตั้งค่าเซิร์ฟเวอร์บางตัว ดังนั้นการใช้ <?php จะปลอดภัยกว่า

การประกาศตัวแปร

ใน PHP ตัวแปรจะขึ้นต้นด้วยเครื่องหมาย $ และไม่ต้องประกาศชนิดข้อมูล (เพราะ PHP เป็นภาษาที่มี dynamic typing)

<?php
  $myVar = 10;    // ตัวแปรนี้เป็นชนิด integer
  $name = "John"; // ตัวแปรนี้เป็นชนิด string
?>

ตัวแปรใน PHP เป็น case-sensitive เช่น $name และ $Name ถือว่าเป็นคนละตัวแปรกัน

Continue reading “PHP Syntax”

การติดตั้ง PHP

การติดตั้ง PHP บนเครื่องคอมพิวเตอร์สามารถทำได้หลายวิธี ขึ้นอยู่กับระบบปฏิบัติการที่คุณใช้ (Windows, macOS, หรือ Linux) และวิธีที่คุณต้องการใช้ในการพัฒนา เช่น การติดตั้ง PHP เดี่ยว ๆ หรือการใช้แพ็คเกจที่มี Apache, MySQL, และ PHP (เช่น XAMPP, WAMP) ในการอธิบายการติดตั้งนี้ ผมจะแนะนำทั้งสองวิธี

1. การติดตั้ง PHP ด้วยการติดตั้งชุดซอฟต์แวร์ (เช่น XAMPP, WAMP)

วิธีนี้เป็นวิธีที่ง่ายที่สุด เหมาะสำหรับผู้ที่เพิ่งเริ่มต้น เนื่องจากซอฟต์แวร์เหล่านี้จะติดตั้ง PHP, Apache (เซิร์ฟเวอร์เว็บ) และ MySQL (ฐานข้อมูล) ในตัวเดียว

ติดตั้ง XAMPP (สำหรับ Windows, macOS และ Linux)

ดาวน์โหลด XAMPP: ไปที่ เว็บไซต์ XAMPP แล้วเลือกเวอร์ชันที่รองรับระบบปฏิบัติการของเรา

ติดตั้ง XAMPP

  • บน Windows คลิกที่ไฟล์ .exe ที่ดาวน์โหลดมา และทำตามขั้นตอนการติดตั้ง
  • บน macOS เปิดไฟล์ .dmg และลากไฟล์ไปที่โฟลเดอร์ Applications
  • บน Linux แตกไฟล์ที่ดาวน์โหลดมา และทำตามคำแนะนำในการติดตั้งจากเว็บไซต์

เปิด XAMPP Control Panel

  • เปิด XAMPP และเริ่มต้น Apache (เซิร์ฟเวอร์เว็บ) และ MySQL (ฐานข้อมูล)

ทดสอบ PHP

  • เปิดเบราว์เซอร์ และพิมพ์ http://localhost ในแถบที่อยู่ คุณควรเห็นหน้าเว็บของ XAMPP ที่แสดงผลการทำงาน
Continue reading “การติดตั้ง PHP”

jQuery Event ที่ใช้งานบ่อยๆ

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

มาดูรายละเอียดของ Event Methods ที่สำคัญใน jQuery

1. .on()

.on() เป็นวิธีการหลักที่ใช้เพื่อจัดการกับหลายเหตุการณ์ในหลายองค์ประกอบ (elements) ใน jQuery มันสามารถใช้เพื่อจับ event หลายชนิดใน selector เดียว

การใช้งาน

$("selector").on("event", function(){
    // คำสั่งที่จะทำงานเมื่อเกิด event
});

ตัวอย่าง

$("#myButton").on("click", function(){
    alert("Button clicked!");
});

ในตัวอย่างนี้ เมื่อมีการคลิกปุ่มที่มี id ว่า myButton จะมีการแสดงข้อความแจ้งเตือนออกมา

Continue reading “jQuery Event ที่ใช้งานบ่อยๆ”

ตัวเลือก (Selectors) ใน jQuery

ตัวเลือกใน jQuery เป็นฟีเจอร์ที่ทรงพลังมาก ช่วยให้นักพัฒนาสามารถค้นหาและจัดการกับองค์ประกอบ HTML ได้อย่างง่ายดายและรวดเร็ว คล้ายกับตัวเลือกใน CSS แต่มีความสามารถเพิ่มเติมในการทำงานร่วมกับ DOM (Document Object Model) ได้ นี่คือตัวอย่างการใช้งานตัวเลือกต่าง ๆ ของ jQuery แบบละเอียด

ตัวเลือกพื้นฐาน (Basic Selectors)

ตัวเลือกแท็ก (Element Selector)
  • รูปแบบ $("element")

ตัวอย่าง

$("p")

เลือกแท็ก <p> (ย่อหน้าข้อความ) ทุกตัวในหน้าเว็บ

ตัวเลือก ID (ID Selector)
  • รูปแบบ $("#id")

ตัวอย่าง

$("#header")

เลือกองค์ประกอบที่มี id="header" ซึ่งระบุ ID เฉพาะ

Continue reading “ตัวเลือก (Selectors) ใน jQuery”

เริ่มเขียน jQuery Syntax

jQuery เป็นไลบรารี JavaScript ที่ช่วยให้การเขียนโค้ดง่ายขึ้น โดยมี syntax ที่ใช้งานง่ายและย่อส่วน ซึ่งสามารถทำงานร่วมกับ HTML, CSS และ JavaScript ได้อย่างมีประสิทธิภาพ นี่คือรายละเอียดของ jQuery Syntax

พื้นฐานของ jQuery Syntax

jQuery ใช้สัญลักษณ์ $ เป็นตัวแทนของ jQuery เรียกง่ายๆ ว่าเป็นสัญลักษณ์ย่อ เช่นเดียวกับการเรียกฟังก์ชันของ jQuery

$(selector).action()

องค์ประกอบหลักของ jQuery Syntax

$ (ตัวแทนของ jQuery) สัญลักษณ์ $ ใช้เพื่อเรียก jQuery เช่นเดียวกับการบอกให้ jQuery ทำงาน

$(document).ready(function() {
   // โค้ด jQuery อยู่ที่นี่
});

Selector (ตัวเลือก) ใช้เพื่อเลือกองค์ประกอบ (HTML elements) ที่ต้องการจะทำงานด้วย คล้ายกับการใช้งาน CSS Selectors

Continue reading “เริ่มเขียน jQuery Syntax”

เริ่มต้นใช้งาน jQuery

jQuery คืออะไร?

jQuery คือไลบรารี JavaScript ที่ออกแบบมาเพื่อลดความซับซ้อนของการทำงานกับ DOM (Document Object Model) และการเขียน JavaScript ในเว็บเพจ มันช่วยให้เราสามารถเลือกและจัดการองค์ประกอบ HTML, จัดการกับเหตุการณ์ (events), ทำงานกับเอฟเฟกต์แอนิเมชัน, และแม้กระทั่งส่งข้อมูลแบบ AJAX ได้อย่างง่ายดาย

jQuery เป็นที่นิยมมากเนื่องจากสามารถทำให้โค้ด JavaScript ที่เคยยาวซับซ้อน กลายเป็นโค้ดที่สั้นและง่ายต่อการเข้าใจมากขึ้น

การติดตั้ง jQuery

วิธีที่ 1 โหลด jQuery ผ่าน CDN

คุณสามารถเรียกใช้งาน jQuery โดยใช้ CDN (Content Delivery Network) ซึ่งไม่จำเป็นต้องดาวน์โหลดไฟล์ไปเก็บไว้ในโฟลเดอร์โปรเจกต์ของคุณ สามารถแทรกโค้ดต่อไปนี้ในส่วน <head> หรือท้ายของ <body> ใน HTML

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

วิธีที่ 2 ดาวน์โหลด jQuery

ถ้าต้องการใช้งานออฟไลน์ คุณสามารถดาวน์โหลด jQuery ได้จากเว็บไซต์ jQuery.com แล้วเพิ่มไฟล์ .js ไว้ในโปรเจกต์ของคุณ โดยสามารถเรียกใช้ได้ดังนี้

<script src="path/to/jquery.min.js"></script>
Continue reading “เริ่มต้นใช้งาน jQuery”

การเขียน JavaScript Syntax

JavaScript (JS) เป็นภาษาโปรแกรมที่ใช้งานได้หลายด้าน โดยเฉพาะในเว็บเบราว์เซอร์ เพื่อทำให้หน้าเว็บมีความโต้ตอบและมีฟังก์ชันที่หลากหลายขึ้น การเรียนรู้ Syntax ของ JavaScript เป็นเรื่องสำคัญเพราะมันเป็นโครงสร้างพื้นฐานที่ทำให้โปรแกรมทำงานได้ตามที่เราต้องการ

1. ตัวแปร (Variables)

ใน JavaScript สามารถประกาศตัวแปรได้โดยใช้คำสำคัญ var, let, หรือ const ซึ่ง let และ const เป็นวิธีที่แนะนำมากกว่า เนื่องจาก var มีปัญหาเรื่องการ scope ที่ไม่ชัดเจน

var ใช้ประกาศตัวแปรทั่วไป

var name = "John";  // ประกาศตัวแปร name

let ใช้สำหรับตัวแปรที่ต้องการเปลี่ยนค่าได้

let age = 25;  // สามารถเปลี่ยนค่าได้
age = 26;

const ใช้สำหรับตัวแปรที่ค่าคงที่ ไม่สามารถเปลี่ยนค่าได้

const pi = 3.14159;  // ไม่สามารถเปลี่ยนค่าได้

2. ชนิดข้อมูล (Data Types)

JavaScript รองรับหลายชนิดข้อมูล เช่น

String ข้อความ

let greeting = "Hello World!";

Number ตัวเลข (ทั้งจำนวนเต็มและทศนิยม)

let age = 30;
let price = 9.99;
Continue reading “การเขียน JavaScript Syntax”

การใช้งาน JavaScript Statements

JavaScript statements (คำสั่งในภาษา JavaScript) คือชุดคำสั่งที่ให้เบราว์เซอร์หรือโปรแกรมทำงานตามที่เราต้องการ โปรแกรมในภาษา JavaScript จะประกอบด้วยลำดับของ statements ซึ่งแต่ละคำสั่งจะบอกให้คอมพิวเตอร์ทำบางสิ่งบางอย่าง

โครงสร้างของ JavaScript Statements

แต่ละ statement ใน JavaScript มักจะประกอบด้วย

  • คำสั่ง (Command) สิ่งที่เราต้องการให้โปรแกรมทำ เช่น การกำหนดค่า การคำนวณ หรือการเรียกใช้ฟังก์ชัน
  • ตัวจบคำสั่ง (;) ส่วนใหญ่ใน JavaScript เราจะใช้เครื่องหมาย ; เพื่อจบแต่ละคำสั่ง (แต่ในหลายกรณีสามารถเว้นได้)

ตัวอย่าง

let name = "John";  // กำหนดตัวแปร name ให้มีค่าเป็น "John"
let age = 25;       // กำหนดตัวแปร age ให้มีค่าเป็น 25
console.log(name);  // แสดงค่า name บน console

ในตัวอย่างนี้ มี 3 statements

  1. กำหนดตัวแปรชื่อ name และให้ค่าเป็น "John"
  2. กำหนดตัวแปรชื่อ age และให้ค่าเป็น 25
  3. แสดงผลตัวแปร name ผ่านทางฟังก์ชัน console.log
Continue reading “การใช้งาน JavaScript Statements”

การแสดงผลลัพธ์ JavaScript

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

วิธีการแสดงผลใน JavaScript

การแสดงผลใน JavaScript มีหลายวิธีที่ใช้กันบ่อย ๆ เช่น

  • ใช้ console.log() วิธีนี้เป็นวิธีที่ง่ายที่สุดในการแสดงผลลัพธ์ไปยัง “คอนโซล” (Console) ของเบราว์เซอร์ ซึ่งคอนโซลเป็นเครื่องมือสำหรับนักพัฒนาเพื่อใช้ตรวจสอบหรือแสดงข้อความเพื่อดีบั๊กโค้ด

ตัวอย่างโค้ด

console.log("สวัสดีโลก!");

ผลลัพธ์: ข้อความ “สวัสดีโลก!” จะถูกแสดงในคอนโซลของเบราว์เซอร์ (สามารถเปิดคอนโซลได้ใน Developer Tools)

  • ใช้ alert() วิธีนี้จะแสดงข้อความในรูปแบบหน้าต่างป๊อปอัพ (alert box) บนเบราว์เซอร์ ซึ่งผู้ใช้จะต้องกดปุ่ม “ตกลง” (OK) เพื่อปิดหน้าต่างนี้
Continue reading “การแสดงผลลัพธ์ JavaScript”