阿部 裕太 / Yuta Abe
へ
の
へ
の
も
へ
Vueアプリケーションを作成するフレームワーク
Nuxt.js :
Vue.js :
Vue.jsは便利すぎて自由に書けてしまう。
なので、規約を設ける。
負担が減る
↓
らしい
デプロイするための3つのモードのうちの1つgenerateモードを使う。
「yarn generate」コマンドで「pages」ディレクトリを参照したルートごとに HTML ファイルを生成
この吐き出されたファイルをサーバにアップし公開する流れ。
1.
↓
コマンド1つでプロジェクトファイルが生成される。
2.
⬆️ トップページ、projectsページとprojectの詳細ページが欲しいと想定した場合
3.
・vue.js
<section id="abe" v-bind:class="{active: testState}">
・jQuery
$("#abe").addClass("active");
<section id="abe">
この要素に"active"classを付与したい場合、
管理する場所を定め、変更する流れを作る。
ページやclassを切り替えたいタイミングが増えれば増えるほど管理が面倒になる・・
ちょっと困った点や要検証っぽい所
head内にGoogleTagManegerを書きたい
シングルクオートやダブルクオートの関係上サニタイズ無効する必要があった(?)
コメントアウトは静的ファイルには吐き出されない。
例えば、ソース納品の際にコメントアウトでヒントをメモしといて。みたいな場合
Nuxt.jsがよしなに色々とやってくれるので、裏で何が書かれているか見にくい。
Nuxt.jsでポートフォリオサイトを作ってみた
(まだ途中)
まとめ
おわり