Vue.jsでより本格的なプロジェクト
プロジェクトとしての開発
Node.jsとnpm
Node.jsは「JavaScript実行環境」と呼ばれるものです。Node.jsはJavaScriptのスクリプトをその場で実行できるようにするものです。つまり、サーバープログラムそのものをJavaScriptで開発する事が可能になります。
npmはパッケージ管理ツールです。Node.jsというプログラムに組み込まれています。
Node.jsのインストール
推奨版をダウンロードしましょう。
Node.jsのバージョンは「偶数が長期サポート」「奇数が短期サポートの試験的」です。
動作を確認する
ターミナルを起動して、
node –versionを記述。Node.jsのバージョンが表示されれば、インストールされています。
Vue CLIをインストールする。
Vue3開発のためのソフトウェアをインストールします。ターミナルから、
npm install -g @vue/cli
と記述します。エラーなど起こらず終了すれば、正常にVue CLIがインストールされています。
Vue CLIとは？
Vue3を開発するためのコマンドツールです。
プロトタイプを動かす。
プロトタイプとはWebアプリケーションの試作品のことです。
アプリケーションを作成する
ホームディレクトリにフォルダを作成し、そのなかに「app.vue」というテキストファイルを作成します。
<template>
<div id="app">
<h1>Hello!</h1>
<p>This is message...</p>
</div>
</template>
Code language: HTML, XML (xml)記述をしたら、app.vueがあるフォルダに移動します。
ターミナルで、vue serveとコマンドを実行します。
localhost:8080でWebブラウザ上に表示されます。
ターミナルで、control + cでもとの入力状態にもどります。
あくまで仮アプリケーション
.vueという拡張子のファイル1つ書くだけで簡単なアプリケーションの表示を作ることができます。
あくまで、「仮」のものです。
読んでいただいて、ありがとうございました！！Vue.js3超入門で勉強しています。すごいわかりやすいです。
