コミュ障だから明日が僕らをよんだって返事もろくにしなかった

何かを創る人に憧れたからブログをはじめたんだと思うよ

ヴゥエ（嘔吐）

Vue.js
すごくためにならない話

エメトフィリアという言葉をご存知だろうか。あまり聞き慣れない言葉だとは思います。エメトフィリアとは、他人の嘔吐を見ることないし自ら嘔吐することによって興奮するフェティシズムのことをさします。このブログを読んでいる皆様はどうか知りませんが、一言だけ言わせてください。


いいよね。



さて、変態性癖の話はこの辺にして、本題に入りましょうかね。


広告


Vue.jsなどをやってみる

Vue.jsとはなんじゃ。

Vue (発音は / v j u ː / 、 view と同様）はユーザーインターフェイスを構築するためのプログレッシブフレームワークです。他の一枚板(モノリシック: monolithic)なフレームワークとは異なり、Vue は初めから少しづつ適用していけるように設計されています。中核となるライブラリは view 層だけに焦点を当てているため、Vue.js を使い始めたり、他のライブラリや既存のプロジェクトに統合したりすることはとても簡単です。一方、モダンなツールやサポートライブラリと併せて利用することで、洗練されたシングルページアプリケーションを開発することも可能です。

というわけで、実は先程までの僕の変態嗜好の話は一切関係なかったのです。最初の話は僕がやりたかっただけの話です。ちなみに読み方はビューらしいです。ヴゥエではないそうです。

公式
Vue.js


で、なぜこんな話をしてしまったかというと例の場所で講座がやっていたのでまたしても手を染めてしまったという報告もかねてです。先程の引用の通り、Vue.jsはJS系のフレームワークです。割とシンプルなフレームワークなので僕のように軽い気持ちで手を出してしまいやすいかもしれないです。ま、僕はネットの情報を適当に拾ってきて言っているのでいい加減なことしか書いてませんけどね。
f:id:andron:20170806105213p:plain


設計概念としてはＭＶＶＭって呼ばれるやつらしいです。
Model View ViewModel - Wikipedia
まあ、なんか色々書いてあるのでWikiでも見て「そーなのかー」ってなりましょう。

僕がざっくりといい加減なことを書きますとこういった設計思想って、どこに何があるのか分かるようにする収納術的なやつなんですよ。料理で言えば、ここの棚に調味料を入れてここには調理器具、これはよく使うからあそこに置いておこうみたいな考え方です。ソースコードでいえば一気にブワーッて何か書いてあったらよくわかんなくなるから、こういうのはここに書いてねっていう決まり事をつくったわけです。まあ、そんなわけです。この考え方もパーフェクトなものが未だ見つかっていないので概念がいっぱいあります。なので、ブログネタもいっぱい出来てしまいます。でもその話はおいおいどこかでやっていくにして、今回はVue.jsを触っていきます。

おさわりしてみる

たいていフレームワーク系の講座って最後に「ToDoアプリを作ってみよう」とかの話になるんですよね。これはなんでなんでしょうね。一説によると簡易的なＣＲＵＤ構造を学習できるからと言われているそうだかららしいですね[要出典]。

まあ、そんな話どうでもいいですね。僕はあえてよくわかんないものを作るのに全力投球するのでそんなものは関係ないからね。

というわけで、もはや恒例となってしまった月曜日判定をつくりました。
f:id:andron:20170806010215p:plain

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Vue Demo</title>
</head>
<body>
 
<div id="demo">
	<p>{{message}}</p>
    <p>{{message_m}}</p>
</div>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.1/vue.min.js"></script>
<script>
var date = new Date;
var msg_sample = new Vue({
    el: '#demo',
    data: {
        message: 'Demo'
    },
    computed: {
    	message_m: function(){
    		if(date.getDay()==1){
    			return "This is Monday."
    		}else{
    			return "This is not Monday."
    		}
    	}
    }
})
</script>
</body>
</html>

というわけで今日は月曜日です。
とってもとっても吐き気がしますわ。みんなもヴゥエ.jsをつかってこんな吐き気のするプログラムを作ってみようね。

おしまい。

[トップへ]