ページ

2015年6月28日日曜日

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キーワードを抽出し表示する

↓実行結果












2015年6月23日火曜日

SwiftのOptionalまとめ

慣れてないと間違いそうになるSwiftのOptionalまとめ

Optinal Type / Optional Value
  ・・・変数がnilを許容できるかどうかを設定できる

・通常
通常はnilを代入できない
var hoge2:String = nil // NG
var fuga:String = nil // NG

・オプショナル
変数の宣言時に?を付ける
var hoge:String? = nil // OK

暗黙的なオプショナル
var fuga:String! = nil // OK
上記の「?」と「!」の違いは・・・
通常のOptionalは「?」を使うが、引数に渡す際にnilでないことを明示的に示す為
アンラップ(「!」を使用する)してやる必要がある。
例)
var num :Int? = 300
println(“\(num!)”)
※上記の「!」と暗黙的なオプショナルの「!」は異なる

暗黙的なオプショナルは使用時にアンラップする必要がない 。
例)
var num :Int! = 300
println(“\(num)”)

・オプショナルバインディング
Optionalはif文の条件で使用することができる。
例)
var num :Int?
if let fix = num {
  println(“確定”)
} else {
  println(“nil”)
}
num がnilだとprintln(“nil”)、値が入っていたらprintln(“確定”)が実行される


・nil結合演算
Optionalの値がnilの場合に特定の値を指定できる。
例)
var num: Int?
let fix = num ?? 99 // 99が設定される

var str: String? = “Hoge"
println(str ?? “Fuga") //  “Hoge"が出力される

・捕捉 「is」 と 「as」
isはインスタンスのチェックを行う(javaのinstanceofみたいなもの)
asはダウンキャストを行う
as? はダウンキャストに失敗したらnilを返す


2015年6月19日金曜日

Vagrantメモ

いつも忘れてしまうので、備忘録。

・~/.ssh/configへの仮想サーバssh接続設定出力
$ vagrant ssh-config --host [ホスト名] >> ~/.ssh/config 
これで ssh [ホスト名]で接続できる。

・sahara関連
1. sandbox有効
$ vagrant sandbox on

2. rollback
$ vagrant sandbox rollback

3. commit
$ vagrant sandbox commit

4. sandbox無効化
$ vagrant sandbox off



2015年6月13日土曜日

新しい技術を学んでみる 5 - Three.js -

今回はWebGLをサポートする「Three.js」を学習

概要
  WebGLをサポートした3D描画ライブラリでJavaScriptで記述
  公式ページ
  http://threejs.org

WebGLが使えるブラウザ
  色々使用状況を調べれるサイト
  http://caniuse.com


公式ページから早速ダウンロード



以下が実際に使うもの


・build/three.js
・build/three.min.js
・exsamples/js/controls/OrbitControls.js

雛形ファイルの作成

・index.html
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>Three.jsの練習</title>
   </head>
  <body>
    <div id="stage"></div>
    <script src="three.min.js"></script>
    <script>
      (function() {

      })();
    </script>
  </body>
</html>

Three.jsの構成要素

Scene
- Mesh(部品)
--Geometry(形状)
--Material(材質)
-Light
-Camera

簡単なBoxを描画してみる
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>Three.jsの練習</title>
  </head>
  <body>
    <div id="stage"></div>
    <script src="three.min.js"></script>
    <script>
      (function() {
        var width = 500;
        var height = 300;
        // scene
        var scene = new THREE.Scene();

        // mesh
        var geometry = new THREE.BoxGeometry(50, 50, 50);
        var material = new THREE.MeshBasicMaterial({ color: "red"});
        var cube = new THREE.Mesh(geometry, material);
        cube.position.set(0, 0, 0);
        scene.add(cube);

        // light

        // camera
        var camera = new THREE.PerspectiveCamera(45, width / height, 1, 1000);
        camera.position.set(200, 200, 500);
        camera.lookAt(cube.position);

        // rendering
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(width, height);
        renderer.setClearColor(0xeeeeee, 1);
        document.getElementById('stage').appendChild(renderer.domElement);
        renderer.render(scene, camera);

       })();
    </script>
  </body>
</html>


↓描画結果



・ライトをいい感じで当ててみる
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>Three.jsの練習</title>
  </head>
  <body>
    <div id="stage"></div>
    <script src="three.min.js"></script>
    <script>
      (function() {
        var width = 500;
        var height = 300;
        // scene
        var scene = new THREE.Scene();

        // mesh
        var geometry = new THREE.BoxGeometry(50, 50, 50);
        //var material = new THREE.MeshBasicMaterial({ color: "red"});
        var material = new THREE.MeshLambertMaterial({ color: "red"});
        var cube = new THREE.Mesh(geometry, material);
        cube.position.set(0, 0, 0);
        scene.add(cube);

        // light
        var light = new THREE.DirectionalLight(0xffffff, 1);
        light.position.set(0, 100, 30);
        scene.add(light);
        var ambient = new THREE.AmbientLight(0x550000);
        scene.add(ambient);

        // camera
        var camera = new THREE.PerspectiveCamera(45, width / height, 1, 1000);
        camera.position.set(200, 200, 500);
        camera.lookAt(cube.position);

        // rendering
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(width, height);
        renderer.setClearColor(0xeeeeee, 1);
        document.getElementById('stage').appendChild(renderer.domElement);
        renderer.render(scene, camera);

      })();
    </script>
  </body>
</html>


↓実行結果



・AxisHelperの追加
X軸、Y軸を視覚的に表示するヘルパーを追加
        // helper
        var axis = new THREE.AxisHelper(1000);
        axis.position.set(0, 0, 0);
        scene.add(axis);

↓実行結果



・床を追加しそこに影を描画 + アニメーションしてみる
<!DOCTYPE html>
<html lang="ja">
   <head>
    <meta charset="utf-8">
    <title>Three.jsの練習</title>
   </head>
   <body>
    <div id="stage"></div>
    <script src="three.min.js"></script>
    <script>
      (function() {
        var width = 500;
        var height = 300;
        // scene
        var scene = new THREE.Scene();

        // mesh
        var geometry = new THREE.BoxGeometry(50, 50, 50);
        //var material = new THREE.MeshBasicMaterial({ color: "red"});
        var material = new THREE.MeshLambertMaterial({ color: "red"});
        var cube = new THREE.Mesh(geometry, material);
        cube.castShadow = true;
        cube.position.set(0, 50, 0);
        scene.add(cube);

        var sGeometry = new THREE.SphereGeometry(30);
        var sMaterial = new THREE.MeshLambertMaterial({ color: "blue"});
        var sphere = new THREE.Mesh(sGeometry, sMaterial);
        sphere.castShadow = true;
        sphere.position.set(50, 50, 50);
        scene.add(sphere);

        // Plane
        var pGeometry = new THREE.PlaneGeometry(300, 300);
        var pMaterial = new THREE.MeshLambertMaterial(
          { color: 0x0096d6, side: THREE.DoubleSide });
        var plane = new THREE.Mesh(pGeometry, pMaterial);
        plane.receiveShadow = true;
        plane.position.set(0, 0, 0);
        plane.rotation.x = 90 * Math.PI / 180;
        scene.add(plane);

        // light
        var light = new THREE.DirectionalLight(0xffffff, 1);
        light.position.set(0, 100, 30);
        light.castShadow = true;
        scene.add(light);
        var ambient = new THREE.AmbientLight(0x550000);
        scene.add(ambient);

        // camera
        var camera = new THREE.PerspectiveCamera(45, width / height, 1, 1000);
        camera.position.set(200, 300, 500);
        camera.lookAt(cube.position);

        // helper
        var axis = new THREE.AxisHelper(1000);
        axis.position.set(0, 0, 0);
        scene.add(axis);

        // rendering
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize(width, height);
        renderer.setClearColor(0xeeeeee, 1);
        renderer.shadowMapEnabled = true;
        document.getElementById('stage').appendChild(renderer.domElement);

        function render() {
          requestAnimationFrame(render);
          cube.rotation.x += 1 * Math.PI / 180;
          cube.rotation.y += 1 * Math.PI / 180;
          cube.rotation.z += 1 * Math.PI / 180;
          sphere.position.x = Math.sin(new Date().getTime() / 200) * 100;
          sphere.position.z = Math.cos(new Date().getTime() / 200) * 100;
          renderer.render(scene, camera);
        }
        render();

      })();
    </script>
  </body>
</html>

 ↓実行結果





2015年6月7日日曜日

GitLabのプロフィール画像が表示されない件

GitLabでプロフィール画像をアップロードをしても画像が表示されない。







こんな感じ

コンソールをみると・・




URLがhttp://localhostになっているorz

調べていく内に以下サイトを発見
http://xnn.sakura.ne.jp/blog/2014/08/gitlab_avatar_problem_under_reverse_proxy/

/opt/gitlab/embedded/service/gitlab-rails/app/models/user.rbを以下のように修正
※IPアドレスはVagrantfileで設定したIP

def avatar_url(size = nil)
  if avatar.present?
    # URI::join(Gitlab.config.gitlab.url, avatar.url).to_s
    URI::join("http://192.168.33.50", avatar.url).to_s
  else
    GravatarService.new.execute(email, size)
  end
end

再起動!!





ちゃんと表示されるようになりました^^

JenkinsとGitlab連携 2

GitLabのリポジトリに変更があった場合にJenkinsで自動ビルドするようにしてみる


1. まずはJenkinsに「Gitlab Hook Plugin」のプラグインをインストール






2. GitLabで監視したいプロジェクトのWeb Hook設定を行う。
「プロジェクト」>「Settings」>「Web Hooks」


3. ちゃんと設定できているかテストする
GitLabのWeb Hook設定画面で、「Test Hook」を実施する。



これでJenkinsが連携してテストしてくれるはず。。。が、
うまくいきませんでしたorz

/var/log/jenkins/jenkins.logの内容
   - repo url: git@localhost:Monkey-D-Luffy/antsample.git
   - branch: master
   - with payload:

Jun 06, 2015 3:05:11 PM org.jruby.javasupport.JavaMethod invokeDirectWithExceptionHandling
INFO: matching projects:
Jun 06, 2015 3:05:11 PM org.jruby.javasupport.JavaMethod invokeDirectWithExceptionHandling
WARNING: no project references the given repo url and commit branch

repo urlがおかしいと><;
確かにgit@localhostになっている。。
しょうがないので、cronを使って定期的にテストするように変更orz




ん〜、やっぱし難しい。。

2015年6月5日金曜日

JenkinsとGitlab連携

Vagrant上のCentOSに構築したJenkinsとGitlabを連携させてみる


1.  Gitlab上にアカウント作成

今回は「luffy」を作成


2. jenkinsが使う用のSSHの鍵を作成
[root@jenkins ~]# sudo -u jenkins -H ssh-keygen -t rsa -C jenkins@YOUR.JENKINS.URL
Generating public/private rsa key pair.
Enter file in which to save the key (/var/lib/jenkins/.ssh/id_rsa):
Created directory '/var/lib/jenkins/.ssh'.
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
Your identification has been saved in /var/lib/jenkins/.ssh/id_rsa.
Your public key has been saved in /var/lib/jenkins/.ssh/id_rsa.pub.
(snip)
[root@jenkins ~]# cd /var/lib/jenkins/.ssh/
[root@jenkins .ssh]# ll
total 8
-rw------- 1 jenkins jenkins 1675 May  9 01:08 id_rsa
-rw-r--r-- 1 jenkins jenkins  412 May  9 01:08 id_rsa.pub

参考URL
http://qiita.com/garbagetown/items/fe055dcfd8e0c090e610
sudo su - でrootユーザに切り替え

jenkinsのssh用にconfigファイルを作成
/var/lib/jenkins/.ssh/config
Host gitlab_server
  User          git
  Hostname      localhost
  IdentityFile  /var/lib/jenkins/.ssh/id_rsa


3. SSHでリポジトリへのPush用の公開鍵と、jenkinsがcloneするようの公開鍵を登録


4. Jenkinsでプロジェクトを作成し、ソースコード取得のgitを設定

例)
git@gitlab_server:Monkey-D-Luffy/antsample.git
※赤字には/var/lib/jenkins/.ssh/configでHostに指定した名前を設定する。

Credentialsの設定は上のURLを参考

これで無事設定が完了し、ジョブが実行されます^^




Chefでお料理 3 - GitLab + JenkinsのCookbook作成 -

「Gitlab + Jenkins環境構築のCookbookを作成」のGitlabとJenkinsのCookBook作成


・Gitlab
gitlab_url = node['gitlab']['url']
gitlab_rpm = node['gitlab']['rpm']

# openssh-server インストール
package "openssh-server" do
  action :install
end

# postfix インストール
package "postfix" do
  action :install
end

# gitlab インストール
remote_file "/tmp/#{gitlab_rpm}" do
  source "#{gitlab_url}"
end

rpm_package "gitlab_rpm_package" do
  action :install
  provider Chef::Provider::Package::Rpm
  source "/tmp/#{gitlab_rpm}"
end

# 設定ファイル修正
template "/etc/gitlab/gitlab.rb" do
  mode 0755
  source "gitlab.rb.erb"
  variables(:external_url => node['gitlab']['external_url'])
end

# 起動
script "launch_gitlab" do
  interpreter "bash"
  user "root"
  code <<-EOL
    gitlab-ctl reconfigure
    lokkit -s http -s ssh
    gitlab-ctl start
  EOL
end

※設定ファイルにはテンプレートを使用
・gitlab.rb.erb
# Change the external_url to the address your users will type in their browser
external_url '<%= @external_url %>'


・Attributes
#
# Cookbook Name:: gitlab
# Attributes:: default

default['gitlab']['url'] = 'https://downloads-packages.s3.amazonaws.com/centos-6.5/gitlab-7.0.0_omnibus-1.el6.x86_64.rpm'
default['gitlab']['rpm'] = 'gitlab-7.0.0_omnibus-1.el6.x86_64.rpm'
default['gitlab']['external_url'] = 'http://localhost'


・Jenkins
# Recipe:: default
#
# Copyright 2015, YOUR_COMPANY_NAME
#
# All rights reserved - Do Not Redistribute
#

jenkins_yum = node['jenkins']['yum']
jenkins_url = node['jenkins']['url']
jenkins_key = node['jenkins']['key']

# リポジトリの追加
script "add_repo" do
  interpreter "bash"
  user "root"
  code <<-EOL
    wget -O "#{jenkins_yum}" "#{jenkins_url}"
    rpm --import "#{jenkins_key}"
  EOL
end

# インストール
package "jenkins" do
  action :install
end

# 環境変数の設定
template "/etc/sysconfig/jenkins" do
  mode 0600
  source "jenkins.erb"
  variables(:port => node['jenkins']['port'])
end

# 起動
service "jenkins" do
    action [ :enable, :start ]
end

# iptablesの無効化
service "iptables" do
    action [ :disable, :stop]
end

・Attributes
#
# Cookbook Name:: jenkins
# Attributes:: default

default['jenkins']['port'] = 8081
default['jenkins']['yum'] = '/etc/yum.repos.d/jenkins.repo'
default['jenkins']['url'] = 'http://pkg.jenkins-ci.org/redhat/jenkins.repo'
default['jenkins']['key'] = 'http://pkg.jenkins-ci.org/redhat/jenkins-ci.org.key'