Sunny Articles

Home / Articles / Web Development
Order By:
Recent

VPS Linux เดือนละ 140 บาท ที่โคตรคุ้ม!!!

129

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

Next.js (3) การตั้งค่า Metadata

261

สวัสดีครับในวันนี้ผมจะพามาตั้งค่า Metadata ใน Next.js กัน หลายๆ คนที่เริ่มพัฒนาเว็บด้วย Next.js ใหม่ ๆ อาจจะยังสงสัยว่า ใน Next.js เราจะสามารถตั้ง Title และ Meta เช่น Open Graph protocol (og:image และอื่น ๆ) ของเว็บไซต์แบบ Dynamics ซึ่งแตกต่า...

Next.js (2) การใช้งาน useState ร่วมกับ fetch

373

ในบทความนี้ผมจะมาแนะนำ การดึงข้อมูลจาก Backend โดยใช้ Fetch ซึ่งจะมีการใช้ useState ในการติดตามสถานะ ว่าดึงข้อมูลออกมาแล้วหรือยัง เหตุผลที่ต้องใช้ useState ก็คือ ฝั่ง Client-Side นั่นหากเราดึงข้อมูล โดยไม่ติดตามสถานะ จะทำให้ React ดึงข้อมูลอยู่ตลอ...

Next.js (1) สร้าง Project และจัดการ App Router

532

Next.js เป็นผลงาน Fullstack React Framework จากบริษัท Vercel ที่หลายๆ คนมองว่า นี่เป็นสิ่งที่ React.js ควรจะเป็นตั้งแต่แรก เหตุที่เรามองว่ามันเป็น Fullstack Framework ก็เพราะว่า ตัว Next.js สามารถทำการประมวลผลแบบ Server-Side Rende...

Angular (3) สร้างและจัดการ Router

206

Routing คือการกำหนดการทำงานตามที่อยู่ใน URL เช่น /Person, /editPersons ให้แสดงหน้าและ Component ที่แตกต่างกัน ซึ่งในบทความนี้ผมจะมาแนะนำวิธีการสร้างและจัดการ Routing บน Angular Routing หลังจากที่เราสร้าง project จะเกิดไฟล์&nb...

Angular (2) สร้าง Service, ดึงข้อมูลจาก Backend

343

ในบทความก่อนหน้า เราได้ทำการ สร้าง Component รวมถึง Interface แล้ว ในบทความนี้ผมจะพามาสร้าง Service สำหรับการทำงานต่าง ๆ ในกรณีนี้จะเป็นการดึงข้อมูล JSON จาก Backend API มาแสดง โดยผมจะมี Backend ที่พัฒนาโดยใช้ Express.js ไว้แล้ว <a href="https://s...

Express.js สำหรับทำ JSON API Backend

270

สวัสดีครับ ในวันนี้ผมจะมาแนะนำการใช้ Express.js Framework ในการทำ JSON API Backend Server เพื่อ Serve ข้อมูลจาก MySQL กัน เรียกได้ว่า บทความนี้ครบจบตั้งแต่เชื่อมต่อฐานข้อมูล MySQL ไปจนถึงการ Routing และ Serve ข้อมูล เพื่อนๆ สามารถ...

Angular (1) สร้างและจัดการ Component

362

Angular คืออะไร? Angular เป็น Frontend Framework พัฒนาโดย Angular Team จากบริษัท Google ที่ใช้ TypeScript เป็นหลัก ทำงานอยู่ใน JavaScript runtime environment อย่าง Node.js ตัว Angular...

พัฒนาเว็บแชทด้วย Socket.io + Node.js

361

สวัสดีครับ ในบทความนี้ผมจะมาแนะนำการสร้าง Web Chat Application อาศัยเครื่องมือ ได้แก่ Node.js, Express.js, Socket.io โดย Node.js จะเป็น Server-Side Processing ส่วน Express.js จะเป็นตัว Routing และ Serve หน้าเว็บ EJS Template EJS</...

ปัญหา Connection Timeout และการ Optimization Nginx

636

ในบทความนี้ผมจะมาแนะนำการ Optimization Website ที่ทำงานบน Node.js และใช้ Nginx เป็น Reverse Proxy สำหรับนักพัฒนาเว็บไซต์ที่เจอ Connection Timeout บ่อยๆ ก่อนแรกต้องไปที่ไฟล์ /etc/nginx/sites-enabled/default สมมุติว่า...

ภาษา PHP เบื้องต้น (6) Cookies และ Session

377

สวัสดีครับในบทความนี้ผมจะพามารู้จักกับ Cookie และ Session บนภาษา PHP ซึ่งก่อนแรกเราจะมาพูดถึงข้อแตกต่างระหว่าง Cookie กับ Session กันก่อน จากนั้นจะมีตัวอย่างโค้ด PHP การสร้าง เรียกใช้ และทำลาย ข้อมูลใน Cookie กับ Session Cookie และ...

ภาษา PHP เบื้องต้น (5) การป้องกัน XSS

372

สวัสดีครับในบทความนี้ผมจะพามารู้จักกับช่องโหว่ Cross-Site Scripting (XSS) โดยหลักๆ คือการ ที่ผู้ไม่ประสงค์ดีแทรกโค้ด Javascript เข้าไปทำงาน ในเว็บไซต์ ซึ่งเป็นการแทรก script /script หรือ body onload= และ att...

ภาษา PHP เบื้องต้น (4) การป้องกัน SQL Injection

548

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

จัดการ Node.js Projects ด้วย pm2

1,190

สวัสดีครับ ในบทความนี้ผมจะมาแนะนำเครื่องมือตัวหนึ่งที่ชื่อ PM2 ใช้สำหรับจัดการ Node.js Projects หลายๆอันของเรา ได้ง่ายๆ และสามารถเก็บ log ไปยัง file ได้ สามารถ Monitoring ทรัพยากรที่ใช้ได้ สามารถนำมาทำ Cluster Mode ได้ แถม pm2 ยังสามารถติดตั้ง&nbs...

ภาษา PHP เบื้องต้น (3) เชื่อมต่อ MySQL

393

สวัสดีครับในบทความนี้ผมจะมาแนะนำเรื่องการใช้ PHP ร่วมกับ ฐานข้อมูล MySQL เช่นการ query ข้อมูลออกมาแสดง เป็นต้น ตัวอย่างในบทความนี้จะเป็นการยกตัวอย่างการแสดงข้อมูลบทความจากตารางที่ชื่อ articles มาแสดงในไฟล์ที่ชื่อ articles.php ดังนั...

ภาษา PHP เบื้องต้น (2) Form

307

ในบทความนี้ ผมจะเริ่มจากการรับค่า form ของ HTML ที่เราสามารถสร้างให้รับ input จากผู้ใช้มาดำเนินการบน PHP ได้ เช่น นำไปคำนวน, สร้างระบบจัดการข้อมูล หรือ ออกแบบระบบสมาชิก เป็นต้น ซึ่งในตัวอย่างแรกจะเป็น form ที่รับ ข้อมูลการสมัครสมาชิก โดยไม่ได้จำกั...

ภาษา PHP เบื้องต้น (1) คำสั่งพื้นฐาน

357

ในบทความนี้ผมจะมาแนะนำการเขียนโปรแกรมเว็บด้วยภาษา PHP หากเพื่อนๆ ที่ได้ศึกษา HTML, CSS มาบ้างแล้ว จะพบว่า HTML และ CSS เป็นเพียงแค่การจัดโครงสร้างของหน้าเว็บเท่านั้น การจะทำระบบต่างๆ จึงจะต้องใช้ภาษาที่ทำงานบนเซิร์ฟเวอร์แล้วส่งผลลัพท์เป็น HTML ให้...

Node.js + Express + MySQL สร้างระบบเพิ่มลบแก้ไข

1,060

สวัสดีครับในบทความนี้จะเป็นการแนะนำการสร้าง เว็บไซต์ที่มีระบบเพิ่ม ลบ แก้ไข ข้อมูลในฐานข้อมูล MySQL บน Node.js เป็น Project ที่ง่ายและเป็นพื้นฐานของการพัฒนาเว็บไซต์ Node.js คืออะไร? Node.js เป็น Open-Source Javascript Se...

JavaScript เบื้องต้น, เขียน Logic ให้กับเว็บไซต์

1,056

บทความนี้จะเป็นการแนะนำวิธีการเขียน JavaScript สำหรับสร้างกลไกต่างๆ ภายในเว็บไซต์ ข้อแตกต่างระหว่าง Client-Side และ Server-Side JavaScript เป็นภาษาที่ทำงานบน Client-Side หมายถึง คำสั่งทุกคำสั่งจะถ...

สร้าง Web page ด้วยภาษา HTML และ CSS

1,031

HTML (Hypertext Markup Language) เป็นภาษาที่ใช้เขียน Hypertext Markup คือ การสร้างโครงสร้างของข้อความ และ hypertext ซึ่งจะไม่เหมือนภาษาอื่นๆ ที่สามารถเขียน logic เข้าไปได้ เช่น Javascripts, C, C++ หรือ Python แต่ HTML เป็นเพี...

การใช้งาน Nginx สำหรับ Reverse Proxy

1,581

Nginx เป็นโปรแกรมที่ออกแบบมาเพื่อสำหรับใช้เป็นเว็บเซิร์ฟเวอร์ เพื่อแสดงหน้าเว็บแบบคงที่ (serve static web content) คล้ายกับ Apache2 และยังสามารถใช้เป็น reverse proxy, load<a href="https://en.wikipedia.org/wiki/Load_...