GyaanSetu WebDev

Frontend, Backend และ DevOps สำหรับเว็บยุคใหม่

128 articlesDeep, practical knowledge

A Width Check Broke a Kanji

A Width Check Broke a Kanji A name went into a terminal table and came out broken. The surname was 𠮷田. The first character is not the common 吉. It is 𠮷 (U+20BB7). This is a rare…

WebDev · 2 min read

วิธีการ Deploy NestJS บน Namecheap Shared Hosting

วิธีการ Deploy NestJS บน Namecheap Shared Hosting การ Deploy NestJS บน Namecheap shared hosting นั้นไม่เหมือนกับการ Deploy เว็บไซต์แบบ Static หรือแอป PHP คุณไม่สามารถเพียงแค่ทำการอัปโหลดไฟล์และ...

WebDev · 2 min read

เอเจนต์ของคุณไม่ได้ทำ Prod พัง แต่เป็น Pipeline ของคุณต่างหาก

เอเจนต์ของคุณไม่ได้ทำ Prod พัง แต่เป็น Pipeline ของคุณต่างหาก เอเจนต์ของคุณไม่ได้ทำให้ระบบ production พัง แต่เป็น pipeline ของคุณที่ทำ หลายทีมใช้เอเจนต์ในการเปิด pull requests และใช้ CI ในการตรวจสอบ lint...

WebDev · 2 min read

ทดสอบขั้นตอนการเปลี่ยนอีเมลใน React โดยไม่สับสนเรื่องลิงก์

ทดสอบขั้นตอนการเปลี่ยนอีเมลใน React โดยไม่สับสนเรื่องลิงก์ การเปลี่ยนอีเมลบัญชีดูเหมือนจะเป็นเรื่องเล็กน้อย แต่จริงๆ แล้วมันเป็นสาเหตุหลักของข้อผิดพลาดในการทดสอบ ผู้ทดสอบมักจะสับสนกับลิงก์ยืนยัน...

WebDev · 3 min read

ฉันสร้าง CAD Editor บนเบราว์เซอร์ แล้วสอนให้ LLM ใช้งานมัน

ฉันสร้าง CAD Editor บนเบราว์เซอร์ แล้วสอนให้ LLM ใช้งานมัน ฉันลองถามแอปของฉันว่า "มีประตูและหน้าต่างกี่บาน?" AI ตอบกลับมาพร้อมกับจำนวนที่ถูกต้อง จากนั้นมันก็เพิ่มบางอย่างลงไป...

WebDev · 3 min read

CI/CD Pipeline ของผมผ่านฉลุยมา 3 เดือน — จนกระทั่งผมได้ลองอ่าน Log

CI/CD Pipeline ของผมผ่านฉลุยมา 3 เดือน — จนกระทั่งผมได้ลองอ่าน Log เครื่องหมายถูกสีเขียวมันให้ความรู้สึกดีจริงๆ ทุก Pull Request ผ่านหมด ทุกการ Deploy ใช้งานได้ปกติ แต่แล้วผู้ใช้งานก็แจ้งว่ามีฟีเจอร์หนึ่งพัง มัน...

WebDev · 2 min read

ทุกการปรับแต่งเบื้องหลังคะแนน Lighthouse ที่สมบูรณ์แบบ

ทุกการปรับแต่งเบื้องหลังคะแนน Lighthouse ที่สมบูรณ์แบบ ผมรัน Lighthouse บนไซต์ของผมอย่างต่อเนื่อง ซึ่งได้คะแนน 100 ตลอดในการรันแบบ local ทุกครั้ง และได้ 100 ในคะแนน Real Experience ของ Vercel เหล่า...

WebDev · 2 min read

HTTP เพิ่งมีเมธอดใหม่เป็นครั้งแรกในรอบ 20 ปี

HTTP เพิ่งมีเมธอดใหม่เป็นครั้งแรกในรอบ 20 ปี คุณน่าจะเคยเจอสถานการณ์แบบนี้มาก่อน เช่น เมื่อคุณต้องการค้นหาสินค้า แต่ตัวกรองการค้นหามีข้อมูลมากเกินกว่าจะใส่ลงใน URL ได้ และเพื่อแก้ไขปัญหานี้ คุณจึงใช้...

WebDev · 2 min read

สิ่งที่ผมได้เรียนรู้ในฐานะนักพัฒนา PHP แบบ Sync เกี่ยวกับ Async PHP

สิ่งที่ผมได้เรียนรู้ในฐานะนักพัฒนา PHP แบบ Sync เกี่ยวกับ Async PHP ผมทำงานกับ Laravel มาหลายปี ผมใช้ PHP แบบ sync เมื่อมี request เข้ามา กระบวนการจะทำงาน และส่ง response ออกไป ผมไม่เคย...

WebDev · 2 min read

ทดสอบอีเมลคำเชิญ React โดยไม่ให้เกิดปัญหา Inbox ตีกัน

ทดสอบอีเมลคำเชิญ React โดยไม่ให้เกิดปัญหา Inbox ตีกัน สภาพแวดล้อม Preview มักจะล้มเหลวเมื่อขั้นตอนการส่งคำเชิญทำให้ Inbox ของ QA ที่ใช้ร่วมกันเต็มไปด้วยข้อความ ผู้ทดสอบคนหนึ่งเปิดลิงก์ผิด หรืออีกคนหยิบข้อความเก่า...

WebDev · 2 min read

Coding Agent ของผมจำได้แค่เซสชัน แต่จำงานไม่ได้

Coding Agent ของผมจำได้แค่เซสชัน แต่จำงานไม่ได้ Coding agent สามารถรักษา thread ให้คงอยู่ได้ แต่ก็ยังให้ความรู้สึกเหมือนขี้ลืม ผมพบปัญหานี้ในขณะที่กำลังสร้าง CliGate และผมได้แก้ไขเรื่องความต่อเนื่องของเซสชัน...

WebDev · 2 min read

การออกแบบเพื่อผู้ใช้ที่มองไม่เห็น

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

WebDev · 2 min read

ประวัติของ OAuth: จากการใช้รหัสผ่านสู่มาตรฐานระดับโลก

ประวัติของ OAuth: จากการใช้รหัสผ่านสู่มาตรฐานระดับโลก คุณเห็นสิ่งนี้ได้ทุกวัน คุณคลิก "เข้าสู่ระบบด้วย Google" หรือ "เข้าสู่ระบบด้วย GitHub" โดยไม่ต้องพิมพ์รหัสผ่าน และสามารถเข้าสู่เว็บไซต์ได้ทันที...

WebDev · 3 min read

ข้อผิดพลาดทางเทคนิคในการรัน 16 ผลิตภัณฑ์บน Lovable และ Supabase

ข้อผิดพลาดทางเทคนิคในการรัน 16 ผลิตภัณฑ์บน Lovable และ Supabase เราบริหารจัดการ 16 ผลิตภัณฑ์ที่ Inithouse โดยใช้ Lovable และ Supabase สำหรับทุกผลิตภัณฑ์ และมีเพียงทีมเดียวที่ดูแลทุกอย่าง การจัดการ...

WebDev · 2 min read

4 รูปแบบ GitHub Actions สำหรับ Monorepo ETL

4 รูปแบบ GitHub Actions สำหรับ Monorepo ETL การรันสามเว็บไซต์จาก monorepo เดียวกันทำให้เกิดปัญหา คุณต้องเผชิญกับงาน ETL สามงานที่แยกจากกัน, การสร้างเนื้อหาใหม่สามครั้ง และการปรับใช้ (deployment) สาม...

WebDev · 2 min read

ผมสร้างแพลตฟอร์ม Tunneling ของตัวเอง

ผมสร้างแพลตฟอร์ม Tunneling ของตัวเอง ผมใช้เวลาสามวันในการขัดเกลาเว็บแอปบนแล็ปท็อปของผม มันดูสมบูรณ์แบบมาก แต่พอผมลองทดสอบบนมือถือ ทุกอย่างก็พังไม่เป็นท่า การพัฒนาแบบ Local...

WebDev · 2 min read

AWS สำหรับมือใหม่: S3, Deduplication และ Presigned URLs

AWS สำหรับมือใหม่: S3, Deduplication และ Presigned URLs เลิกสร้างแอปฯ แบบเล่นๆ แล้วเริ่มสร้างระบบระดับ Production ได้แล้ว หากเซิร์ฟเวอร์ของคุณเป็นแบบที่สามารถเปลี่ยนใหม่ได้ตลอดเวลา ไฟล์ของคุณก็ไม่ควรเก็บไว้ในดิสก์ของมัน...

WebDev · 2 min read

การสร้าง Search Modal สำหรับเว็บไซต์ WordPress ที่มีการจำกัดการเข้าถึงด้วยระบบสมาชิก

การสร้าง Search Modal สำหรับเว็บไซต์ WordPress ที่มีการจำกัดการเข้าถึงด้วยระบบสมาชิก บทช่วยสอนการค้นหาของ WordPress ส่วนใหญ่มักจะจบลงเพียงแค่การเพิ่ม Widget ลงใน Header เท่านั้น ซึ่งวิธีนี้จะใช้ไม่ได้ผลเมื่อคุณมีเนื้อหาที่ถูกจำกัดการเข้าถึง เช่น p...

WebDev · 2 min read

การใช้ AI เพื่อค้นหาช่องโหว่ด้านการกำหนดสิทธิ์ (Authorization Bugs)

การใช้ AI เพื่อค้นหาช่องโหว่ด้านการกำหนดสิทธิ์ โปรแกรม Bug bounty กำลังเปลี่ยนแปลงไป บางโปรแกรมหยุดจ่ายเงินรางวัล บางโปรแกรมลดการจ่ายเงินลงถึง 80% สาเหตุไม่ใช่เพราะ AI ค้นพบช่องโหว่มากเกินไป...

WebDev · 2 min read

The Pragmatic Programmer: 20 Years Later

The Pragmatic Programmer: 20 Years Later I read The Pragmatic Programmer over two decades ago. Back then, it felt like a list of good practices. Today, after years of breaking sys…

WebDev · 2 min read

สวนที่ไม่มีใครร้องขอ

สวนที่ไม่มีใครร้องขอ เมื่อวันที่ 21 มิถุนายน ฉันได้สร้างสวนขึ้นมาสวนหนึ่ง ฉันไม่ได้สร้าง codebase หรือ dashboard แต่ฉันสร้าง ALICE Garden ขึ้นมา มันรันอยู่บน local URL ในขณะที่ฉันทำงาน และอยู่ใน GitHub r...

WebDev · 2 min read

วิธีการสร้างเวิร์กโฟลว์การเผยแพร่ที่ปลอดภัยสำหรับลูกค้า

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

WebDev · 2 min read