Question 1

บทบาทหลักของ useQuery ใน React Query คืออะไร?

Accepted Answer

useQuery เป็น hook พื้นฐานสำหรับดึงข้อมูลแบบอ่านอย่างเดียวจาก API หรือแหล่งข้อมูล มันจัดการ cache, สถานะ loading, error และกลยุทธ์ refetch โดยอัตโนมัติ ต่างจาก useEffect กับ fetch ตรงที่ useQuery เพิ่มประสิทธิภาพโดยหลีกเลี่ยง request ที่ซ้ำซ้อนผ่านระบบ cache อัจฉริยะ

Question 2

ควรใช้ hook ใดเพื่อทำ POST mutation ไปยัง API?

Accepted Answer

useMutation เป็น hook สำหรับการดำเนินการเขียนโดยเฉพาะ เช่น POST, PUT, PATCH หรือ DELETE โดยมี callback อย่าง onSuccess, onError และ onMutate สำหรับจัดการวงจรชีวิตของ mutation ต่างจาก useQuery ที่ใช้สำหรับอ่านข้อมูล useMutation ไม่ทริกเกอร์ request โดยอัตโนมัติ และต้องเรียกฟังก์ชัน mutate อย่างชัดเจน

Question 3

query key ใน React Query มีจุดประสงค์อะไร?

Accepted Answer

query key คือตัวระบุเฉพาะที่ช่วยให้ React Query จัดการ cache และ dependency ระหว่าง query ต่างๆ ใช้สำหรับระบุ, invalidate และ refetch query เฉพาะ query key อาจเป็น string ธรรมดาหรือ array ที่มีพารามิเตอร์แบบไดนามิก การเปลี่ยน query key จะทริกเกอร์ fetch ใหม่โดยอัตโนมัติ ซึ่งช่วยให้จัดการ dependency แบบ declarative ได้

React Query (TanStack Query)

บทบาทหลักของ useQuery ใน React Query คืออะไร?

คำตอบ

ควรใช้ hook ใดเพื่อทำ POST mutation ไปยัง API?

คำตอบ

query key ใน React Query มีจุดประสงค์อะไร?

คำตอบ

staleTime ในการตั้งค่า useQuery หมายถึงอะไร?

property ใดที่บ่งบอกว่า useQuery กำลัง loading อยู่?

หัวข้อสัมภาษณ์ React / Next.js อื่นๆ

พื้นฐาน JavaScript

พื้นฐาน React

React Hooks

วงจรชีวิตของ component

React Router

การจัดการ state ด้วย Context

ฟอร์มและ Controlled Components

การดึงข้อมูลและ API

Styling & CSS-in-JS

พื้นฐาน Next.js

TypeScript กับ React

การดึงข้อมูล Next.js

Server Actions ของ Next.js

การกำหนดเส้นทางและการนำทางใน Next.js

API Routes ใน Next.js

Metadata & SEO ใน Next.js

Middleware และ Auth ใน Next.js

การทดสอบ React

Zustand State Management

การเพิ่มประสิทธิภาพ React

Error Boundaries & การจัดการข้อผิดพลาด

Advanced React Patterns

ฟีเจอร์ขั้นสูงของ Next.js

การ Deploy & Production ของ Next.js

Architecture & Design Patterns

React Server Components

การแปลภาษา Next.js

React ความปลอดภัย & แนวปฏิบัติที่ดีที่สุด

เชี่ยวชาญ React / Next.js สำหรับการสัมภาษณ์ครั้งถัดไป