Vue.js以前に知っておくべきこと
このテキストについて
教える側が、抜けのないようにチェックしながら教えるためのテキスト
自習できるようになるまでの補助輪を想定。
きちんと資料にあたって調べる、という所をきっちりやる
目標
１ヶ月くらいでかんたんなSPAが作れる
説明の仕方
ざっくり３行で解説
知ってる人には飛ばしやすくしたい
気になる人向けの詳しい仕様解説もしたい
図とか使えればベスト
出来るかわからないけどアニメーションとか
Webのしくみ
TCP/IPとは
信頼性重視でデータを送る通信手法
インターネットの通信はTCP/IPをベースに行われている
HTTPとは
TCP/IP上で、HTMLファイルや画像ファイルなどを送受信する仕組み
ブラウザは基本的にHTTPを使って通信を行う
ホームページが表示されるまでに起きることの説明
この資料が秀逸なので全部読んでください
HTMLとは
「HyperText Markup Language」つまり言語の一つ
「テキストを超えたすごい便利なものを書くための言語」みたいなノリで作られた
今見ている「Webページ」はHTMLで作られている
CSSとは
「Cascading Style Sheets」
今見ている「Webページ」の見た目を変えるもの
色をつけたり文字サイズを変えたりレイアウトを作ったり
Webサーバってなに？
Webアプリって何
Request / Responseとは
動的Webページとは
JS基礎
構文
変数
関数
JSONとは ここも説明しづらい
準備
Node.js
npm
live-server
git
VSCode
HTML5 API
HTMLに関して詳しいおさらい
「属性」と「要素」
インライン要素とブロック要素
CSSのボックスモデル
DOMとは
DOM操作の方法
最初からquerySelectorにする
Formにどんなものがあるか
余裕があれば、valueとか取るところもやる
できればcheckboxを使わない例題にしておくこと
この辺でChrome DevToolsの使い方を教える
console.logとか
domいじったりCSSいじったり
とにかく何かにつけMDNを開いて説明すること（お手軽記事のランクが高いGoogleが役に立たなくなってくる）
CSS
Bootstrapの読み込み方
CSSクラスの指定方法
CDNを使ってみよう
Vue.jsの説明
どの情報源を見るべきか
Vueは公式が一番充実している
長いので全部読まなくても良いが、疑問に思ったときは公式内を探したほうがハマりが少ない
Qiitaを見てもいいが、古い資料を参考にするのは避けること(1.x以前のバージョン向け説明に注意)
CDN経由でVueを読み込む
Vueのよく使うAPIやディレクティブの説明
v-model
v-for
v-if
v-bind(class, style)
ここでJSONの知識が必要
CSSの優先順位（インラインで書くかヘッダに書くか）や詳細度の説明が必要
v-on(click)
dataに関して、よくわからない場合はgetter, setterが生える様子などを見せると良い
Reactivityの説明も必要っちゃ必要
例えば式がいつ再評価されるのかわからないという声があった。依存関係の追跡まで説明しないと理解が曖昧なままになるかも。
教えてて、リアクティブはVueの根幹の思想なんだなーと思えてくる。のでできれば教えておきたい
-----
できれば勉強したほうが良いこと
Node.jsとは
ブラウザと何が違うのか
npmとは
runkitで説明すると良いと思う
モジュールバンドラーとは
Vueをnpmで読み込む方法
Vueのsingle file componentについて
カスタム要素についての説明
propsについての説明
vue-cliの使い方
ES Moduleとは
Promise / async / awaitとは（難関）
Ajaxとは