Menu
The review-first prompt is selected by default. You can switch to a direct command or download a local copy.
Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
A direct command skips the review prompt. Inspect the source before running it.
npx skills add https://github.com/dipro-vn/dipro-ai-boost --skill nextjs-data-fetchingThe command stays on one line. Scroll horizontally to inspect it before copying.
Prefer a local copy? Download the files currently available to SkillsMP.
Based on SOC occupation classification
Showing SKILL.md
| name | nextjs-data-fetching |
| description | null |
Category: nextjs · Status: 🟢 Active
Khi fetch data phía server trong App Router với kiểm soát cache/revalidate.
fetch(url, { cache: 'force-cache' | 'no-store' }).next: { revalidate: 60 } để làm mới định kỳ.Promise.all để tránh waterfall.<Suspense> + loading để stream phần chậm, không block cả trang.export default async function Page() {
const [user, posts] = await Promise.all([
fetch(`${API}/user`, { next: { revalidate: 60 } }).then((r) => r.json()),
fetch(`${API}/posts`, { cache: 'no-store' }).then((r) => r.json()),
]);
return <Dashboard user={user} posts={posts} />;
}
Good: Promise.all song song, revalidate hợp lý, no-store cho data động. Avoid: await tuần tự gây waterfall, fetch ở client khi server làm được.