Skip to content

Commit

Permalink
docs(ja) update ja/guide/index (#545)
Browse files Browse the repository at this point in the history
  • Loading branch information
aytdm authored and ImgBotApp committed Jan 10, 2023
1 parent fab0836 commit 6ac7a24
Showing 1 changed file with 21 additions and 3 deletions.
24 changes: 21 additions & 3 deletions content/ja/guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ category: prologue
position: 1
---

> Nuxt は、モダンな web アプリケーションを作成する Vue.js に基づいたプログレッシブフレームワークです。Vue.js 公式ライブラリ(vue、vue-router や vuex)および強力な開発ツール(webpack、Babel や PostCSS)に基づいています。 Nuxt の目標は、優れた開発者エクスペリエンスを念頭に置き、Web 開発を強力かつ高性能にすることです。
> Nuxt は、モダンな web アプリケーションを作成する Vue.js に基づいたプログレッシブフレームワークです。Vue.js 公式ライブラリ(vue、vue-router や vuex)および強力な開発ツール(webpack、Babel や PostCSS)に基づいています。Nuxt の目標は、優れた開発者エクスペリエンスを念頭に置き、Web 開発を強力かつ高性能にすることです。
## NuxtJS とは何か?

Expand Down Expand Up @@ -112,12 +112,30 @@ Nuxt.js をプロジェクトの UI レンダリング全体を担うフレー

1. [nuxtjs.org リポジトリ](https://github.com/nuxt/nuxtjs.org)をクローンする
2. `npm install` で依存関係のあるパッケージをインストールする
3. `npm run generate` を実行する
3. `nuxt build && nuxt export`(Nuxt v2.13 以上) または `npm run generate`(Nuxt v2.12 以下) を実行する
4. `dist` ディレクトリに配置する

これで自動化された**静的に生成されたウェブアプリケーション**ができます。:)

さらに `nuxt generate` で生成、CDN でホストされた E コマースのウェブアプリケーションを考えてみましょう。このアプリケーションは商品が在庫切れもしくは再入荷されるたびに再生成されます。ユーザーがアプリケーションを遷移している間に、在庫の状態が(再生成のおかげで)最新になるのです。もはや、サーバーで複数のインスタンスやキャッシュを持つ必要はないのです!
Nuxt v2.13 から使えるようになった新しいフルスタティックモジュールは、HTML とスタティックアセットをビルド時に生成します。これは全てが生成されることを意味し、SEO に寄与するだけでなくどの静的ホスティングプロバイダへも無料でホストすることができます。

Nuxt v2.13 にはリンクタグをクロールし、リンクに基づいて動的なルートを生成するクローラーがインストールされているため、手動で動的なリンクを生成する必要はありません。

静的なターゲットは、API への呼び出しを静的フォルダ内の payload.js ファイルに保存することで動作します。これらのペイロードはキャッシュされ、パフォーマンスとオフラインのサポートを向上させます。また、クライアント側のナビゲーションでAPIが呼び出されることがなくなるため(asyncDataやfetchを使用して呼び出される場合)、API を公開する必要がなくなります。

サイトが生成されると、HTML はすべてのコンテンツと共に生成され、クライアント側のナビゲーションでは、API データのペイロードファイルを使用してこれらのページが再構築されます。コードをコンテンツから分離することで、サイト全体を再構築することなくコンテンツを簡単に再生成することができます。つまり、一度サイトが構築され、コンテンツだけを変更したい場合は `nuxt export` を呼び出すだけでコンテンツだけを再生成することができます。コンテンツは webpack を経由する必要がないのでコンテンツの再生成が非常に速くなります。

Nuxt v2.13 以上で静的サイトを生成したい場合は、nuxt.config ファイルに値が `static``target` プロパティを追加する必要があります。`target` のデフォルト値は `server` です。

`nuxt.config.js`

```js
export default {
target: 'static'
}
```

新しい static target についての詳細は [article](/blog/going-full-static) を参照してください。

<div class="Alert">

Expand Down

0 comments on commit 6ac7a24

Please sign in to comment.