作成するフォルダ、ファイルについて
適当な場所(デスクトップ等)に一つフォルダを作成すると、管理しやすいかと思います。
このVue.jsカリキュラムでは、各内容ごとにファイルを新規で作成していく必要はありません。
一度作ったファイルをずっと使いまわしても大丈夫な内容になっています。
例)
/Desktop/Vue/index.html
/Desktop/Vue/css/styles.css
/Desktop/Vue/js/main.js
例の通りにファイルを作成すると、このような構成になります。
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
については、この後解説します。
また、次のように、作成するファイルを一つだけにして書く方法もあります。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- css -->
<style>
</style>
</head>
<body>
<!-- Vue.jsの読み込み -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- Vue.jsの処理 -->
<script>
</script>
</body>
</html>
手軽に動きを確かめたいときには、便利ですね。
ただ、基本的には各ファイルは分けて管理する方法に慣れておいてください。
課題について
こちらの章に関しては、第4章チェックテストの提出が必要になります。
また、Vue.jsには様々なディレクティブが存在します。
この書き方だけが唯一の正解!ということはありませんので、
進めていて疑問点など出てきましたら講師に確認してみてください!