Vueの基本
Nuxt は、Vue.js というユーザーインターフェイスを構築するためのプログレッシブなフレームワークを使用しています。このセクションでは、Vue の基本について説明します。
エディタに表示されているのは、Vueシングルファイルコンポーネント(SFC)です。
SFC は、HTML、CSS、および JavaScript を 1 つの .vue
ファイル内にまとめた再利用可能な自己完結型のコードブロックです。これは、JavaScript ロジックを定義するための <script setup>
ブロック、HTML テンプレートを定義するための <template>
ブロック、および CSS スタイルを定義するためのオプションの <style>
ブロックで構成されています。右側のプレイグラウンドで実際に操作してみるか、公式のVueドキュメント で詳細を読むことができます。
Nuxt では Vue SFC をそのままサポートしており、アプリケーションを構築するために使用することを強くお勧めします。Nuxt が Vue のデフォルトの Vue SFC と異なる点の 1 つは、Vueユーティリティを自動インポート することです。そのため、ref
、computed
などの Vue API を直接インポートせずに使用することができます。
ヒント: Vue コンポーネントを定義する方法はいくつかありますが、一般的には Composition API を使用した <script setup>
を使用することをお勧めします。これにより、より良い開発者体験を得ることができます。Vue を初めて使用する場合、異なる選択肢をすべて理解することにこだわる必要はありません。私たちの推奨する方法を採用すれば、最も直感的に Vue を始められるでしょう。
今後、以下のトピックについて説明します: