docs: update documentation translations

Author: xiaoyu2er

apps/docs/content/ja/docs/01-app/01-getting-started/10-updating-data.mdx

@@ -1,12 +1,12 @@
 ---
-source-updated-at: 2025-06-01T01:32:20.000Z
-translation-updated-at: 2025-06-02T20:01:14.188Z
-title: データの更新方法
+source-updated-at: 2025-06-03T15:30:49.000Z
+translation-updated-at: 2025-06-06T16:36:21.895Z
+title: データ更新方法
 nav_title: データ更新
-description: Next.jsアプリケーションでデータを更新する方法について学びましょう。
+description: Next.jsアプリケーションでデータを更新する方法について学びます。
 related:
   title: APIリファレンス
-  description: このページで紹介されている機能について詳しく知るには、APIリファレンスをお読みください。
+  description: このページで言及されている機能について詳しく知るにはAPIリファレンスを参照してください。
   links:
     - app/api-reference/functions/revalidatePath
     - app/api-reference/functions/revalidateTag
@@ -15,36 +15,36 @@ related:
 
 Next.jsではReactの[サーバー関数 (Server Functions)](https://react.dev/reference/rsc/server-functions)を使用してデータを更新できます。このページでは[サーバー関数の作成](#creating-server-functions)と[呼び出し](#invoking-server-functions)方法について説明します。
 
-## サーバー関数
+## サーバー関数 (Server Functions)
 
-サーバー関数とは、サーバー上で実行される非同期関数です。サーバー関数はクライアントからネットワークリクエスト経由で呼び出されるため、本質的に非同期です。`action`の一部として呼び出される場合、**サーバーアクション (Server Actions)** とも呼ばれます。
+サーバー関数はサーバー上で実行される非同期関数です。クライアントからネットワークリクエスト経由で呼び出されるため、サーバー関数は本質的に非同期です。`action`の一部として呼び出される場合、**サーバーアクション (Server Actions)** とも呼ばれます。
 
-慣例として、`action`は`startTransition`に渡される非同期関数です。サーバー関数は以下の場合に自動的に`startTransition`でラップされます：
+慣例として、`action`は`startTransition`に渡される非同期関数です。サーバー関数は以下の場合に自動的に`startTransition`でラップされます:
 
 - `<form>`の`action`プロパティに渡された場合
 - `<button>`の`formAction`プロパティに渡された場合
 - `useActionState`に渡された場合
 
 ## サーバー関数の作成
 
-サーバー関数は[`use server`](https://react.dev/reference/rsc/use-server)ディレクティブを使用して定義できます。このディレクティブを**非同期**関数の先頭に配置して関数をサーバー関数としてマークするか、別ファイルの先頭に配置してそのファイルのすべてのエクスポートをマークできます。
+サーバー関数は[`use server`](https://react.dev/reference/rsc/use-server)ディレクティブを使用して定義できます。ディレクティブを**非同期**関数の先頭に配置して関数をサーバー関数としてマークするか、ファイルの先頭に配置してそのファイルのすべてのエクスポートをマークできます。
 
 ```ts filename="app/lib/actions.ts" switcher
 export async function createPost(formData: FormData) {
   'use server'
   const title = formData.get('title')
   const content = formData.get('content')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 
 export async function deletePost(formData: FormData) {
   'use server'
   const id = formData.get('id')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 ```
 
@@ -54,22 +54,22 @@ export async function createPost(formData) {
   const title = formData.get('title')
   const content = formData.get('content')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 
 export async function deletePost(formData) {
   'use server'
   const id = formData.get('id')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 ```
 
-### サーバーコンポーネント
+### サーバーコンポーネント (Server Components)
 
-サーバー関数はサーバーコンポーネント内にインラインで定義できます。関数本体の先頭に`"use server"`ディレクティブを追加します：
+サーバーコンポーネント内では、関数本体の先頭に`"use server"`ディレクティブを追加することでサーバー関数をインラインで定義できます:
 
 ```tsx filename="app/page.tsx" switcher
 export default function Page() {
@@ -95,9 +95,9 @@ export default function Page() {
 }
 ```
 
-### クライアントコンポーネント
+### クライアントコンポーネント (Client Components)
 
-クライアントコンポーネント内でサーバー関数を定義することはできません。ただし、`"use server"`ディレクティブがファイル先頭にあるファイルからインポートすることで、クライアントコンポーネント内で呼び出すことができます：
+クライアントコンポーネントでサーバー関数を定義することはできません。ただし、`"use server"`ディレクティブが先頭にあるファイルからインポートすることで、クライアントコンポーネントで呼び出すことができます:
 
 ```ts filename="app/actions.ts" switcher
 'use server'
@@ -133,16 +133,16 @@ export function Button() {
 
 ## サーバー関数の呼び出し
 
-サーバー関数を呼び出す主な方法は2つあります：
+サーバー関数を呼び出す主な方法は2つあります:
 
-1. サーバー/クライアントコンポーネント内の[フォーム](#forms)
-2. クライアントコンポーネント内の[イベントハンドラー](#event-handlers)
+1. サーバー/クライアントコンポーネントでの[フォーム](#forms)使用
+2. クライアントコンポーネントでの[イベントハンドラ](#event-handlers)使用
 
 ### フォーム
 
 ReactはHTMLの[`<form>`](https://react.dev/reference/react-dom/components/form)要素を拡張し、HTMLの`action`プロパティでサーバー関数を呼び出せるようにしています。
 
-フォーム内で呼び出された場合、関数は自動的に[`FormData`](https://developer.mozilla.org/docs/Web/API/FormData/FormData)オブジェクトを受け取ります。ネイティブの[`FormData`メソッド](https://developer.mozilla.org/en-US/docs/Web/API/FormData#instance_methods)を使用してデータを抽出できます：
+フォームで呼び出された場合、関数は自動的に[`FormData`](https://developer.mozilla.org/docs/Web/API/FormData/FormData)オブジェクトを受け取ります。ネイティブの[`FormData`メソッド](https://developer.mozilla.org/en-US/docs/Web/API/FormData#instance_methods)を使用してデータを抽出できます:
 
 ```tsx filename="app/ui/form.tsx" switcher
 import { createPost } from '@/app/actions'
@@ -179,8 +179,8 @@ export async function createPost(formData: FormData) {
   const title = formData.get('title')
   const content = formData.get('content')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 ```
 
@@ -191,16 +191,16 @@ export async function createPost(formData) {
   const title = formData.get('title')
   const content = formData.get('content')
 
-  // データを更新
-  // キャッシュを再検証
+  // データ更新
+  // キャッシュ再検証
 }
 ```
 
-> **豆知識**：`action`プロパティに渡された場合、サーバー関数は_サーバーアクション_とも呼ばれます。
+> **補足:** `action`プロパティに渡された場合、サーバー関数は_サーバーアクション (Server Actions)_ とも呼ばれます。
 
-### イベントハンドラー
+### イベントハンドラ
 
-`onClick`などのイベントハンドラーを使用して、クライアントコンポーネント内でサーバー関数を呼び出すことができます。
+クライアントコンポーネントでは`onClick`などのイベントハンドラを使用してサーバー関数を呼び出せます。
 
 ```tsx filename="app/like-button.tsx" switcher
 'use client'
@@ -252,25 +252,25 @@ export default function LikeButton({ initialLikes }) {
 }
 ```
 
-## 例
+## 使用例
 
-### 保留状態の表示
+### 処理中状態の表示
 
-サーバー関数の実行中、Reactの[`useActionState`](https://react.dev/reference/react/useActionState)フックを使用してローディングインジケーターを表示できます。このフックは`pending`ブール値を返します：
+サーバー関数の実行中は、Reactの[`useActionState`](https://react.dev/reference/react/useActionState)フックを使用してローディングインジケータを表示できます。このフックは`pending`ブール値を返します:
 
 ```tsx filename="app/ui/button.tsx" switcher
 'use client'
 
-import { useActionState } from 'react'
+import { useActionState, startTransition } from 'react'
 import { createPost } from '@/app/actions'
 import { LoadingSpinner } from '@/app/ui/loading-spinner'
 
 export function Button() {
   const [state, action, pending] = useActionState(createPost, false)
 
   return (
-    <button onClick={async () => action()}>
-      {pending ? <LoadingSpinner /> : '投稿を作成'}
+    <button onClick={() => startTransition(action)}>
+      {pending ? <LoadingSpinner /> : '投稿作成'}
     </button>
   )
 }
@@ -279,31 +279,31 @@ export function Button() {
 ```jsx filename="app/ui/button.js" switcher
 'use client'
 
-import { useActionState } from 'react'
+import { useActionState, startTransition } from 'react'
 import { createPost } from '@/app/actions'
 import { LoadingSpinner } from '@/app/ui/loading-spinner'
 
 export function Button() {
   const [state, action, pending] = useActionState(createPost, false)
 
   return (
-    <button onClick={async () => action()}>
-      {pending ? <LoadingSpinner /> : '投稿を作成'}
+    <button onClick={() => startTransition(action)}>
+      {pending ? <LoadingSpinner /> : '投稿作成'}
     </button>
   )
 }
 ```
 
 ### キャッシュの再検証
 
-更新を実行した後、サーバー関数内で[`revalidatePath`](/docs/app/api-reference/functions/revalidatePath)または[`revalidateTag`](/docs/app/api-reference/functions/revalidateTag)を呼び出すことでNext.jsのキャッシュを再検証し、更新されたデータを表示できます：
+更新を実行した後、サーバー関数内で[`revalidatePath`](/docs/app/api-reference/functions/revalidatePath)または[`revalidateTag`](/docs/app/api-reference/functions/revalidateTag)を呼び出すことでNext.jsのキャッシュを再検証し、更新されたデータを表示できます:
 
 ```ts filename="app/lib/actions.ts" switcher
 import { revalidatePath } from 'next/cache'
 
 export async function createPost(formData: FormData) {
   'use server'
-  // データを更新
+  // データ更新
   // ...
 
   revalidatePath('/posts')
@@ -315,23 +315,23 @@ import { revalidatePath } from 'next/cache'
 
 export async function createPost(formData) {
   'use server'
-  // データを更新
+  // データ更新
   // ...
   revalidatePath('/posts')
 }
 ```
 
 ### リダイレクト
 
-更新後にユーザーを別のページにリダイレクトしたい場合があります。サーバー関数内で[`redirect`](/docs/app/api-reference/functions/redirect)を呼び出すことでこれを行えます：
+更新後にユーザーを別のページにリダイレクトしたい場合があります。サーバー関数内で[`redirect`](/docs/app/api-reference/functions/redirect)を呼び出すことで実現できます:
 
 ```ts filename="app/lib/actions.ts" switcher
 'use server'
 
 import { redirect } from 'next/navigation'
 
 export async function createPost(formData: FormData) {
-  // データを更新
+  // データ更新
   // ...
 
   redirect('/posts')
@@ -344,7 +344,7 @@ export async function createPost(formData: FormData) {
 import { redirect } from 'next/navigation'
 
 export async function createPost(formData) {
-  // データを更新
+  // データ更新
   // ...
 
   redirect('/posts')