MongoDBインストール&起動

インストール済みであれば不要です。

$ brew install mongodb
$ sudo mkdir /var/lib/mongodb
$ sudo touch /var/log/mongodb.log
$ sudo mongod --dbpath /var/lib/mongodb --logpath /var/log/mongodb.log
$ export MONGODB_URI=mongodb://localhost

HomebrewでMacにMongoDBをインストールした時のメモ - Qiita

go-vue-example実行

githubからソースをダウンロードして実行しました。 depについてはこの記事を参照してください。

build & run

$ git clone https://github.com/mattn/go-vue-example
$ dep unsure
$ go build
$ ./go-vue-example

Webアプリをブラウザで開く

http://localhost:4000/

DBの状態を調べる

$ mongo
> show dbs;
admin                       0.000GB
config                      0.000GB
go-vue-example-development  0.000GB
local                       0.000GB
> use go-vue-example-development;
switched to db go-vue-example-development
> show collections;
tasks
> db.tasks.find();
{ "_id" : ObjectId("5abef638056d1b319501bdc6"), "body" : "Have a breaskfast", "done" : true, "created_at" : NumberLong(1522464312), "updated_at" : NumberLong(1522547660) }
{ "_id" : ObjectId("5ac03e6e056d1b319501bdc7"), "body" : "do second task", "done" : false, "created_at" : NumberLong(1522548334), "updated_at" : NumberLong(0) }
>

所感

CRUD的な操作を持つWebアプリをさっと作って動かすという観点だと、echo-scaffold(golang)とvueの組み合わせは便利そう。

必要な処理は、UIイベント処理(タスク入力および)、ajax呼び出し、取得したデータのDOMマッピングです。それぞれ、どのように記述するかは、以下のマニュアルを見てください。

はじめに — Vue.js

サーバーサイド(golang)

githubのコードと以下のコマンドで生成したコードには差分はありませんでした。

$ echo-scaffold init go-vue-example
$ cd go-vue-example
$ echo-scaffold scaffold task body:string done:bool

フロントエンド

element UIとaxiosのvuejsライブラリを使っており、実際に作成しているWebアプリ(vuejsのファイル)は以下の2ファイルです。

index.html
app.js

unokun’s blog

GolangとVue.js...