1. はじめに

Vue.js はJavaScript のフレームワークです。

Vue.js を用いることによって複雑なウェブアプリケーションも簡単に作成することが可能になります。

ドキュメントは日本語化されており、そのため英語が苦手なエンジニアやデザイナーにも優しく、日本でもファンが多いです。

Vue.js

2. 今回の目的

Vue.js を触ってみる
Vue.js の機能を覚える

3. 今回必要なスキル

HTML
CSS
JavaScript(ちょっとわかる)

4. 環境構築

Vue.jsの環境を試すためにはCDNで読み込むのが一番スピーディーなアプローチです。

下記のHTMLタグを<head>のなかで読み込みます。

<script src="<https://cdn.jsdelivr.net/npm/vue/dist/vue.js>"></script>

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Vue.js ハンズオン</title>
  <script src="<https://cdn.jsdelivr.net/npm/vue/dist/vue.js>"></script>
</head>
<body>
	<div id="app">
	</div>
  <script src="./js/main.js"></script>
</body>
</html>

main.js

jsというフォルダを作って、そこの中に入れてください。