Nuxt のコンセプト

この章では、Nuxt のコアコンセプトについて説明します。

Nuxt は、直感的で拡張可能な方法で、タイプセーフで高性能で本番向けのフルスタック Web アプリケーションやウェブサイトを Vue.js で作成するための無料かつオープンソースのフレームワークです。Vue.js に慣れていない場合は、まず Vue の基本セクションから始め、最初に 公式 Vue ドキュメント を読むことをお勧めします。

自動化と慣習

Nuxt は慣習と意見のあるディレクトリ構造を使用して、繰り返しのタスクを自動化し、開発者が機能の追加に集中できるようにします。設定ファイルはカスタマイズ可能で、デフォルトの動作を上書きすることができます。

• ファイルベースのルーティング: pages/ ディレクトリの構造に基づいてルートを定義します。これにより、アプリケーションを整理し、手動でルートを構成する必要がなくなります。
• 自動インポート: 対応するディレクトリに Vue コンポーザブルやコンポーネントを記述し、ツリーシェイキングと最適化された JS バンドルの利点を活用してインポートすることができます。
• コード分割: Nuxt は自動的にコードを小さなチャンクに分割し、アプリケーションの初期読み込み時間を短縮するのに役立ちます。
• サーバーサイドレンダリング: Nuxt には組み込みの SSR 機能が付属しているため、別個のサーバーを設定する必要はありません。
• データ取得ユーティリティ: Nuxt は、SSR 互換のデータ取得を処理するコンポーザブルや異なる戦略を提供します。
• ゼロコンフィグ TypeScript サポート: 自動生成された型と tsconfig.json を使用して、TypeScript を学ぶ必要なく、タイプセーフなコードを記述できます。
• 構成済みのビルドツール: 開発時にホットモジュールリプレースメント（HMR）をサポートし、本番用にコードをバンドルするために Vite をデフォルトで使用しています。

Nuxt はこれらを処理し、フロントエンドとバックエンドの機能を提供するため、あなたが重要視すべきことに集中できます: あなたの Web アプリケーションを作成すること。

はじめに

このプレイグラウンドには、Nuxt がインストールされ、設定されているため、アプリケーションの作成を直接開始できます。自分のマシンに Nuxt をローカルにインストールしたい場合は、インストールガイドに従ってください。

始めるには、Nuxt アプリケーションのエントリがどのように定義されているかについて学びましょう。