はじめに 軽量JSフレームワークとして有名なVue.js。 最近、Laravelに触れる機会が増えたことと、以前からRails + Vueという構築を耳にするので、今更ではありますが勉強を始めようと思います。 今回は基本文法に関してメモしていきます。 なお、Vue.jsの公式ドキュメントはこちらになります。 https://jp.vuejs.org/ 使用ツール 今回はJSFiddleを使用して開発します。 公式でも進められており、今回のような簡単な文法を試すくらいであればちょうど良いのかな、と思います。 なお、使用する場合はJavaScriptのFWをVue.jsの2系にします。 今回扱う内容は、公式ドキュメントに依ります。

ちなみに、 vm はViewModelの意味であり、MVVMパターンの影響を受けているとのことです。 私は前回、Vueインスタンスを app という変数に保存しておりましたが、慣例的には誤りだったということになります。 （申し訳ありません！） プロパティとメソッド Vueインスタンスは、自身の data の値を持ちます。 data が変更されると、Vueインスタンスのプロパティも変化し、その逆も然りです。 試しに、下記のコードを書き、インスタンスを生成します。

はじめに 7/12 修正 記事下部にて、 filter メソッドを使用している箇所がありましたが、 forEach の方が適しているとご指摘がありましたので、修正しました。 以前Qiitaの方に投稿した記事ですが、こちらにも投稿します。 少しご指摘もいただいたので、FIX版になります！ Vue.jsの勉強で超簡単なタスク管理アプリを作ってみる 今まで、Vue.jsの記事として下記を投稿してきました。 Vue.js入門その１〜基本文法〜 Vue.js入門その２〜Vueインスタンスってなんぞ？〜 ただ、今ひとつピンとこなかったため、よくあるTODOアプリを作成してみました。 サンプルはこちらです。 https://jsfiddle.net/naoki85/fo26rmr0/12/ 準備 Bootstrapを読み込み CSSは面倒なので、Bootstrapを使用したいと思います。 JS Fidd

はじめに 前回までのあらすじ Vue.jsの勉強を始めたtonnyであったが、そろそろRailsの中に組み込んでみたいと思いたつ。 最近Dockerも勉強しているため、せっかくなので、Dockerで環境構築をしてみることにした。 前回までの記事はこちら。 Vue.js入門その１〜基本文法〜 Vue.js入門その２〜Vueインスタンスってなんぞ？〜 Vue.js入門その３〜簡単にTODOアプリを作ってみたよ〜 今回の趣旨 下記のブログ、および動画でRails + Vue.jsの学習をしました。 非常に分かりやすいため、オススメです。 【動画付き】Rails 5.1で作るVue.jsアプリケーション ～Herokuデプロイからシステムテストまで～ 今回はこちらの記事内容をDockerを使用して実施しました。 そのため、今回はDockerを使って、Rails + Vue.jsの環境を作った話とな

はじめに Dockerを触る機会ができたため、この機に勉強をしたいと思います。 DockerにはRailsプロジェクトを開始するチュートリアルがあったので、今回はそちらをやってみたいと思います。 Quickstart: Compose and Rails 環境 Mac OS X Yosemite 10.10.5 Docker for Macのインストール 今ではDockerもMacOSにインストールできるのですね。 まずはこちらからDocker for Macをインストールします。 Install Docker for Mac 特に変わった使い方をしたいわけではないので、Stable channel（安定版）を入手します。 基本的なコマンドはこちらで説明があります。 Get started with Docker for Mac インストールしたDockerを起動し、下記コマンドで確認しま