#Frontend

53 บทความ

เบื้องหลังการทำงานของ Browser Rendering Pipeline: สิ่งที่โปรแกรมเมอร์ต้องรู้

เบื้องหลังการทำงานของ Browser Rendering Pipeline: สิ่งที่โปรแกรมเมอร์ต้องรู้

อยากรู้ไหมว่าเกิดอะไรขึ้นเมื่อเรากด Enter เข้าเว็บไซต์? มาทำความเข้าใจขั้นตอนการโหลดหน้าเว็บ (Rendering Pipeline) เพื่อเขียนโค้ดให้เร็วและมีประสิทธิภาพมากขึ้น

ที่มา: DEV Community

4 days ago 10 นาที
4 views
CORS คืออะไร? ทำไมเบราว์เซอร์ถึงบล็อกการดึงข้อมูล API ของคุณ

CORS คืออะไร? ทำไมเบราว์เซอร์ถึงบล็อกการดึงข้อมูล API ของคุณ

เจอปัญหา CORS Error เวลาดึงข้อมูล API ใช่ไหม? มาทำความเข้าใจกลไกความปลอดภัยของเบราว์เซอร์ และวิธีตั้งค่า CORS ให้ Frontend คุยกับ Backend ได้อย่างถูกต้อง

ที่มา: DEV Community

4 days ago 8 นาที
5 views
สร้างโปรเจกต์ทำเพลงด้วยโค้ด: เจาะลึกการพัฒนา IMFMSynth และทักษะ DSP สำหรับโปรแกรมเมอร์

สร้างโปรเจกต์ทำเพลงด้วยโค้ด: เจาะลึกการพัฒนา IMFMSynth และทักษะ DSP สำหรับโปรแกรมเมอร์

อยากสร้างเครื่องมือทำเพลงเองไหม? มาดูเบื้องหลังการสร้าง IMFMSynth พร้อมเรียนรู้พื้นฐานการประมวลผลเสียง (DSP) และวิธีฝึกเขียนโค้ดสำหรับมือใหม่ให้เก่งขึ้น

ที่มา: DEV Community

1 week ago 9 นาที
10 views
สร้างเครื่องมือบีบอัดรูปภาพ Bulk Image Compressor ด้วย HTML, CSS และ JavaScript

สร้างเครื่องมือบีบอัดรูปภาพ Bulk Image Compressor ด้วย HTML, CSS และ JavaScript

สอนสร้างเครื่องมือบีบอัดรูปภาพจำนวนมากบนเบราว์เซอร์โดยตรง ไม่ต้องพึ่งเซิร์ฟเวอร์ ปลอดภัยและช่วยให้เว็บโหลดเร็วขึ้น พร้อมเรียนรู้การจัดการไฟล์ด้วย Canvas API

ที่มา: freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

1 week ago 10 นาที
13 views
เจาะลึก CSS Position สำหรับมือใหม่: จัดวางองค์ประกอบบนเว็บให้แม่นยำ

เจาะลึก CSS Position สำหรับมือใหม่: จัดวางองค์ประกอบบนเว็บให้แม่นยำ

เบื่อไหมที่จัดตำแหน่งเว็บแล้วไม่เป็นไปตามใจ? มาทำความเข้าใจ CSS Position ทั้ง Static, Relative และ Absolute เพื่อให้คุณคุมหน้าตาเว็บไซต์ได้ดั่งใจมือโปร

ที่มา: DEV Community

1 week ago 11 นาที
10 views
เข้าใจการทำ Image Tinting และ Blend Modes ด้วย Canvas API สำหรับมือใหม่

เข้าใจการทำ Image Tinting และ Blend Modes ด้วย Canvas API สำหรับมือใหม่

อยากแต่งภาพบนเว็บให้ดูโปร? มาเรียนรู้วิธีการย้อมสีภาพ (Image Tinting) และการใช้ Blend Modes ด้วย Canvas API แบบง่าย ๆ ที่โปรแกรมเมอร์ควรรู้

ที่มา: DEV Community

2 weeks ago 8 นาที
15 views
ทำไมการออกแบบ URL Architecture ถึงสำคัญต่อการขยายตัวของเว็บไซต์

ทำไมการออกแบบ URL Architecture ถึงสำคัญต่อการขยายตัวของเว็บไซต์

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

ที่มา: DEV Community

2 weeks ago 8 นาที
16 views
สร้างแอปจัดการงานแบบ Local-first ด้วย localStorage โดยไม่ต้องง้อระบบสมาชิก

สร้างแอปจัดการงานแบบ Local-first ด้วย localStorage โดยไม่ต้องง้อระบบสมาชิก

เรียนรู้วิธีสร้างแอปจัดการงานที่เก็บข้อมูลไว้ในเบราว์เซอร์โดยตรงด้วย localStorage ช่วยให้แอปทำงานเร็วและเป็นส่วนตัว เหมาะสำหรับมือใหม่ฝึกทำโปรเจกต์

ที่มา: DEV Community

2 weeks ago 7 นาที
14 views
เจาะลึก Gamepad API: วิธีรับค่าจอยสติ๊กใน JavaScript ให้แม่นยำแบบมือโปร

เจาะลึก Gamepad API: วิธีรับค่าจอยสติ๊กใน JavaScript ให้แม่นยำแบบมือโปร

อยากทำเว็บเกมแต่เจอปัญหา Gamepad API อ่านค่าจอยไม่ตรง? มาเรียนรู้วิธีจัดการ Polling, แก้ปัญหา Stick Drift และทำระบบ Mapping ปุ่มให้รองรับทุกจอยแบบมืออาชีพกัน

ที่มา: freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

2 weeks ago 8 นาที
16 views
วิธีรัน AI บนเว็บเบราว์เซอร์ด้วย WebLLM สำหรับนักพัฒนาสายเว็บ

วิธีรัน AI บนเว็บเบราว์เซอร์ด้วย WebLLM สำหรับนักพัฒนาสายเว็บ

อยากสร้างแอป AI แต่ไม่อยากเสียเงินเช่าเซิร์ฟเวอร์? มาเรียนรู้วิธีใช้ WebLLM รันโมเดลภาษาขนาดใหญ่ (LLM) บนเบราว์เซอร์ด้วย WebGPU กันแบบง่าย ๆ

ที่มา: Hacker News

3 weeks ago 9 นาที
14 views
Alt text ผ่านการตรวจอัตโนมัติ ไม่ได้แปลว่าใช้งานได้จริงเสมอไป

Alt text ผ่านการตรวจอัตโนมัติ ไม่ได้แปลว่าใช้งานได้จริงเสมอไป

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

ที่มา: The GitHub Blog

1 month ago 7 นาที
13 views
วิธีเช็ก Type ด้วย tsc --noEmit และตั้งค่า Environment Variables ใน React TypeScript ก่อน Deploy
React TypeScript

วิธีเช็ก Type ด้วย tsc --noEmit และตั้งค่า Environment Variables ใน React TypeScript ก่อน Deploy

ไม่อยากให้แอปพังตอน Deploy ต้องอ่าน! สอนวิธีใช้ tsc --noEmit ตรวจสอบข้อผิดพลาดในโปรเจกต์ React TypeScript พร้อมวิธีตั้งค่า Environment Variables ให้ปลอดภัย

1 month ago 8 นาที
22 views