Ruby On Rails 小ネタ

久しぶりのRailsでRakeに関するまとめ

Vagrant上にRVMをインストールし、Railsアプリの環境をセットアップ

・初期設定

mkdir myApp
cd myApp
bundle init

・Rails自体もBundlerで管理する。※今回はRails4.2.2を使用
    Gemfileに以下を追加

gem 'rails', '4.2.2'

・Gemインストール
   Gemをプロジェクトのディレクトリ配下にインストール

bundle install --path vendor/bundle

・Railsプロジェクトを作成し実行

bundle exec rails new .
〜 省略 〜
bundle exec rails s -b 0.0.0.0

※Rails4.2以降で、Vagrant等のVM上でRailsサーバを実行する場合は「-b 0.0.0.0」が必要
   ↓ 「3.3 rails server デフォルトホスト」参照
   http://railsguides.jp/4_2_release_notes.html


Rakeコマンドを試すためscaffoldを利用し適当なページを作成

bundle exec rails g scaffold item name:string price:integer description:text
bundle exec rake db:migrate

実行し確認してみる

ここまではOK

色々なRakeコマンドを試す

・rake routes

    routes.rbに設定されたルーティング設定に基づき、URIパターンと、対応するコントローラ、

    アクションの一覧を表示する

 ↓実行結果

・rake db:migrate

   DBのマイグレーションを実行する

↓実行結果

・rake test

   アプリケーションのテストを実行する

↓実行結果

・rake stats

   アプリケーションのコードの統計を表示

         

↓実行結果

・rake notes

   アプリケーションのソースコード内のTODO, FIXME, OPTIMIZEキーワードを抽出し表示する

↓実行結果

Ruby On Rails アプリケーション作成 7 - カレンダーカスタマイズ -

久しぶりにRailsを触ってみる。

久しぶりなので、リハビリを済ました後FullCalendarを少しカスタム。
公式ドキュメント
http://arshaw.com/fullcalendar/

$(document).ready ->
  $('#calendar').fullCalendar
    header:
      right: 'agendaDay agendaWeek month today prev next'
    firstDay: 1
    weekends: true
    weekMode: 'fixed'
    weekNumbers: false
    timeFormat: 'H(:mm)'
    titleFormat:
      month: 'yyyy年 M月'
      week: 'M月d日'
      day: "d日'('ddd')'"
    monthNames: [
      '１月'
      '２月'
      '３月'
      '４月'
      '５月'
      '６月'
      '７月'
      '８月'
      '９月'
      '１０月'
      '１１月'
      '１２月'
    ]
    dayNamesShort: [
      '日'
      '月'
      '火'
      '水'
      '木'
      '金'
      '土'
    ]
    buttonText:
      today: '今日'
      month: '月'
      week: '週'
      day: '日'
    events: 'http://www.google.com/calendar/feeds/ja.japanese%23holiday%40group.v.calendar.google.com/public/full/'
    dayClick: (date, allDay, jsEvent, view) ->
      alert "dayclick #{date}"
      alert "Coordinates: #{jsEvent.pageX}, #{jsEvent.pageY}"
      alert "Current view #{view.name}"
      location.href = "show?param1=hoge&param2=fuga”

結局、google calendarを引っ張ってきて祝日を表示させるのは上手くいかなかったorz
注目はlocation.href = "show?param1=hoge&param2=fuga”

カレンダーの日付箇所をクリックした時に日付をパラメータにして
コントローラーへリダイレクトさせる。

※コントローラ側実装
  def show
    render :text => "param1 = #{params[:param1]}, param2 = #{params[:param2]}"
  end

↓表示結果

参考URL
http://little-braver.com/156/

Ruby On Rails アプリケーション作成 6 - カレンダーのクリックイベント設定 -

イベントの設定

とりあえず・・カレンダーの日付箇所をクリックしたらイベント起こしてみたいよね、
って事でイベントを設定。
公式サイトにも例があるので参考にして実装。

    dayClick: (date, allDay, jsEvent, view) ->
      alert "dayclick #{date}"
      alert "Coordinates: #{jsEvent.pageX}, #{jsEvent.pageY}"
      alert "Current view #{view.name}”

states.js.coffeeに追加。

実際クリックすると、

いい感じでイベントを拾えてるみたいです。

次にサイドバーを付けてみました。
以下サイトを参考に実装。
http://www.iwazer.com/~iwazawa/diary/2012/03/rails-layout-sidebar-link-setting.html
ついでにボタンも実装。

「設定」項目をサイドバーに追加し、「設定」▶︎「メンバー編集」、「種別の編集」、「システム設定」へ遷移できるように実装。
次は、メンバー登録ができるようにしたい!!

Ruby On Rails アプリケーション作成 5 - CoffeeScript -

CoffeeScriptお勉強

ドットインストールで勉強させて頂きながら、公式サイトのインタラクティブツールで
javascriptに変換される様子を見ながら勉強。

■　javasctipt変換前

# comment
###
 aaa
###
message = "hello world"
if message.length > 1
  alert message

s = """this is pen.
it the end"""

name = "taguchi"

alert "hi, #{name}, #{s}, #{15/3}"

###
配列、連想配列
###
a0 = [1, 2, 3, 4]
a1 = [
     1, 5, 8
     2, 4, 2
     ]

a3 = 
     "sato":
        "sales" : 200
        "cost"  : 80
     "sasaki":
        "sales" : 250
        "cost"  : 40

a4 = [1..5]
a5 = [1...5]

###
if文
###
signal = "red"

if signal == "red"
  alert "stop!"
else if signal == "green"
  alert "go"

###
比較演算子
is (===) isnt(!==)
not(!)
and(&&)
or(||)
###

x = 20

alert "true" if 10 < x < 30

###
switch
###

signal = "red"

switch signal
  when "red"
    alert "stop!"
  when "greed"
    alert "go"
  else
    alert "caution"

###
存在チェック
###

alert "ok!" if name?

###
for loop
###
for i in [0..3]
  alert i

a = ["a", "b", "c"]

for i, index in a
 alert "#{index}:#{i}"

###
連想配列のループ
###
sales = 
  "tanaka": 100
  "taguchi" : 200
  "sasaki": 300

for key, value of sales
  alert "#{key}:#{value}"
  

###
関数
###

hello = (s="aaa") ->
  alert "hello #{s}"

hello("ddd")
hello()

###
返り値
###

sum = (a, b) ->
  a + b

■　変換後

/*
 aaa
*/

var a, a0, a1, a3, a4, a5, hello, i, index, key, message, name, s, sales, signal, sum, value, x, _i, _j, _len;

message = "hello world";

if (message.length > 1) {
  alert(message);
}

s = "this is pen.\nit the end";

name = "taguchi";

alert("hi, " + name + ", " + s + ", " + (15 / 3));

/*
配列、連想配列
*/


a0 = [1, 2, 3, 4];

a1 = [1, 5, 8, 2, 4, 2];

a3 = {
  "sato": {
    "sales": 200,
    "cost": 80
  },
  "sasaki": {
    "sales": 250,
    "cost": 40
  }
};

a4 = [1, 2, 3, 4, 5];

a5 = [1, 2, 3, 4];

/*
if文
*/


signal = "red";

if (signal === "red") {
  alert("stop!");
} else if (signal === "green") {
  alert("go");
}

/*
比較演算子
is (===) isnt(!==)
not(!)
and(&&)
or(||)
*/


x = 20;

if ((10 < x && x < 30)) {
  alert("true");
}

/*
switch
*/


signal = "red";

switch (signal) {
  case "red":
    alert("stop!");
    break;
  case "greed":
    alert("go");
    break;
  default:
    alert("caution");
}

/*
存在チェック
*/


if (name != null) {
  alert("ok!");
}

/*
for loop
*/


for (i = _i = 0; _i <= 3; i = ++_i) {
  alert(i);
}

a = ["a", "b", "c"];

for (index = _j = 0, _len = a.length; _j < _len; index = ++_j) {
  i = a[index];
  alert("" + index + ":" + i);
}

/*
連想配列のループ
*/


sales = {
  "tanaka": 100,
  "taguchi": 200,
  "sasaki": 300
};

for (key in sales) {
  value = sales[key];
  alert("" + key + ":" + value);
}

/*
関数
*/


hello = function(s) {
  if (s == null) {
    s = "aaa";
  }
  return alert("hello " + s);
};

hello("ddd");

hello();

/*
返り値
*/


sum = function(a, b) {
  return a + b;
};

Ruby On Rails アプリケーション作成 4 - モデル作成 -

モデルの作成

とりあえず、データベースの形式はデフォルトのsqliteでいくとして、
データベースファイルを作成。

$ rake db:create

db/development.sqlite3 already exists

続いて、モデルの作成。

$ rails g model kind

      invoke  active_record

      create    db/migrate/20140104132444_create_kinds.rb

      create    app/models/kind.rb

      invoke    test_unit

      create      test/models/kind_test.rb

      create      test/fixtures/kinds.yml

⬇️マイグレーションファイルを以下に修正。

class CreateKinds < ActiveRecord::Migration

  def change

    create_table :kinds do |t|

      t.string :name, :null => false

      t.integer :io, :null => false

      t.timestamps

    end

  end

end

そしてマイグレート。

$ rake db:migrate

(in /Users/{ユーザ名}/Documents/develop/ruby/AcountBook)

==  CreateKinds: migrating ====================================================

-- create_table(:kinds)

   -> 0.0014s

==  CreateKinds: migrated (0.0015s) ===========================================

ちゃんとテーブルが作成されたか、sqliteコマンドで実行。

http://qiita.com/is0me/items/eb6677c3cb5ec956d038

$ rails db

SQLite version 3.7.13 2012-07-17 17:46:21

Enter ".help" for instructions

Enter SQL statements terminated with a ";"

sqlite> .tables

kinds              schema_migrations

sqlite> .schema kinds

CREATE TABLE "kinds" ("id" INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL, "name" varchar(255) NOT NULL, "io" integer NOT NULL, "created_at" datetime, "updated_at" datetime);

sqlite> .exit

ちゃんとできている模様。

マイグレーションファイル編集時に、別テーブルのidを参照する

例)

class CreateExpenses < ActiveRecord::Migration

  def change

    create_table :expenses do |t|

      t.references :kind, :null => false        ※ kindテーブルのidを参照

      t.references :member                         ※ memberテーブルのidを参照

      t.integer :expense, :null => false

      t.string :note

      t.date :date

      t.timestamps

    end

  end

end

⬇️参考リンク

http://railsdoc.com/migration

とりあえず、全てのテーブルを作成。

Ruby On Rails アプリケーション作成 3 - Bootstrap導入 -

Twitter bootstrapを使ってみる

前回のページのレイアウトが寂しげな感じだったので、
twitter bootstrapを使用してみる。

http://ppworks.hatenablog.jp/entry/2012/02/19/033644
上記サイトを参考にtwitter-bootstrap-railsをインストールし、application.html.erbに
適用し、サイトを表示してみる。・・・が！

いきなり怒られるorz
どうやら、railsさんがlessを認識していないっぽい。そもそもlessって何？

http://www.webopixel.net/html-css/503.html
☝️cssをシンプルにプログラム的に書けるものらしい。

Gemfileに

# Sprockets (what Rails 3.1 uses for its asset pipeline) supports LESS

gem 'less-rails'

gem 'therubyracer'

※therubyracer ➡️ http://d.hatena.ne.jp/suu-g/20121222/1356189597

を追加して、bundle install〜!!
もう一度表示してみると・・・

おおっ!!何かそれっぽいデザインになっている☆
色々カスタマイズしていくらしい、がまだまだ勉強が必要ですなorz

公式サイト
上記サイトを参考に修正。今回は以下デザインで終了。続きはまた(^^;)

Ruby On Rails アプリケーション作成 2 - カレンダー表示 -

とりあえず・・カレンダーを表示してみる

完成イメージでは、初回表示画面にでーんとカレンダーが表示されていて、
今月の集計〜とかが表示されているイメージなので、カレンダーを表示してみる。

http://blog.scimpr.com/2013/01/25/rails3-2でgoogle-calendarライクなカレンダーを使う〜fullcalendar-rails/
上記サイトを参考にfullcalendar-railsなるものをインストール。

この中で出てくる「アセットパイプライン」曖昧だったので調査。
http://rails.hatenadiary.jp/entry/2013/03/03/125801

サイト内に書かれている
group :assets do
  gem ‘fullcalendar-rails’
end
この部分。どうやらrails4からはgroup :assets do が無くなったらしい。
http://stackoverflow.com/questions/16406204/why-did-rails4-drop-support-for-assets-group-in-the-gemfile

本家サイトを参考にGemfileに以下を追加

gem 'fullcalendar-rails'

bundle installコマンドで、gem環境にインストール。
後は、application.js, application.cssともにfullcalendar-railsを読み込む様にサイトを参考に
追加。

表示してみる・・うまくカレンダーが表示されました。

⬇️最終的なstates.js.coffee
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
$ ->
  $('#calendar').fullCalendar
    header:
      right: 'agendaDay agendaWeek month today prev next'
    titleFormat:
      month: 'yyyy年 MMMM'
    monthNames: [
      '１月'
      '２月'
      '３月'
      '４月'
      '５月'
      '６月'
      '７月'
      '８月'
      '９月'
      '１０月'
      '１１月'
      '１２月'
    ]
    dayNamesShort: [
      '日'
      '月'
      '火'
      '水'
      '木'
      '金'
      '土'
    ]
    buttonText:
      today: '今日'
      month: '月'
      week: '週'
      day: ‘日'

色々cssもそれっぽいものに変更。

配色時に参考にしたサイト⬇️
http://www.find-job.net/startup/color-scheme-for-non-designer

とりあえずはいい感じ♪

次は集計欄をexcel風な感じにできたらな〜⬇️
http://programming-10000.hatenadiary.jp/entry/20130702/1372776366

Ruby On Rails アプリケーション作成 1 - RVMインストール -

何を作るか

今回気持ちを新たにrailsアプリケーションを作ってみる。。が！

何を作ろうかと思っていましたら、ちょうど昔作った「家計簿アプリ」を

スマホでも見たいという話もあって、WEBアプリケーションとして作成しようと

決めました。

まずは、、

環境が若干古いので、全てアップデート。

【現在の環境】

Mac Book Air

$ ruby -v

ruby 1.9.2p290 (2011-07-09 revision 32553) [x86_64-darwin12.2.0]

$ rails -v

Rails 3.0.17

古いなあorz。でも前のバージョンを使ってなんやかんやする時もあるかもしれないので、

色んなRubyのバージョンを管理してくれる、RVMを使用する。

http://d.hatena.ne.jp/mrgoofy33/20110518/1305649544

上記サイトを参考に、RVMをインストール。

$ git clone --depth 1 git://github.com/wayneeseguin/rvm.git

Cloning into 'rvm'...

remote: Counting objects: 502, done.

remote: Compressing objects: 100% (389/389), done.

remote: Total 502 (delta 41), reused 381 (delta 38)

Receiving objects: 100% (502/502), 1.06 MiB | 235.00 KiB/s, done.

Resolving deltas: 100% (41/41), done.

Checking connectivity... done

$ ls

rvm tig

$ cd rvm

$ ls

CONTRIBUTING.md VERSION lib

FORMATTING.md bin man

HACKING.md binscripts patches

History.txt config patchsets

LICENCE contrib rvm-test

NEXT.md examples rvm-test-rvm1

README gemsets scripts

README.rdoc help update-remote.sh

README.txt hooks

Rakefile install

$ ./install

Installing RVM to /Users/{ユーザ名}/.rvm/

    Adding rvm PATH line to /Users/{ユーザ名}/.profile /Users/{ユーザ名}/.bashrc /Users/{ユーザ名}/.zshrc.

    RVM sourcing line found in /Users/{ユーザ名}/.bash_profile.

    RVM sourcing line not found for Zsh, run the installer with '--auto-dotfiles' to fix it.

Installation of RVM in /Users/{ユーザ名}/.rvm/ is almost complete:

  * To start using RVM you need to run `source /Users/{ユーザ名}/.rvm/scripts/rvm`

    in all your open shell windows, in rare cases you need to reopen all shell windows.

# XXXXXXXXX,

#

#   Thank you for using RVM!

#   We sincerely hope that RVM helps to make your life easier and more enjoyable!!!

#

# ~Wayne, Michal & team.

In case of problems: http://rvm.io/help and https://twitter.com/rvm_io

       Help RVM 2.0: https://www.bountysource.com/fundraisers/489-rvm-2-0

  * WARNING: You have '~/.profile' file, you might want to load it,

    to do that add the following line to '/Users/{ユーザ名}/.bash_profile':

      source ~/.profile

インストール確認の為、rvm infoを実行

$ rvm info

system:

  system:

    uname:       "Darwin MacBook-Air.local 13.0.0 Darwin Kernel Version 13.0.0: Thu Sep 19 22:22:27 PDT 2013; root:xnu-2422.1.72~6/RELEASE_X86_64 x86_64"

    system:      "osx/10.9/x86_64"

    bash:        "/bin/bash => GNU bash, version 3.2.51(1)-release (x86_64-apple-darwin13)"

    zsh:         "/bin/zsh => zsh 5.0.2 (x86_64-apple-darwin13.0)"

  rvm:

    version:      "rvm 1.25.8 (manual) by Wayne E. Seguin <wayneeseguin@gmail.com>, Michal Papis <mpapis@gmail.com> [https://rvm.io/]"

    updated:      "31 seconds ago"

    path:         "/Users/{ユーザ名}/.rvm"

  homes:

    gem:          "not set"

    ruby:         "not set"

  binaries:

    ruby:         "/Users/{ユーザ名}/.rbenv/shims/ruby"

    irb:          "/Users/{ユーザ名}/.rbenv/shims/irb"

    gem:          "/Users/{ユーザ名}/.rbenv/shims/gem"

    rake:         "/Users/{ユーザ名}/.rbenv/shims/rake"

  environment:

    PATH:         "/usr/local/heroku/bin:/Users/{ユーザ名}/.rbenv/shims:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin:/usr/local/git/bin:/Users/{ユーザ名}/.rvm/bin"

    GEM_HOME:     ""

    GEM_PATH:     ""

    MY_RUBY_HOME: ""

    IRBRC:        ""

    RUBYOPT:      ""

    gemset:       ""

うまくインストールされたっぽい。

次にruby 2.0.0をインストール。

$ rvm install 2.0.0

Searching for binary rubies, this might take some time.

No binary rubies available for: osx/10.9/x86_64/ruby-2.0.0-p353.

Continuing with compilation. Please read 'rvm help mount' to get more information on binary rubies.

Checking requirements for osx.

Installing requirements for osx.

Updating system................................................................

Installing required packages: autoconf, automake, libtool, libyaml, libksba....

Updating certificates in '/usr/local/etc/openssl/cert.pem'.

Requirements installation successful.

Installing Ruby from source to: /Users/{ユーザ名}/.rvm/rubies/ruby-2.0.0-p353, this may take a while depending on your cpu(s)...

ruby-2.0.0-p353 - #downloading ruby-2.0.0-p353, this may take a while depending on your connection...

  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current

                                 Dload  Upload   Total   Spent    Left  Speed

100 10.2M  100 10.2M    0     0  1093k      0  0:00:09  0:00:09 --:--:-- 1065k

ruby-2.0.0-p353 - #extracting ruby-2.0.0-p353 to /Users/{ユーザ名}/.rvm/src/ruby-2.0.0-p353.

ruby-2.0.0-p353 - #configuring.................................................

ruby-2.0.0-p353 - #post-configuration.

ruby-2.0.0-p353 - #compiling.............................................................-

ruby-2.0.0-p353 - #installing...............

ruby-2.0.0-p353 - #making binaries executable.

ruby-2.0.0-p353 - #downloading rubygems-2.2.0

  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current

                                 Dload  Upload   Total   Spent    Left  Speed

100  400k  100  400k    0     0   755k      0 --:--:-- --:--:-- --:--:--  755k

ruby-2.0.0-p353 - #extracting rubygems-2.2.0.

ruby-2.0.0-p353 - #removing old rubygems.

ruby-2.0.0-p353 - #installing rubygems-2.2.0..

ruby-2.0.0-p353 - #gemset created /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353@global

ruby-2.0.0-p353 - #importing gemset /Users/{ユーザ名}/.rvm/gemsets/global.gems......|

ruby-2.0.0-p353 - #generating global wrappers.

ruby-2.0.0-p353 - #gemset created /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353

ruby-2.0.0-p353 - #generating default wrappers.

ruby-2.0.0-p353 - #adjusting #shebangs for (gem irb erb ri rdoc testrb rake).

Install of ruby-2.0.0-p353 - #complete 

Ruby was built without documentation, to build it run: rvm docs generate-ri

$ ruby -v

ruby 2.0.0p353 (2013-11-22 revision 43784) [x86_64-darwin13.0.0]

ruby 2.0.0がインストールされました。

次にrailsのインストールですが、rvmにはrailsの環境を整えるのに便利なgemsetというのが

あるらしいです。

http://www.machu.jp/diary/20110521.html#p01

新しいruby 2.0.0のgem環境なので、上記サイトにあるようにあまりgemが入ってないかと

思いきや、なんやかんや入っていました。

$ which ruby

/Users/{ユーザ名}/.rvm/rubies/ruby-2.0.0-p353/bin/ruby

$ gem list

*** LOCAL GEMS ***

bigdecimal (1.2.0)

bundler (1.5.1)

bundler-unload (1.0.2)

executable-hooks (1.2.6)

gem-wrappers (1.2.1)

io-console (0.4.2)

json (1.7.7)

minitest (4.3.2)

psych (2.0.0)

rake (0.9.6)

rdoc (4.0.0)

rubygems-bundler (1.4.2)

rvm (1.11.3.8)

test-unit (2.0.0.0)

$ which gem

/Users/{ユーザ名}/.rvm/rubies/ruby-2.0.0-p353/bin/gem

$ 

rails用に新規のgemsetを作成。

$ rvm gemset list

gemsets for ruby-2.0.0-p353 (found in /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353)

=> (default)

   global

$ rvm gemset create rails40

ruby-2.0.0-p353 - #gemset created /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353@rails40

ruby-2.0.0-p353 - #generating rails40 wrappers.

$ rvm gemset list

gemsets for ruby-2.0.0-p353 (found in /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353)

=> (default)

   global

   rails40

作成した環境へ切り替える。

$ rvm 2.0.0@rails40

$ ruby -v

ruby 2.0.0p353 (2013-11-22 revision 43784) [x86_64-darwin13.0.0]

$ rvm gemset list

gemsets for ruby-2.0.0-p353 (found in /Users/{ユーザ名}/.rvm/gems/ruby-2.0.0-p353)

   (default)

   global

=> rails40

この環境のgemにrailsをインストールする。

$ rails -v

Rails 4.0.2

無事railsをインストール。

新規プロジェクト作成し、起動を確認。ん〜なんとかうまくいってる感じ。