スポンサーリンク

2015年5月31日

Phoenixアプリケーションにページを追加してみる。(その2)

タイトル: Phoenixアプリケーションにページを追加してみる。(その2)

目的: Phoenixアプリケーションにページを追加する基本手順を習得する。

実施環境:
OS: Windows8.1
Erlang: Eshell V6.4
Elixir: v1.0.4
Phoenix Framework: v0.13.1
Node.js: v0.12.4

目次:

  1. 概要
  2. router.exに処理を追加する
  3. hello_controller.exにアクションを追加する
  4. 新規テンプレート(show)を作成する。
  5. 実行する

1.概要
Phoenixアプリケーションにページを追加してみる。に続く形でこの記事を記述します。
なので、まだ上記の記事内容を把握されていない方は見ておいて下さい。

1.1
なんか、ちょいちょい情報が分かったお!
とりあえず、分かったことを書いておく。

Phoenixはリロードをしてくれる。

web/templates/layout/application.html.eexを開くと<% = @inner % >の記述がある。
ここに先ほどのindex.html.eexがレンダリングされている。

1.2
今回やること。

URLの一部に"messenger"と言うラベルを付け、Hello~できるようにする。
HelloControllerを再利用して、showアクションを追加する。

2.router.exに処理を追加

2.1
以下のディレクトリを開く。
ディレクトリ: C:/作業パス/test_app/hello_phoenix/web

2.2
以下のファイルを開く。
ファイル: router.ex

2.3
scopeの部分に以下の内容を追記する。
get "/hello/:messenger", HelloController, :show

scope "/", HelloPhoenix do
  pipe_through :browser # Use the default browser stack

  get "/", PageController, :index
  get "/hello", HelloController, :index
  get "/hello/:messenger", HelloController, :show
end

例えば、
http://localhost:4000/hello/Frankと言うURLが来た場合、:messenger = Frankの値になる。

2.4
ソースコードは以下の通り作成した。

3.hello_controller.exにアクションを追加

3.1
以下のディレクトリを開く。
ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/controllers

3.2
以下のファイルを開く。
ファイル: hello_controller.ex

3.3
以下のアクションを追加する。
def show(conn, %{"messenger" => messenger}) do
  render conn, "show.html", messenger: messenger
end

ここら辺の公式ガイドにある説明をGoogle翻訳に掛けると、

「paramsを維持する必要がある。」
「だから、コントローラにshowアクションを追加する。」
「http://localhost:4000/hello/Frankが来た時、paramsのMessenger変数はFrankにバインドされる。」
「キーと値の第三引数。Messengerがキー、Messenger変数が値。キーは常に文字列。」

とかって翻訳されて、ここら辺よく分からん・・・

3.4
ソースコードは以下の通り作成した。

4.新規テンプレート(show)を作成

4.1
以下のディレクトリを開く。
ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/templates/hello

4.2
新規に以下のファイルを作成する。
作成ファイル: show.html.eex

4.3
show.html.eexを開き以下の内容を記述する。
<div class="jumbotron">
  <h2>Hello World, from <%= @messenger %>!</h2>
</div>

ここで分かったこと。
Elixir式を実行できるEEXタグ、"<%= %>"を利用している。
@messengerのようにメタプログラミングできる。

4.4
ソースコードは以下の通り作成した。


5.実行する

5.1
コマンドプロンプトを開き、以下のディレクトリへ移動する。
移動先: C:/作業パス/test_app/hello_phoenix

5.2
以下のコマンドを実行する。
コマンド: mix phoenix.server

5.3
以下のアドレスにアクセスする。(ポート番号変えた方は適宜対応する)
アドレス: http://localhost:4000/hello/Frank

私は、http://localhost:4000/hello/daruiとした。
皆さんも自分の名前でもいいと思います。

5.4
以下のように表示されれば問題ない。











以上!!

以下、参考とさせて頂いたサイト様

管理人の独り言~
何か・・・今日は・・・思考が重い・・・
昨日の深夜はテンションかなり高めだったんだけど・・・
とりあえず、今日はこれで投稿終わりにしよう・・・
続きをやる気力が出ない・・・

Phoenixアプリケーションにページを追加してみる。

タイトル: Phoenixアプリケーションにページを追加してみる。

目的: Phoenixアプリケーションにページを追加する基本手順を習得する。

実施環境:
OS: Windows8.1
Erlang: Eshell V6.4
Elixir: v1.0.4
Phoenix Framework: v0.13.1
Node.js: v0.12.4

目次:

  1. 概要
  2. ルータに処理を追加する
  3. 新規コントローラーを作成する
  4. 新規ビューを作成する
  5. 新規テンプレートを作成する。
  6. 実行する

1.概要

1.1
とりあえず、Phoenix公式ガイドにあるAdding Pagesが半分終わった。
基本的な手順のおさらいのため記事を書く。
残り半分を実施後、再び記事を書く。

英語さっぱり分からん。でもコードは読める。なら、ある程度までは何とかなる!
英語に関しては、Google翻訳使ってなんとなくニュアンスを掴んでいるだけ。
Google翻訳様様ですほんと・・・

実際の手順の前にディレクトリの説明があったが、
翻訳なんてできないので説明を割愛する。
なので、実際に行った作業のみ記述します。

そんなわけで、この記事における知識は間違っている可能性がある点留意下さい。
当然ですが、英語読める方は公式サイトを見た方が情報として確実性が高いです。

1.2
以下、私が行ったアプリケーションの作成。
C:/作業パス/test_app> mix phoenix.new hello_phoenix (選択肢はyes)

Phoenixアプリケーションの設定は特に変更はしていないため全てデフォルトである。

Phoenixのインストールとアプリケーションの作成に関して知りたい方。
以下を参考までに貼っておく。
ElixirにmixでPhoenixを混ぜ混ぜしてやる!!
Phoenixが欲しいって言うからNode.jsをインスコするよ!!

2.ルータに処理を追加する

2.1
以下のディレクトリを開く。
作業ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/

2.2
以下のファイルを開く
ファイル名: web/router.ex

2.3
router.exへ記述を追加する。

追加する内容。
get "/hello", HelloController, :index

追加する部分をソースコードより抜粋
scope "/", HelloPhoenix do
  pipe_through :browser # Use the default browser stack

  get "/", PageController, :index
  get "/hello", HelloController, :index # 追加行
end

記述した内容を見てみると、
HTTPメソッド、パス、コントローラー名、テンプレート名(?)アクション名のような構成となっているのが分かる。

2.4
ソースコード全体は以下のようになる。
(といっても一行追加しただけで大げさだが・・・)

3.新規コントローラーを作成する

3.1
以下のディレクトリを開く
作業ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/controllers

3.2
新規に以下の名前でファイルを作成する。
作成ファイル: hello_controller.ex

※名前は重要とのこと、コントローラの先頭名とビューの先頭名は同じでないといけない。

3.3
ソースコードは以下の通り作成した。

ソースコードの細かい部分は知らない。

4.新規ビューを作成する

4.1
以下のディレクトリを開く
作業ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/views

4.2
新規に以下の名前でファイルを作成する。
作成ファイル:hello_view.ex

4.3
ソースコードは以下の通り作成した。


こちらも同じくソースコードの細かい部分は知らない。

5.新規テンプレートを作成する

5.1
以下のディレクトリを開く
作業ディレクトリ: C:/作業パス/test_app/hello_phoenix/web/templates

5.2
新規に以下の名前でディレクトリを作成する。
作成ディレクトリ: hello

※名前は重要とのこと、コントローラの先頭名と同じディレクトリ名にしないといけない。

5.3
作成したディレクトリ内に以下の名前のファイルを作成する。
作成ファイル: index.html.eex

5.4
ソースコードは以下の通り作成した。


6.実行する

6.1
コマンドプロンプトを起動する。

6.2
以下のディレクトリへ移動する。
移動先ディレクトリ: C:/作業パス/test_app/hello_phoenix

6.3
以下のコマンドを実行する。
コマンド: mix phoenix.server

6.4
以下のURLへブラウザからアクセスする。
アクセスURL: http://localhost:4000/hello

実行結果は、Phoenix - Guides Adding Pagesにある実行画像と同じ内容が表示されれば問題ない。

とりあえず、以上!!

以下、参考とさせて頂いたサイト様

管理人の独り言~
祝1000PV!!皆様のおかげでPVが1000を超えました。
見て下さった方々ありがとうございます。

これからも精進します!!

Phoenixが欲しいって言うからNode.jsをインスコするよ!!

タイトル:Phoenixが欲しいって言うからNode.jsをインスコするよ!!

目的:
Node.jsがあれば、Phoenixで--no-brunchを付けずにアプリケーションを作成・実行した際、
JavaScriptとCSSが適応されるか検証。

実施環境:
OS: Windows8.1
Erlang: Eshell V6.4
Elixir: v1.0.4
Phoenix Framework: v0.13.1
Node.js: v0.12.4

目次:

  1. Node.jsのインストール
  2. 実行確認
  3. Phoenixの検証(--no-brunchオプションなし)

前提として、Phoenixが実行できる環境が作成されていること。
以下、Phoenixの環境構築の参考までに。
PhoenixのインストールやNode.jsを入れた理由について書いてあります。
ElixirにmixでPhoenixを混ぜ混ぜしてやる!!

1.Node.jsのインストール

画面証跡取るの面倒なので、文章のみでインストール内容を記述する。

1.1
以下のNode.js(本家)のサイトへ行きインストーラーをダウンロードする。

1.2
インストーラーを起動する。

1.3
ライセンスの同意を聞かれるので、同意にチェックを付け次へ。

1.4
インストールするディレクトリが聞かれる。
必要な方は任意のディレクトリを選択する。

1.5
インストールするコンポーネントを聞かれる。
デフォルトで問題ない。

1.6
インストールが流れる。
終わったらFinishで終了する。

確かこんな流れだったと思う。

1.7(重要)
Node.jsコマンドプロンプトでnode、npmのコマンドは使えた。
しかし、Windowsのコマンドプロンプトでnode、npmのコマンドは使えなかった。

おかしいと思い、環境変数を調べに行った。
Pathの項目を見てみると末尾に無駄な¥が付いてる。

いずれにせよ、Node.jsをインストールした環境変数の
末尾の¥を消せば正常に動作するようになる。

調べてみたが、どうにもWindowsのインストーラーにはバグがあるようだ。
私の使用したインストーラー: node-v0.12.4-x64.msi

2.実行確認

2.1
コマンドプロンプトを起動する。

以下、実行した内容の流れを記述する。
C:\Users\ユーザ名>node -v (Node.jsのバージョン確認)
v0.12.4

C:\Users\ユーザ名>npm -v (npmのバージョン確認)
2.10.1

C:\Users\ユーザ名>node (対話モード実行)
> 1 + 1
2
> (Ctrl+c)
(^C again to quit)
> (Ctrl+c)

終了するには二回Ctrl+cが必要のようだ。

3.Phoenixの検証

3.1
確認したいこと

  • Phoenix側でNode.jsを入れたことによる設定が必要なのか?
  • Node.jsが入っている状態で--no-brunchオプションなしアプリケーションを作成した場合の変化は?
  • Node.jsあり、--no-brunchオプションなしでJavaScriptとCSSの適応が行われるのか?

結果を先に記載する。
問題なく実行の確認ができた。

  • 設定は不要(Node.jsをインスコしていればよしなにしてくれる)
  • Yes or Noを聞かれるときyesを選択すると動作が変わる
  • 適応される

3.2
以下、実行した流れだけ記載する。

C:\インストールパス\test_app>mix phoenix.new hello_phoenix_node (新しくアプリケーション作成)
(途中、Yes or Noを聞かれるがYesを選択する)

C:\インストールパス\test_app>cd hello_phoenix_node (ディレクトリ移動)

C:\インストールパス\test_app\hello_phoenix_node>mix phoenix.server (サーバ起動)

アクセスURL: http://localhost:4000

ElixirにmixでPhoenixを混ぜ混ぜしてやる!!にて貼っている
--no-brunchを付けたアプリケーション実行画像と同じ画面が表示されれば問題ない。

参考までに・・・
--no-brunchオプションありなしでフォルダの差分を取ってみた。














検証終了!!以上!!

以下、参考にさせて頂いたサイト様
なし

管理人の独り言~
Phoenix公式ドキュメント(ガイド)のOverviewに書いてある通り、Node.jsがあった方が良い。

2015年5月30日

ElixirにmixでPhoenixを混ぜ混ぜしてやる!!

タイトル:ElixirにmixでPhoenixを混ぜ混ぜしてやる!!

目的:ElixirのWebFrameworkであるPhoenixをmixを使ってインストールする

実施環境:
OS: Windows8.1
Erlang: Eshell V6.4
Elixir: v1.0.4
Phoenix Framework: v0.13.1

目次:

  1. Phoenixのインストール
  2. 実行確認

Elixirの環境を構築しておくこと。

Railsのコミッターが作ったElixirのWebFrameworkとのこと。
Railsライクにできるらしい。
(私自身がRails触ったことないので分からないが・・・)

1.Phoenixのインストール

1.1
コマンドプロンプトを起動し、以下のコマンドを実行する。
コマンド: mix local.hex

以下のような文言が流れると思う。

Are you sure you want to install archive https://s3.amazonaws.com/s3.hex.pm/installs/1.0.0/hex.ez? [Yn] y

yを選択し以下の文言が表示されればインストール完了。
* creating .mix/archives/hex.ez

このhexと言うものなのだが調べてみたところ、
パッケージ管理ツールとのこと。
mixもそのようなものであることを考えると、
RubyGemsのbundlerのようなものだろうか?

いずれにせよ、Hexインストール済みの方はこの作業は不要だと思う。
毎回入れるわけないだろうし・・・

すいません、何分英語が不慣れなため曖昧な形になってしまいます。
続き行きます。

追記(2015/06/04-15:03)
"mix new プロジェクト名"にて作成後、
必要なライブラリを取り込むとき、初回はhexが入ってないようです。
参考までに・・・

ただ、mix local.hexを再度実行すると既に存在していると出力されます。
この違いについてはまだ分かってません。

何れにせよ、初回ならばあまり意識しなくても大丈夫かと思います。

追記2(2015/06/04-15:03)
>>ただ、mix local.hexを再度実行すると既に存在していると出力されます。
>>この違いについてはまだ分かってません。
ローカルと各プロジェクトで混在できることが書かれていました。

1.2
以下のコマンドを実行する。
コマンド:
mix archive.install https://github.com/phoenixframework/phoenix/releases/download/v0.13.1/phoenix_new-0.13.1.ez

以下のような文言が流れると思う。
Are you sure you want to install archive https://github.com/phoenixframework/phoenix/releases/download/v0.13.1/phoenix_new-0.13.1.ez? [Yn] y

yを選択し以下の文言が表示されればインストール完了。
* creating .mix/archives/phoenix_new-0.13.1.ez

これでインストールは完了。

2.実行確認

2.1
テストアプリを実行するための作業ディレクトリを作成する。
私のディレクトリ: C:\MyWorkSpaces\elixir_space\test_app

test_appと言う作業用ディレクトリを作成した。

2.2
以下のコマンドを実行し、作業ディレクトリへ移動する。
コマンド: cd C:\MyWorkSpaces\elixir_space\test_app(各自で作業ディレクトリは変更する)

2.3
以下のコマンドを実行する。
コマンド: mix phoenix.new hello_phoenix

コマンド: mix phoenix.new --no-brunch hello_phoenix

hello_phoenixの部分に絶対パスで指定することもできる。
今回は相対パスで指定した。(作業ディレクトリにいるからね)

yes or noを聞かれたらyesを選択する。

※ --no-brunchを付ける理由

Phoenixのデフォルトでは,
JavaScriptやCSSなどのコンパイルにbrunch.ioを使用するとのこと。
Brunch.ioは、依存関係をインストールするためにnpm(node package manager)を使用する。
また、npmはNode.jsを必要とするとのこと。

私が、この記事を書いている時点では、node.jsはインストールしていない。
なので、JavaScriptやCSSを適応させるために、--no-brunchオプションを付けている。

実際、--no-brunchオプションなしで実行してWeb画面の表示まで行ったが、
見事にjavascript、cssが適応されていなかった。

私は、Node.jsを使ったことも入れたこともないのでよく分からない。
インストール(?)するだけで、phoenix側が認識してくれるのか、設定が必要なのか今後調査する。

2.4
作業ディレクトリ内にhello_phoenixと言うディレクトリができている。
コマンドプロンプトの画面証跡取ろうと思ったんですけど、
ログ消えてしまいました・・・|ω・`) ショボーーン

以下のコマンドで移動する。
コマンド: cd hello_phoenix

2.5
lsコマンドで内容を確認すると幾つかのファイルができている。
以下のコマンドを実行してサーバを起動する。

コマンド: mix phoenix.server

また、こちらでも起動できる。
コマンド:iex -S mix phoenix.server

対話モードも立ち上がると言うことは・・・どういうことだってばよ?
すいません、ここら辺はまだ分かりません。

コンパイルが長々と流れるが、起動するまで放置する。

2.6
以下のアドレスへアクセスする。

URL: http://localhost:4000/

デフォルトではポート番号4000を使っているようです。

以下のような画面が出てくるはず・・・

私の環境で--no-brunchを付けずに作成し実行した画面。
本家ドキュメントと表示が違う・・・CSSとJavaScriptが動いてない感じがします。














私の環境で--no-brunchを付けて作成し実行した画面。


















2.7
終了するには、どちらのコマンドを使用していても「Ctrl+c」で終了できる。
バッチを終了するか聞かれるので、yで終了。

おまけ
こっちで「iex -S mix phoenix.server」実行した時、対話モード見ていたら以下のような文言が流れていた。

iex(1)> [info] GET /
iex(1)> [info] Processing by HelloPhoenix.PageController.index/2
  Parameters: %{"format" => "html"}
  Pipelines: [:browser]
iex(1)> [info] Sent 200 in 64ms
iex(1)> [info] GET /css/app.css
iex(1)> [info] GET /js/app.js
iex(1)>

と言うことは、逐一Webの情報を出力しているということですね。
デバッグする時とか使えそうですね。

追記(2015/05/31-24:28)
Node.jsを入れて、検証した記事を上げました!!
Phoenixが欲しいって言うからNode.jsをインスコするよ!!

Chocolateyを使ってインストールしたい方は、
Qiitaに記事を上げて下さっている方がいらっしゃいます。
Qiita - Windows 8.1にElixirを導入するメモ

以上!!

以下、参考にさせて頂いたサイト様

管理人の独り言~
本家ドキュメントとにらめっこしながらようやっと起動させられた。
基本的な使い方もやらないと、それにElixirで誰かが作っているMongoDBドライバも使いたい。
いずれにせよ、しばらくPhoenixのドキュメント通りにやろうかな。
しかし、node.js入れないと・・・また調べること増えたwww

Elixirが熱い!?知らないけどとりあえずインストールする

とある錬金術師の万能薬(Elixir)

Goal

Elixirをインストールし、実行環境を整える。

Dev-Environment

OS: Windows8.1
Erlang: Eshell V6.4, OTP-Version 17.5
Elixir: v1.0.4

Wait a minute

Elixirの環境構築を行います。
Dev-Environmentで書いてますが、Windows対象です。

Index

|> Overview
|> Installation Erlang
|> Installation Elixir
|> Run in interactive mode

Overview

友人のプログラマからElixirと言う言語を聞いた。
正直、Elixirって何?って顔で聞いてましたけど・・・
簡単に聞いたところ
  • 関数型言語
  • Rubyライクに記述できる
  • 耐障害性が高い
  • マルチプロセス
  • ErlangVM上で動く(よく例に挙げられるのがJavaVM上でJavaが動いてるようなもの)
などなど・・・
もっと知りたい方は、Qiitaの記事にElixirのトップページを翻訳された方が記事を上げています。
そちらを見てみると分かりやすいと思います。
Qiita - Elixir の特徴
何はともあれ、とりあえず使ってみるためインストールを行う。
まず、使うためにはErlangVMが必要なので、
Erlangを入れ、Elixirを入れ、バージョン確認と対話モードによって実行確認を行う。

Installation Erlang

Erlangをインストールする。
以下のErlang公式サイトよりダウンロードする。
ダウンロード: erlang.org - download
私がダウンロードしたのは、以下のインストーラーです。
ダウンロードファイル: OTP 17.5 Windows 64-bit Binary File
インストーラを起動して、
ポチポチして行くだけなので特に難しいことはない。
どうしてもインストールが分からない方へ。
以下のリンク先を参考にすると分かりやすい。
参考: プログラマーズ雑記帳 - Erlang のインストール(Windows)と Emacs モードの設定
Description:
私と同じインストーラで入れているなら、
環境変数はインストーラが自動で設定するので作業の必要はない。
バージョンの確認と対話モードを起動する。
> erl
Eshell V6.4  (abort with ^G)
1>
Erlangのインストールは完了。

Installation Elixir

本題のElixirをインストールする。
以下のElixir公式サイトよりダウンロードする。
ダウンロード: elixir-lang.org - Installing Elixir
私がダウンロードしたWebインストーラーは以下。
ダウンロードファイル: elixir-websetup.exe
パッケージから入れることもできるようです。
インストーラを起動しインストールする。
こちらもポチポチして行くだけなので、説明を割愛する。
Description:
WebInstallerを使っているのであれば、環境変数は自動で設定してくれる。
バージョンを確認する。
コマンドプロンプトから以下のように実行する。
(私のインストールしたバージョン: Elixir 1.0.4)
対話モード
>iex -v
Elixir 1.0.4
コンパイル(拡張子: .ex)
>elixirc -v
Elixir 1.0.4
スクリプト実行(拡張子: .exs)
>elixir -v
Elixir 1.0.4
ビルドツール
>mix -v
Elixir 1.0.4
Elixirのインストールは完了。

Run in interactive mode

対話モードを試してみる。
>iex
Interactive Elixir (1.0.4) - press Ctrl+C to exit (type h() ENTER for help)
iex(1)> 1 + 1
2
iex(2)> IO.puts "Hello Elixir!!"
Hello Elixir!!
:ok
iex(3)> (Ctrl+c)バッチ ジョブを終了しますか (Y/N)? y

Speaking to oneself

最近、Elixirが熱くなって来ましたね。
インストール記事の書き直しをしました。
少しでも見やすくなっていれば良いのですが・・・

Bibliography

2015年5月29日

Dockerのイメージが分からない!!

タイトル:Dockerのイメージが分からない!!

目的:DockerにRubyが実行できるイメージを取り込み、コンテナとして起動する。

実施環境:
OS:Windows8.1
Boot2Docker:v1.6.2

目次:

  1. 概要
  2. イメージを探す
  3. イメージを取り込む
  4. コンテナを実行する
  5. コンテナの停止
  6. コンテナを消す
  7. コンテナのアタッチ・デタッチ

1.概要

1.1
Boot2DockerのおかげでDockerの環境をWindowsにインストールでき、
実行するまでこぎ着けたのは良しとしよう。

しかし、Dockerはイメージからコンテナを実行し、
環境の切り替えが素早くできるのが利点だったはず。

なのに、イメージの探し方から取り込み方一式含めて基本的なやり方さえ分からない。
ならば、やるしかあるまい・・・

Rubyが実行できるイメージを探し、Dockerで実行する。

1.2
コマンドプロンプトを起動する。

※以前の記事にも書いたが環境変数は忘れずに・・・

2.イメージを探す

2.1
以下のコマンドを実行する。
コマンド:docker search ruby

docker:dockerコマンド
search:検索するためのdockerコマンドオプション
ruby:検索キーワード

検索結果の一覧が表示される。

今回は、以下のイメージを利用させて頂く。

3.イメージを取り込む

3.1
以下のコマンドを実行する。
コマンド:docker pull ruby:latest

cocker:dockerコマンド
pull:イメージを取得するためのdockerコマンドオプション
ruby:対象とするイメージ名
latest:最新版の指定

4.コンテナを実行する

4.1
以下のコマンドを実行する。
コマンド:docker run -t -i ruby:latest /bin/bash

docker:ry
run:実行するためのdockerコマンドオプション
-t -i:対話モードで実行するためのオプション
ruby:latest:実行対象のイメージ名(コンテナ)
/bin/bash:多分、使用するのが何のコマンドか指定しているだけ

5.コンテナの停止

5.1
以下のコマンドを実行し、停止中のコンテナIDを確認する。
コマンド:docker ps -as

5.2
以下のコマンドを実行する。
コマンド:docker stop 停止したいコンテナID

6.コンテナを消す

6.1
以下のコマンドを実行し、停止中のコンテナIDを確認する。
コマンド:docker ps -as

6.2
以下のコマンドを実行する。
コマンド:docker rm 停止したいコンテナID

使ったコンテナはrun時に自動削除の--rmオプションを付けて起動しないと残る。
使わなくなったコンテナは無駄な領域圧迫につながる。

使わないコンテナは削除してしまいましょう。
(イメージでも同じこと)

※動作中のコンテナは停止させないと消せない!

7.コンテナのアタッチ・デタッチ

7.1
以下のコマンドを実行する。
コマンド:docker ps -as

7.2
アタッチは以下のコマンドを実行する。
コマンド:docker attach アタッチしたいコンテナID

7.3
exitを実行すると停止して終了してしまうので、
以下の方法でデタッチする。

コンテナからデタッチするには、「Ctrl+p」→「Ctrl+q」で実行する。

また、最初からバックグラウンドで実行したい場合。
run時に-dオプションを付けて実行するとバックグランド実行になる。

以上!!

以下、参考にさせて頂いたサイト様

管理人の独り言
一日使ってようやくDockerにRubyのコンテナを用意することができた。
でも・・・ちょっと待って、ちょっと待って、お兄さん!!

Rubyのソースコードが存在しているWindowsからファイルを移すもしくは、
実行するためにはどうしたらいいんだろうか?

他にもMongoDBのDockerでの使い方とか色々あるし・・・
まだ、Dockerは終わらない・・・

いい加減にプログラムに戻らせてほしい。

あなたはWindows環境で実行しますか?それともLinux環境で実行しますか?

タイトル:あなたはWindows環境で実行しますか?それともLinux環境で実行しますか?

目的:Boot2Dockerを入れてLinuxの実行環境を手に入れたい(がうがう)。

実施環境:
OS:Windows8.1
Boot2Docker:v1.6.2

目次:

  1. Boot2Dockerことはじめ
  2. アップグレード

あらかじめ、Boot2Dockerはインストールしておいて下さい。
Boot2Dockerは以下のサイトにある。

インストールはポチポチしていくだけなので特に難しいことはないかと思います。
自分の場合、既にGit入っていましたので、インストール時にはGitの項目だけはずしました。

1.Boot2Dockerことはじめ

1.1
よし、インストールが終わったな!
じゃあ、起動しよう。(スタートメニューもしくはデスクトップのアイコンを起動)

「この種類のファイル(.sh)を開くにはどのアプリを使いますか?」

くじらさんが出てこない!?
えっ?ここらへんよしなにしてくれるために起動用のものがあるんじゃないの?
っと思ったが仕方がないから、一覧からコマンドプロンプトがないか探した。

ねぇよ!!
やりたいのはプログラムなのになんでこんなにも前段階で躓きまくってんだよ!

仕方がないからコマンドプロンプトを開き、
Boot2Dockerのインストールフォルダに移動する。
(まじで、クマリア様助けて下さい・・・まじで・・・)

1.2
そして、以下のコマンドを実行した。
コマンド:boot2docker.exe init

(いきなり、startで実行しようとしたけど、initせーやってな感じなこと言われたので)

1.3
次に、以下のコマンドを実行した。
コマンド:boot2docker.exe start

1.4
おぉ!VirtualBox見るとboot2dockerが起動してる。

でも待って、コンソールでもGUIでもいいんだけど、操作画面がなくね?
それに、くじらさん出てきてなくね?(これ重要)

とりあえず、一旦落とす。
コマンド:boot2docker stop

1.5
VirtualBoxからboot2dockerを起動してみる。
今度こそキタ━━━(;´Д`);´Д`);´Д`);´Д`);´Д`)━━━━!!!

くじらさんこんにちは!

2.アップグレード方法

公式ドキュメントに書いてあるけど、あえて書く。

2.1

  1. Boot2Dockerの最新版を落としてね
  2. Boot2Docker管理ツールを更新するインストーラを実行してね
  3. 既存の仮想マシンをアップグレードするには、ターミナルを開いて以下のコマンドを実行してね
  • boot2docker stop
  • boot2docker download
  • boot2docker start

このブログ見るより公式見た方が確実だけどな。

管理人は英語アレルギーなのでw
英語を見ると鳥肌が立ちますゆえw
(英語苦手だし・・・)

あなたはWindows環境をあきらめますか?
それともLinux環境をあきらめますか?

私は、Linux環境をあきらめない!!

Linux環境(百合)承認!!

以上!こうして私のLinux環境(Boot2Docker)は承認された!!

ってか、まだイメージを読み込んだりやることいっぱいあるんですけどね!!!!
ここにいっぱいあるみたいですよ。
https://registry.hub.docker.com/

とりあえず必要な環境は、
Ruby(各種gem)、MongoDBくらいかな。

しかし、思うんだが、Boot2Dockerはコマンドプロンプトからよしなに使えるものじゃないのか?
やり方が間違ってる気がする。

以下、参考にさせて頂いたサイト様

追記(同日)
コマンドプロンプトからdockerコマンドやboot2dockerできた。
だが、dockerコマンド使うとエラーが出るので直す。

例えば、「docker search ruby」と打つと以下のようなエラーが出てくる。

エラー内容:
FATA[0000] Post http:///var/run/docker.sock/v1.18/containers/create: dial unix /
var/run/docker.sock: An address incompatible with the requested protocol was use
d.. Are you trying to connect to a TLS-enabled daemon without TLS?

もしくは、「docker version」と打つと以下のようなエラーが出てくる。
エラー内容
FATA[0000] Get http:///var/run/docker.sock/v1.18/version: dial unix /var/run/doc
ker.sock: An address incompatible with the requested protocol was used.. Are you
 trying to connect to a TLS-enabled daemon without TLS?

環境変数が設定されてないためと思われる。
実際に起動時などに以下のような文言が表示されているはず。

文言:
To connect the Docker client to the Docker daemon, please set:
If you are running inside Windows Command Prompt (cmd.exe), copy and paste the
following commands to your terminal to set the environment variables:
    set DOCKER_HOST=tcp://IPアドレス:Port番号
    set DOCKER_CERT_PATH=C:\Users\ユーザ名\.boot2docker\certs\boot2docker-vm
    set DOCKER_TLS_VERIFY=1

※PowerShellの方も出てくるが片方を実施すればよい。

なので、環境変数を設定する。
set~のコマンドをコピペして叩くだけ。

その後、「docker version」などとコマンドを実行して上記エラーが出なければ問題ない。

システムの環境変数で設定してもいいですが、
私の場合、固定回線じゃないことがあるので、
setコマンドを流すバッチファイルでも作成しようかと思います。

というわけで、実際にイメージを使うのは後の記事で・・・

以上!!承認されてなかったので追記まで・・・

追記2(同日)
コマンドプロンプトより実行。
コマンド:boot2docker ssh

上記コマンドを実行すれば、コマンドプロンプトから、
ゲストOSに触れます。(やったね!くじらさんが見れるよ!)

参考にさせて頂いたサイト様
http://ctheu.com/2015/05/17/docker-sous-windows-8-1/

管理人の独り言
そもそも何でこんな状況になっているのかと言うと、
RubyGemsのtweetstreamがWindowsだと動かない!!
何故?どうして?Why???Windows People!?何故動かない!!

エラー内容:

terminate called after throwing an instance of 'std::runtime_error'
  what():  Encryption not available on this event-machine

This application has requested the Runtime to terminate it in an unusual way.
Please contact the application's support team for more information.

何か調べてみると、「event-machine」がssl付きでインストールされてないことが問題らしい?
ので、オプションつけてのインストールとかググってみたけど分からなかった。
(そも、Windowsで動かないんじゃないかと思う・・・)

仕方がないから、
Linux環境を用意しようと思ったのが今回の記事の始まり。
Boot2Docker入れても当初、動かし方分からなかったんだよね・・・

2015年5月27日

[Sinatra+MongoDB]Sinatraの掲示板にMongoDBを使ってみた。

タイトル:[Sinatra+MongoDB]Sinatraの掲示板にMongoDBを使ってみた。

目的:Sinatraで作成した掲示板を改良する。書き込みデータの管理にMongoDBを使用する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
Sinatra:v1.4.6
Haml:v4.0.6
mongo(gems):v2.0.4
MongoDB:mongodb-win32-x86_64-2008plus-ssl-3.0.3-signed


ディレクトリ構造:
作業ディレクトリ
|-sinatra_start.rb(rubyファイル)
|
|-views(ディレクトリ)
|   |-index.haml(hamlファイル)
|
|-db
    |-MongoDBによって作成されるファイル複数

目次:

  1. 概要
  2. Ruby(Sinatra)のソースコード修正
  3. Hamlのソースコード修正
  4. 説明
  5. 実行

掲示板のプログラムや説明に関しては、
以前記事を書いているので、そちらを参考にして頂ければ分かりやすいと思います。
また、ソースコードも以前の記事にあるものを修正したものになります。
Sinatraで掲示板を作ってみた!!

また、MongoDBの起動方法等については、
以下の記事を参考にして頂ければ分かりやすいと思います。
MongoDBを使ってみる。

1.概要

1.1
以前、Sinatraで作成した掲示板。
書き込みデータの管理はCSVで行っていた。
その部分をMongoDBに書き換える。

以下の点に注意
  • DBのソースコード部分はべた書きである
  • Modelクラスの作成はない
  • Validationによる入力データの検証は行っていない

2.Ruby(Sinatra)のソースコード修正

2.1
Ruby(Sinatra)側のソースコードは以下の通り修正した。

3.Hamlのソースコード修正

3.1
Haml側のソースコードは以下の通り修正した。

4.説明

4.1
「get '/' do」のデータ取得の修正部分。

CSV.read("db/sinatra_bbs.csv")
の部分を

db[:comments].find
に変更している。
(DBの接続部分もあるが、これだけ)

4.2
「put '/write_comment' do」のコメント書き込みの修正部分。

CSV.open("db/sinatra_bbs.csv", "a") do |csv|
csv << [params[:name], params[:title], params[:message]]
end
の部分を

db[:comments].insert_one({
:name => params[:name],
:title => params[:title],
:comment => params[:message]
})
に変更している。
(DBの接続部分もあるが、これだけ)

5.実行

5.1
以下のコマンドを実行する。
コマンド:ruby sinatra_start.rb

5.2
以下のURLにアクセスする。
(なお、ポートを変更している方は変更したポート番号を指定する)
URL: http://localhost:4567

実行による表示は以前の記事(Sinatraで掲示板を作ってみた!!の実行画像)から変わらない。
プログラム内部でのデータの取得と挿入がDBに変わっているだけである。
(微妙にボーダー入ってるかもですけど、気にしないこと・・・)

以上!!

以下、参考にさせて頂いたサイト様
なし

管理人の独り言
本日、2度目の投稿。
丁度、MongoDBのBSONドキュメントのアクセスまでやったから、ついでに掲示板の方も修正~

そういえば、React.jsが熱いらしいと聞いた。
ただ、小規模ならAngular.js、Vue.jsで十分とも聞くし、どうしたものか・・・
いずれにせよ、使うかどうかともかく情報としては押さえておこうかと思います。
じゃないと自分が使うのに何が良いか検証もできないですし・・・

しっかし、やはりソースコードがインデントで見辛いな、どうにかならないかな・・・

MongoDBのドキュメントの要素を取得する。

謝意
申し訳ありません。
前回投稿した記事(MongoDBで取得したドキュメントをHashに変換して利用する。)なのですが、
管理人の知識・経験不足により間違えた内容を投稿しておりました。

修正箇所なのですが、
ドキュメントをto_hashメソッドでハッシュに変換していることがそもそもの間違いでした。
ドキュメントは、そのままハッシュのようにアクセスできます。
修正したソースコードをこちらの記事に掲載します。

前回の記事についてはこういうこともできるけど、
無駄なことをしているなと思って見て下さい。

今後とも読者様は宜しくお願い致します。

タイトル:MongoDBのドキュメントの要素を取得する。
「MongoDBで取得したドキュメントをHashに変換して利用する。」の修正版。

目的:MongoDBから取得したドキュメントの要素をコンソール表示する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
mongo(gems):v2.0.4
MongoDB:mongodb-win32-x86_64-2008plus-ssl-3.0.3-signed

ディレクトリ構造:
作業ディレクトリ
|-mongo_main.rb(rubyファイル)
|
|-db(ディレクトリ)
    |-MongoDBの作成するファイルができる

目次:
  1. Rubyプログラムの作成
  2. 説明&実行

MongoDBの起動やmongo(gems)のインストールは以前記事を書いているので、
そちらを参考にして頂ければ分かりやすいと思います。
また、ソースコードも以前の記事にあるものに追記したものになります。

1.Rubyプログラムの作成

1.1
Rubyのソースコードは以下の通り作成した。


2.説明&実行

2.1
BSONドキュメントを取得しているdocにフィールド名でアクセスし、値を取得している。
(ソースコード参照)

記事上部にも記載したが、
docを配列に格納する際にto_hashメソッドを使わないで、BSONドキュメントのまま格納している。

2.2
以下のコマンドを実行する。
コマンド:ruby mongo_main.rb

以上!!

以下、参考にさせて頂いたサイト様。
なし。

管理人の独り言
昨日、「友人のプログラマからブログ見たけど、hashにする必要なくね?」っと言われ、
BSONドキュメントがハッシュの配列のように見えたため、
docに対してハッシュのようにアクセスしてみた。

結果そのまま値を取り出すことができてしまった。
おそらく、BSONやRubyのハッシュに対しての知識・経験が不足していたことが原因かと・・・

あぁ~やらかした。
最後にもう一度、謝罪しておきます。

間違った知識を記事にしてしまい申し訳ないです。


2015年5月26日

MongoDBで取得したドキュメントをHashに変換して利用する。

修正版:MongoDBのドキュメントの要素を取得する。
タイトル:MongoDBで取得したドキュメントをHashに変換して利用する。

目的:MongoDBから取得したデータ(ドキュメント)を、RubyのHashに変換してValueをコンソール表示する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
mongo(gems):v2.0.4
bson(gems):v3.0.3
MongoDB:mongodb-win32-x86_64-2008plus-ssl-3.0.3-signed

ディレクトリ構造:
作業ディレクトリ
|-mongo_main.rb(rubyファイル)
|
|-db(ディレクトリ)
    |-MongoDBの作成するファイルができる

目次:
  1. Rubyプログラムの作成
  2. 説明&実行

MongoDBの起動やmongo(gems)のインストールは以前記事を書いているので、
そちらを参考にして頂ければ分かりやすいと思います。
また、ソースコードも以前の記事にあるものに追記したものになります。

1.Rubyプログラムの作成

1.1
ソースコードは以下の通り作成した。

2.説明&実行

2.1
取得したドキュメントをto_hashメソッドでハッシュにしただけです。
取得するデータが複数の時を考えて配列に格納しています。

※MongoDBから取得したデータはBSONドキュメントが戻り値になっている。

2.2
以下のコマンドを実行する。
コマンド:ruby mongo_main.rb

ドキュメント取得の表示の後に以下のような表示が出れば問題ない。
name = darui
title = blogger
comment = darui

以上!!

以下、参考にさせて頂いたサイト様。
なし。

管理人の独り言
BSONドキュメントでデータが返ってくるのに、
bsonのgemを使わないでto_hashメソッドで変換するのはいいんだろうか?
(正しいやり方が分からない・・・)

それに、このまま掲示板のプログラムに組み込むと、
view側でhashを回してシンボル指定になるのだが、セキュリティ的にいいんだろうか?

ぐぉ~誰か教えろ下さい・・・orz

まぁ、修正が必要なら追々やるとしましょう。
とりあえずは、動くことが大事ですね。

それにしてもRuby力が低くてきつい・・・

2015年5月25日

MongoDBを使ってみる。

タイトル:MongoDBを使ってみる。

目的:MongoDBを使い、RubyプログラムからCRUD操作を行ってみる。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
mongo(gems):v2.0.4
bson(gems):v3.0.3
MongoDB:mongodb-win32-x86_64-2008plus-ssl-3.0.3-signed

ディレクトリ構造:
作業ディレクトリ
|-mongo_main.rb(rubyファイル)
|
|-db(ディレクトリ)
    |-MongoDBの作成するファイルができる

目次:
  1. MongoDBの起動
  2. RubyGems(mongo)のインストール
  3. Rubyプログラムの作成
  4. 実行

MongoDBはあらかじめインストールし環境変数も設定しておいて下さい。
以下に参考なるサイトのリンクを貼っておきます。
(インストーラーを使用するのならポチポチしていくだけなので楽です。環境変数通らんけど・・・)
Qiita - MongoDBのインストール
Webエンジニアブログ - MongoDBをWindowsにインストール

1.MongoDBの起動

1.1
コマンドプロンプトを起動し、以下のコマンドを実行する。
コマンド:mongod --dbpath ファイルパス\作業ディレクトリ\db

※ログも指定できるがこの記事ではやらない。

1.2(実施しなくても問題ありません。)
蛇足ですが、
コマンドプロンプトからMongoDBを操作したいのであれば、
1.1で起動しているコマンドプロンプトとは別にコマンドプロンプトをもう一つ起動し、
以下のコマンドを実行する。

コマンド:mongo

これで、操作用のコマンドプロンプトが用意できる。

また、簡単な操作方法を以下に記述する。

使用中のDBを確認したい場合。
コマンド:db

DBの作成もしくは作成済みのDBへ接続する場合。
コマンド:use DB名

コレクションを作成したい場合。
コマンド:db.createCollection("生成するコレクション名")

コレクションにドキュメントを挿入したい場合。
コマンド:db.コレクション名.insert({ name: "hoge", title: "hoge", comment: "hogehoge" })

上記コマンドはあくまで例です。
柔軟なコレクションのドキュメントが生成できるのが特徴ですので、
途中からコレクションのドキュメント項目を増やすこともできます。
(データが肥大化するのでおすすめできませんが・・・)

コレクションの検索をしたい場合。(全件検索)
コマンド:db.コレクション名.find()

2.RubyGems(mongo)のインストール

2.1
Rubyのコマンドプロンプトを起動し、以下のコマンドを実行する。
コマンド:gem install mongo

bson_ext(gems)も入れた方がいいのだが、今回はインストールしない。
bson_extのgemsは高速化のために入れると良いらしい。

(2015/05/25時点の話です)
おそらくエラーが出ると思うので回避方法のリンク貼っておきます。(英語ですが・・・)
私の場合は、devkitにヘッダファイルとフォルダを作成する形で回避しました。
http://stackoverflow.com/questions/26092541/windows-rails-error-installing-bson-ext

2.2
gemの一覧にインストールしたか確認する。
コマンド:gem list

3.Rubyプログラムの作成

3.1
ソースコードは以下の通り作成した。


4.実行

4.1
以下のコマンドを実行する。
コマンド:ruby mongo_main.rb

一連のMongoDBのコマンドと実行結果。
また、Rubyの出力が出てくると思います。
(長くてちょっと貼り付けると見辛くなってしまう・・・)

一部の内容を抜粋して貼ります。
ドキュメントを作成して取得した内容の表示
{"_id"=><BSON::ObjectId:0x2237260 data=5562d2a754616b11a0000000>, "name"=>"darui", "title"=>"blogger", "comment"=>"darui"}

ドキュメントを更新して取得した内容の表示
{"_id"=><BSON::ObjectId:0x20894580 data=5562d2a754616b11a0000000>, "name"=>"darui", "title"=>"blogger", "comment"=>"darui@apprentice"}

削除後はドキュメントがないはずです。

以上!!

以下、参考にさせて頂いたサイト様方
本家のドライバチュートリアル - Ruby Driver Tutorial (2.0.0)

管理人の独り言
掲示板に使う予定なので、せっかくだからNoSQLを使ってみる。
本家のドキュメントがかなり親切設計で読みやすい英語だったので、
管理人の英語アレルギーが少ししか発症しませんでした。

大体ドキュメントを見ればどうにかなるかと思います。
また、「MongoDBの薄い本」を見れば、日本語で基礎を習得できると思います。
下記に「MongoDBの薄い本」のリンクを貼っておきます。(ちなみにPDFです)
http://www.cuspy.org/diary/2012-04-17/the-little-mongodb-book-ja.pdf

2系のドライバ(Gem)を使って日本語で書かれてる記事の少ないこと、少ないこと・・・
エラー祭りでした・・・一行ずつ直していったのは久々ですwww
たまには悪くない!

2015年5月22日

Rubyにおける日時のクラスを使ってみる

タイトル:Rubyにおける日時のクラスを使ってみる

目的:
RubyのTime、Date、DateTimeクラスを使ってみる。
また、文字列とタイムスタンプの変換も同時に使ってみる。

実施環境:
OS:Windows8.1
Ruby:v2.2.2

目次:

  1. Timeクラスを使ってみる
  2. Dateクラスを使ってみる
  3. DateTimeクラスを使ってみる
  4. 文字列、タイムスタンプを変換してみる
  5. その他

1.Timeクラスを使ってみる

1.1
ソースコードは以下の通り作成した。

1.2
軽い説明をする。

「Time.now」で現在の日時が取得できる。

「strftimeメソッド」でフォーマットを指定して出力ができる。

一部のメソッドを利用するわけじゃなければ、
「require 'time'」は必要ない。

2.Dateクラスを使ってみる

2.1
ソースコードは以下の通り作成した。

2.2
軽い説明をする。

使用するには「require 'date'」が必要。

「Date.today」で現在の日付を取得できる。

「strftimeメソッド」でフォーマットを指定して出力ができる。
但し、時刻に関しては、情報を保持していないので、
0で表示される(一部、%Iは12で表示されているが・・・)

3.DateTimeクラスを使ってみる

3.1
ソースコードは以下の通り作成した。

3.2
軽く説明をする。

DateTimeクラスはDateのサブクラスである。
使用するには同じく「require 'date'」が必要。

「DateTime.now」で現在の日時が取得できる。

「strftimeメソッド」でフォーマットを指定して出力ができる。
Dateと違い時刻の情報も保持しているため、時刻の出力もできる。

4.文字列、タイムスタンプを変換してみる

4.1
ソースコードは以下の通り作成した。

4.2
軽く説明をする。

時刻を文字列へ変換する場合、
「to_sメソッド」を利用する。

文字列を時刻へ変換する場合、
「Time.parseメソッド」を利用する。
(「require 'time'」が必要)

時刻をタイムスタンプへ変換する場合、
「to_iメソッド」を利用する。

タイムスタンプを時刻へ変換する場合、
「Time.atメソッド」を利用する。
(「require 'time'」が必要)

5.その他

5.1
フォーマットの指定の仕方は、
Time、Date、DateTimeクラスで共通のようです。

ある程度、使用頻度がありそうなフォーマットの指定の仕方は
ソースコードを参考にして頂ければ分かりやすいかと思います。

5.2
newする時が、どんな時か少し考察してみた。
Time, Date, DateTimeをnewする時は、
(そのままなのだが)指定時刻でオブジェクトを作成したい時だろう。

強いて上げるなら、DB等にユーザー側から値を指定して検索をする時とかだろうか?
後は、日時の差分で比較したい時とかだろうか?

5.3
これだけ、日時を扱うクラスがあるならば使い分けに関してどうするべきか?
以下の記事を参考にさせて頂きました。

分かりやすい・・・こういう記事書けるようになりたいですね。

以上!!

以下、参考にさせて頂いたサイト

管理人の独り言
ウィッチャー3面白い・・・
でも、プログラム程長期間に渡って遊べるわけじゃないな。
やはり趣味グラムは非常に良いおもちゃだ。

ちょっと思ったのだが、Bloggerでブログをやる時、
更新通知をTwitterに流したいのだが、現在手動でやっている。

それはちょっと・・・っと思ったので自動化する方法を調べたのだが、
何かに登録しなきゃいけないようだ。

面倒くさいので、その内BloggerのWebAPI(あるのかな?)かRSSあたりから情報を取得して、
Twitterに更新通知を出すプログラムでも作ろうかな?っと思った次第であります。
誰かやってる気がするんだけどな・・・

そっちの方が面倒くさそう?
知らんがな、そっちの方が面白そうだし!(笑)

2015年5月20日

Sinatraで掲示板を作ってみた!!

タイトル:Sinatraで掲示板を作ってみた!!

目的:Sinatraを使って掲示板を作成してみる。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
Sinatra:v1.4.6
Haml:v4.0.6

ディレクトリ構造:
作業ディレクトリ
|-sinatra_start.rb(rubyファイル)
|
|-views(ディレクトリ)
|   |-index.haml(hamlファイル)
|
|-db
    |-comment_db(csvファイル)

目次:

  1. 概要
  2. Ruby(Sinatra)のソースコード作成
  3. Hamlのソースコード作成
  4. 説明
  5. 実行(画像有)


今まで、入力フォームだのCSVだのと色々やってきたものをまとめたものになる。
ソースコード自体はそんなに量はないが、ようやっと形のあるものを作成できた。
今後、このプログラムを基礎に色々追加していく予定。
拙い内容ですが、読んで頂ける人に感謝をします。
それでは、内容に移っていきます。

1.概要

1.1
簡易的な掲示板のプログラム。

view側の画面自体は簡単で、入力用のフォームと過去データの表示部分があるのみ。
Rubyのプログラム自体も、データの読み書きとSinatraを利用したルーティングが記述してあるだけである。

また、データの管理についてだが”今回は”DBは使用をしない。
簡単なCSVで管理している。

理由については・・・面倒だから。

2.Ruby(Sinatra)のソースコード作成
sinatra_start.rbのソースコードは以下の通り作成した。


3.Hamlのソースコード作成
index.hamlのソースコードは以下の通り作成した。


4.説明

4.1
Ruby側の説明

プログラムの先頭の方では、
ファイルの読み書きのため外部エンコーディングの設定をしている。

「get '/' do ~ end」では、
view側で利用するインスタンス変数にデータを代入している。
(CSVファイルを読み込みデータは二次元配列)
index.hamlを参照するように設定。

「put '/request_print' do ~ end」では、
フォームで入力されたデータをparams[それぞれのname値]で取得し、
CSVファイルへ追記している。
また、「redirect '/'」にて、「get '/' do ~ end」が実行されるようリダイレクトしている。

4.2
Haml側の説明
コメントの表示と入力フォームをtableタグを利用し表示している。
コメントの表示部分では、tableタグの中にRubyコードを埋め込み、
csvのデータをループさせながら表示させている。

5.実行(画像有)

5.1
以下のコマンドを実行する。
コマンド:ruby sinatra_start.rb

5.2
ブラウザを起動し、以下のURLへアクセスする。
URL:http://localhost:4567/

※ポートを変更している方は、各自の設定に適した値でポート部分を変更する

5.3
以下のような実行画面が表示されていることを確認する。
(Comments Listは、CSVファイルに記述がない場合表示はない)


























5.4
Comment Writeの入力フォームに適当な値を入力し、「コメントする」ボタンを押下する。

5.5
入力したデータがComments Listへ表示されれば、以上で画面テストは終了。

以上!!

以下、参考にさせて頂いたサイト
Sinatra本家(日本語訳)
プログラミング的なSomething - Hamlのsyntax error, unexpected keyword_ensure, expecting keyword_endエラーについて

管理人の独り言~
Hamlのインデント重要・・・望み通りのHTML出すのに2hは悩んだ・・・
問題を解決するために思考してたけど見当はずれな方向に調査をしていた。
同じ問題で当たったことがある人がいて良かった・・・

解決策が調査では出ない場合、みなさんはどうされますか?
答えのない問題みたいに、対処を考えておくと割と良いかな~っと思います。

以前の記事にも何回か記述していると思うが、
今後追加したいと思っているプログラムを軽く記述しておく。

  • バリデーター
  • DBとActiveRecord
  • SASS(スタイルシート)
  • Padrino
  • SQLインジェクション
  • Modelの導入
  • 時間項目追加
  • ...etc
軽くだとこんなところでしょうか。
勘違いしている部分もあると思うので増減はすると思います。

毎度思うのだが、
Gistで表示するソースコードは何故元のソースコードとこんなにインデントがずれるのだろうか・・・

最後に、私の学生時代の講師の方が本を書いたようなのでご紹介をしたいと思います。
この記事を書いているときはまだ発売してないので、内容はまだ分かりません。
ですが、プログラマとして実力は物凄く高い方で、CEDECにも参加されたことがある方ですから、
コーディング技術向上に役に立つ本だと思います。

2015年5月18日

Sinatraで入力フォームのデータを取得する。

タイトル:Sinatraで入力フォームのデータを取得する。

目的:htmlのinputタグ(テキストボックス)で入力されたデータを取得し表示する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
Sinatra:v1.4.6
Haml:v4.0.6

ディレクトリ構造:
作業ディレクトリ
|-sinatra_start.rb(ファイル)
|
|-views(ディレクトリ)
    |-index.haml(ファイル)
    |-request_print.haml(ファイル)

目次:

  1. 入力データを取得(sinatra_start.rb)
  2. 入力フォームを作成(index.haml)
  3. 入力データを表示(request_print.haml)
  4. 説明&実行

以前、以下の記事を閲覧して頂いたことがある方は、
ソースコードを追記/修正する形で実施すると楽です。

1.入力データを取得(sinatra_start.rb)

1.1
画面側で入力されたデータを取得する部分を記述する。

ソースコードは以下の通り作成した。

2.入力フォームを作成(index.haml)

2.1
画面に入力するための入力フォームを作成する。

ソースコードは以下の通り作成した。

3.入力データを表示(request_print.haml)

3.1
入力されたデータを画面で確認する部分を作成する。


ソースコードは以下の通り作成した。


4.説明&実行

4.1
Ruby側についての説明

データの取得の仕方は、
「params[:inputタグのnameの値]」で取得できる。

また、直接(?)Webリクエストの内容からも取得できた。
「request[:inputタグのnameの値]」でも取得できた。

現状、使い分けがどうなっているのか分からない。
しかし、Sinatraの本家サイトではルーティングの説明の後に
paramsでデータを取得をしている部分があるので、
おそらくparamsを使っていれば問題はないと思う。

4.2
Haml側についての説明

index.hamlについての説明。
Hamlでは、inputタグを以下のように記述する。
「%input{:type => "text", :name => "name"}」

typeにinputの種類(今回はテキストボックス)を、
nameにはparamsで取得するための名前を設定している。

inputタグの詳しい設営はhtmlのドキュメントか説明サイトを参照にして下さい。

request_print.hamlの説明は表示のみなのでなし。

4.3
以下のコマンドで実行する。
コマンド: ruby sinatra_start.rb

画面下部に入力フォーム3つとボタンが出ていることを確認し、
適当な文字を入力フォームに入力する。
送信ボタンを押下する。

ページ遷移し、入力した値が表示されていれば問題ない。

以上!!


参考にさせて頂いたサイト
Sinatra本家(日本語訳)

管理人の独り言...
これで、パーツは概ね問題ないかな...?
まだ、DBやらActiveRecordだとかあるけど、
修正でプログラムすればいいし大丈夫だろう。

というわけで、ようやっと掲示板の作成に取り掛かれます。
内容的には、Webの基本中の基本的な内容なので、
あまり過度な期待はしないで下さい。

2015年5月17日

Rubyのクラス定義が分からない!!

タイトル:Rubyのクラス定義が分からない!!

目的:
Rubyにおけるクラス定義の仕方諸々が分からなかったので、
書き方などの基本をまとめテストコードを作成する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2

ディレクトリ構造:
作業ディレクトリ
|-main1.rb
|-main2.rb
|-main3.rb
|-main4.rb

目次:

  1. クラス定義
  2. 継承の仕方
  3. モジュール定義
  4. その他


さて、掲示板を作成する前にふと気づいた。
あれ?...Rubyのクラスやメソッドの記述のどうやるんだ?...っと。
と言うわけなので、ちょっとまとめます。

1.クラス定義

1.1
クラスを定義してメソッドを記述した。
ソースコードは以下の通り作成した。
main1.rb


1.2
クラスの定義
class クラス名
end

メソッドの定義
def メソッド名(引数...)
  return 返り値
end

なお、initializeメソッドはデフォルトのインスタンスメソッドになる。

2.継承の仕方

クラスとは、メソッド群である...

2.1
スーパークラスとサブクラス、メソッドのオーバーライドについて記述した。
ソースコードは以下の通り作成した。
main2.rb


2.2
継承の仕方
class サブクラス名 < スーパークラス名
end

initializeメソッド内の「super」の記述は、
スーパークラスのinitializeを呼び出している。
引数を渡したいときは、「super(引数...)」で記述すればよい。

メソッドのオーバーライドの仕方は、
サブクラスにて、スーパークラスのメソッド(オーバーライド対象)と
同名のメソッドを定義する。

2.3
参考までに継承するものしないものを記述する。
サブクラスに継承するもの

  • インスタンスメソッド
  • クラスメソッド
  • クラス変数
  • 定数

サブクラスに継承されないもの

  • インスタンス変数
  • クラスインスタンス変数


3.モジュール定義

3.1
モジュールを定義し、それをインクルードしたクラスで利用している。
また、モジュールのメソッドをオーバーライドしている。
ソースコードは以下の通り。
main3.rb


3.2
モジュール定義
module モジュール名
end

モジュールのインクルード(mix-in)
class クラス名
  include 利用モジュール名
end

クラス間で「has-a」の関係を行いたいとき使う。

4.その他
2項目詰め込んだせいか...何故か一番ソースが大きい...。

4.1
アクセス制限とアクセッサ(セッター、ゲッター)について記述した。
ソースコードは以下の通り。
main4.rb


4.2
アクセス制限には、3種類ある。

  • private: 定義したクラス内でのみ使用可能
  • protected: 定義したクラスとサブクラス内でのみ使用可能
  • public: 定義したクラス内でも外でも使用可能


アクセッサについて
アクセッサは、インスタンス変数に対してのセッター、ゲッターを提供する。

2.2で継承しないものに「インスタンス変数」が入っている。
なのに何故、サブクラスで親で定義した変数が参照できるのか?
アクセッサを利用しているため。

継承のための詳しい内容はこちらを参考にして頂くと分かり易いと思います。
お気楽 Ruby プログラミング入門 第 11 回 継承

以上!!

参考にさせて頂いたサイト
RubyLife - initializeメソッド
徒然なるままに - Rubyの継承についてのはなし(インスタンス変数,クラス変数,クラスインスタンス変数,インスタンスメソッド,クラスメソッド,定数)
attr_accessor (Module)
Qiita - Ruby | Ruby の private と protected 。歴史と使い分け

管理人の独り言...
本日は、データアクセスメソッド(DAM)パターンをやろうと思いました。
RubyGemsにActiveRecordがあるので必要ないと思い、
急遽方向転換し掲示板作成に取り掛かるが、結局Rubyの記述方法が分からないことに気付く。
仕方がないので、Ruby言語自体の基礎をやることと相成りました。
来週中には、掲示板の記事を上げていけると思います。

備忘メモ:Rubyでは、変数は代入をしないと存在しない。

2015年5月15日

SinatraでWebリクエストを取得してみる。

タイトル:SinatraでWebリクエストを取得してみる。

内容:
Sinatraで、formタグから送信されるWebリクエスト(HTTPメソッドとURL)を取得し表示する。

実施環境:
OS:Windows8.1
Ruby:v2.2.2
Sinatra:v1.4.6
Haml:v4.0.6

ディレクトリ構造:
作業ディレクトリ
|-sinatra_start.rb(ファイル)
|
|-views(ディレクトリ)
    |-index.haml(ファイル)
    |-request_print.haml(ファイル)

目次:

  1. Rubyソースコードを作成
  2. Hamlソースコードを作成
  3. 説明&実行


以前、以下の記事を見て頂いたことがある方は、
ソースコードに追記する形で実施すると楽です。
Hamlを使ってみた。

1.Rubyソースコードを作成
Rubyのソースコードは以下のように作成した。
sinatra_start.rb


2.Hamlソースコードを作成
Hamlソースコードは以下のように作成した。
index.haml


request_print.haml


3.説明&実行

3.1
Ruby側の説明
「@~」の部分で、リクエストのパラメータを取得している。
「request.」で、リクエストオブジェクトにアクセスしている。
(Sinatraに用意されているためかなり楽だった...)

「haml: request_print」でrequest_print.hamlを指定。

「put '/request_print' do ~ end」は、
HTTPメソッドが「put」、パスが「/request_print」でこの部分が実行されるよう記述している。
request.request_method:HTTPメソッド
request.url:要求されたURL
request.path:要求されたパス

3.2
Haml側の説明
Web知識のgetとpost、各HTTPメソッドについては説明を割愛する。

formタグにて、「post」で「/request_print」を指定している。
しかし、hiddenで「_method」、「put」を指定している。
そのため、HTTPメソッドは「put」、パスは「/request_print」にて送られていることになる。

実際に、hiddenをコメントアウト等して実行すると、
HTTPメソッドが「post」、パスは「/request_print」で送られる。
その場合、サーバ側で受ける部分がないので、Sinatraのエラー(?)ページが表示されるが...

3.3
実行してみよう。
コマンド:ruby sinatra_start.rb

localhost:4567へアクセスし、ページ遷移のボタンを押下する。

request_printのページが表示され、
ボタンが押下された際のリクエストデータが表示されている。

以上!!

参考にさせて頂いたサイト
Sinatra本家(日本語訳)

個人的なコメント
今回、リクエストについて記事を書いたのには理由がある。
HTTPメソッドとか色々忘れたからだ...orz
なので、html側から送ってきたリクエストがどうなっているのかイメージができなくなっていた。
というわけで何が送られているか知るために今回の記事を書いたわけです。

当初、Hamlのファイル名は_(アンダーバー)を-(ハイフン)で作成していたが、
Rubyソースで参照するHamlファイルを指定するとArrgment Errorが発生した。
そのため、ファイル名を_(アンダーバー)に変更した。
(仕様...でいいのかな...?)

2015年5月14日

Hamlで二次元配列の内容をループさせて表示する

タイトル:Hamlで二次元配列の内容をループさせて表示する

目的:Ruby+Sinatra側でCSVを読み込み、そのデータをHamlでループさせて表示する。

実行環境
OS:Windows8.1
Ruby:v2.2.2
Sinatra:v1.4.6
Haml:v4.0.6

ディレクトリ構造

作業ディレクトリ
|- sinatra-start.rb(ファイル)
|- views(ディレクトリ)
| - index.haml(ファイル)
|- resources(ディレクトリ)
  - bbs-data.csv(ファイル)

csvのテスト用データは各自でご用意して下さい。
(文字コードはUTF-8を想定してプログラムしています。)

目次:

  1. Ruby(Sinatra)ソース作成
  2. Hamlソース作成
  3. 説明&テスト

以下の記事を以前に見て頂いたことがある方は、
ソースコードに追記する形で実施すると楽です。

1.Ruby(Sinatra)ソース作成

Rubyのソースコードは以下の通り作成した。
sinatra-start.rb

2.Hamlソース作成

Hamlのソースコードは以下の通り作成した。
index.haml

3.説明&テスト

3.1
Ruby側の説明
エンコーディングの設定をUTF-8に変更しています。

@bbs_dataと言うインスタンス変数に対して、
読み込んだCSVデータ(二次元配列)を代入しています。

こちら側でやっていることはこれくらいですね。

3.2
Haml側の説明
Hamlにて、-(ハイフン)を記述するとRubyのコードを記述することができるようになります。
なので、@bbs_dataをeachでループさせることができるわけですね。

Rubyで設定した@bbs_dataを(二次元配列なので)二回ループさせて値を取り出しています。
表示は、配列のままも出せますし、個々の値を出すこともできます。

くぅ~、今日は時間がなかった...少し説明不足で全体的な進行が遅いな。
まぁ、仕方ないか...初めて触るものばかりですし...
現在は、パーツを集めている段階です。
各記事の内容が組み合わさって掲示板になるかと思います。
もしかしたら、Rubyの環境構築を実施した時のようにまとめ記事を作成するかもしれません。

以上!!

2015年5月13日

技術本まとめ

タイトル:技術本まとめ

目的:ブログに書いてる内容にリンクしたお薦めな本をまとめる(第一弾)

※リンク先はAmazonのサイトです。

・Rubyの本
プログラミング言語 Ruby
まず、これは外せませんね。
Rubyの作者である、まつもとゆきひろさんが書いた本です。
必読書と言っても過言ではない本かと...大体の人が持っているんではないでしょうか?

初めてのRuby
Ruby初心者の一冊だと思います。
但し、プログラム完全な初心者だと少し厳しいかもしれません。

しかし、持っていて損になる本ではないです。
プログラミング言語 Rubyと一緒に最初に買っておくといいと思います。
値段も手ごろですし。

パーフェクトRuby
言語の仕様についても書いてある。手元にあったら便利な本です。
Ruby2.0にも対応しているので助かりますね。
ある程度、Rubyに親しんでから読むといいと思います。
ただ、分厚いですね(笑)

Rubyのしくみ -Ruby Under a Microscope-
タイトルの通り、Rubyの仕組みについて書いてある本です。
図や手順が載っているので、分かりやすいとは思います。
でも、初心者が読む本ではないと思います。

Effective Ruby
有名なEffectiveシリーズの本ですね。
自分はまだ読めてません...上級者向けの本です。

・Sinatraの本
Sinatra: Up and Running
Kindle版ですが、Sinatra始めるならこの本は欲しい。

Sinatraの本少ないですよね。
これしか見つけられませんでした...

・Gitの本
入門git
初心者にも分かりやすい本です。
これだけだと少し足りない気がするので、他の本と併用が望ましいと思います。

実用git
gitが内部でどうやって動作しているのかが分かります。
一人で開発する管理人では、あまり使わないかも知れないですが、
知識として押さえておくだけでも理解度が違うので...
しかし、翻訳微妙...

Gitによるバージョン管理
実際に複数人で開発する時に役立つと思います。
お一人開発のことも書いてあるのでいいですね。

・Sublimeの本
探したのですが、コレ!っと言う本がありませんでした。

結局のところ、Sublimeのドキュメントやプラグインのドキュメントを読むか、
Webで調べるのが速いと思います。

誰か良い本ご存知ですか?

今後、必要な時は各記事に本の紹介(?)のようなものを追加していく方針で行きます。
今回は、十数件の記事を修正するのが面倒だったからまとめますが...
たまには、お薦め本紹介の記事やりますけど。

Kindleが欲しい...

以上!!

2015年5月12日

Rubyのエンコーディングについて

タイトル:Rubyのエンコーディングについて

目的:Rubyのエンコーディングについての備忘録を作成すること

以下の環境により実施
OS:Windows8.1
Ruby:v2.2.2 x64
ディレクトリ構造:
作業ディレクトリ
|-encoding-test.rb
|-test-data.csv(保存はUTF-8)
|-csv-read.rb
|-csv-write.rb

前提条件

  • なし

以下の流れにより説明
  1. デフォルトエンコーディングの確認
  2. 外部エンコーディングと内部エンコーディング
  3. 実際に起きたエラーについて
  4. おまけ(CSVファイルの読み書き)

何故、Rubyのエンコーディングについて書いたのかと言うと、
csvファイルを使いたくてRubyで読み書きをしていた際、とあるエラーが発生し追っていく内にエンコーディングに行き着いたからです。

今まで、何気なく使っていたのですが、
Rubyのエンコーディングについてよく分かっていなかったみたいです。
現役の方とも質疑応答したので、復習がてら備忘録を作成しようかと思います。

1.デフォルトエンコーディングの確認

そも、文字エンコーディングって何だろうか...
文字コードを別の文字コードに変換することを文字エンコーディングと言う。
コンピュータで文字を入力するには色々な種類の文字コードがある。
大体は、国際基準のUTF-8を使っているんだけど...Windowsだと...

ここでは、
WindowsにおいてRubyを使用する時のデフォルトエンコーディングを確認する。

1.1
まず最初に、
WindowsでRubyを使う時のデフォルトのエンコーディングは「Windows-31J」になっていた。
実際に確認するため、以下のコードを実行する。
ソース1

結果は以下のようになる。
#<Encoding:Windows-31J>
nil
nil
nil
#<Encoding:UTF-8>
#<Encoding:UTF-8>

1.2
デフォルトでは、Windows-31Jが設定されている。
その後、UTF-8に設定しているので、出力が変わっている。
これで、扱う文字コードが変えられる。

2.外部エンコーディングと内部エンコーディング

2.1
1.1のソース内に外部内部とあるが何かと言ったところを記述する。
「外部エンコーディング」、入出力ファイルの文字コードを表す。
「内部エンコーディング」、ソース内部で扱う文字列の文字コードを表す。

3.実際に起きたエラーについて

3.1
まず、起きたエラーは以下のもの
エラー:invalid byte sequence in Windows-31J (ArgumentError)

3.2
そもそも何で起きたのかと言うところだが、
自分が取っていた行動を以下へ記述する。

Windowsの新規テキストファイル作成でcsvファイルを作成した。
その後、内容を編集しUTF-8で保存した。
それをRubyで読み込もうとしたところエラーが発生した。

3.3
これは、Rubyの外部エンコーディングの設定が「Windows-31J」になっているため、
読み込みcsvファイル(UTF-8)では、文字コード形式が違うためエラーとなった。

つまり、ファイルとエンコーディング設定の文字コード形式が合致しないため発生した。

3.4
エラー内容をコピペ検索するだけで、解決法は出てきますね...
一応方法ざっくり
  • 「-E UTF-8」を実行オプションにつける
  • 「set RUBYOPT=-EUTF-8」で環境変数いじる
  • 外部エンコーディングの文字コードを合わせ
  • ファイルの文字コードを合わせる

こんなところかな...

4.おまけ

csvの読み書きをRubyで作ったので上げておく。
(即席ソースなので期待はしないで下さい。)

4.1
csvの読み込みソースは以下
ソース2

4.2
csvの書き込み(追記)ソースは以下
ソース3

4.3
テストに使ったcsvファイルは以下
csv

分かれば、大した問題ではないんだよな~

以上!!

以下、参考にさせて頂いたサイト

2015年5月11日

Hamlを使ってみた。

タイトル:Hamlを使ってみた。

目的:Hamlの基本中の基本的な使い方とRubyコード埋め込みをテストする。

以下の環境にて実施
OS:Windows8.1
Ruby: v2.2.2 x64
Sinatra:v1.4.6
Sinatra-contrib:v1.4.2
haml:v4.0.6
ディレクトリ構造:
作業ディレクトリ(名称は何でもいい)
|-sinatraTest.rb
|-views(名称は左記の通りにディレクトリを作成)
    |-view.haml

前提条件

  • 上記に準ずる環境が構築されていること

以下の流れにて実施
  1. Hamlインストール
  2. Ruby側のソースコード作成
  3. Haml側のソースコード作成
  4. 説明&テスト
1.Hamlインストール

1.1
Rubyコマンドプロンプトを起動する。

1.2
以下のコマンドを実行する。
コマンド:gem install haml

1.3
インストール完了後、以下のコマンドでhamlを確認する。
コマンド:gem list または haml -v

1.Ruby側のソースコード作成
以下の通りにソースコード作成する。
以前、以下の記事を見て頂いた方はソースを改造&追加する形で行うと楽です。
erbを使ってみた。

ソース1
「erb Test!!」の記述直し忘れた。
再アップするのが面倒なのでこのままで...

2.Haml側のソースコード作成
以下の通りにソースコード作成する。

ソース2

3.説明&テスト

3.1
Rubyソース側
「require haml」、hamlを使うためにrequireしている。(なくても警告が出るが動作する。)
「haml :view」、でviews/view.hamlを指定。

Hamlソース側
「%タグ名(htmlタグ)」で、タグの記述ができる。(閉じのタグは不要)
「%タグ名= @埋め込み名」でRubyコードで定義した内容を埋め込める。
または「%タグ名 #{@埋め込み名}」でもよい。
「-#」でhaml内だけのコメントとして扱える。

3.2
Rubyコマンドプロンプトから
sinatraTest.rbのディレクトリへ移動し、以下のコマンドを実行する。
コマンド:ruby sinatraTest.rb

3.3
「localhost:4567」へアクセスし、Rubyソース側で記述してある文言が表示されれば問題ない。

3.4
この項目はやらなくてもいいです。

hamlで記述しているファイルから、html記述のファイルを出力する。

Rubyコマンドプロンプトを起動して、viewsのディレクトリから実行する。
以下のコマンドを実行する。

コマンド:haml -q -E UTF-8 view.haml view.html
「-q」は、区切りをダブルクォーテーションにしてくれる。(デフォルトだとシングルになるため)
「-E UTF-8」は、文字コード指定。(ないとエラーが発生する)

今回のファイルでは、@titleや@textの部分はRubyソースに記述されているので、
htmlで出力しても何も記述されていない。

適当な文言を入れて出力すれば出てくる。
試してみて下さい。

erbよりもhamlの方が記述が少なくなりますね。
今回は、基本中の基本レベルなので、大した実感は出ませんが、
これから大きくなっていけば実感できるかと...

他にも色々と記述できることがあるのですが、、、それはその内...

閑話休題...(まったく関係のない話題)
さて今回なのですが、
github(gist)にてソースコードをいつものごとくアップロードしました。
しかし、あまりにも同じ名前を続けていたため、スパム扱いされてしまいました。
エラー(?)、警告(?)のようなものが出ますので、ちょっと焦りました。

対応としては、サポートの方へメールを出せば、対応してくれます。
ちなみにメールは一応英語で書きました。
管理人はまったくもって英語が苦手なのですよ。
なのでネットで調べた結果、固い英語になってしまいましたね...

GitHub Stuffの対応して下さった方、
拙い英語にもかかわらず、迅速な対応ありがとうございます!

みなさんも私と同じことにならないよう、気を付けて下さい。

以上!!

以下、参考にさせて頂いたサイト
Haml - REFERENCE(本家のドキュメント)

2015年5月10日

erbを使ってみた。

タイトル:erbを使ってみた。

目的:htmlにerbを埋め込みテストする

以下の環境にて実施
OS:Windows8.1
Ruby: v2.2.2 x64
Sinatra:v1.4.6
Sinatra-contrib:v1.4.2

前提条件

  • 上記に準ずる環境が構築されていること

以下の流れにて実施
  1. ディレクトリ作成
  2. ruby側のソースコード作成
  3. erb側のソースコード作成
  4. 軽く説明&テスト

さて、Sinatraメインで行くと言っておきながらいきなり公約破り...
まぁいずれerb、は使うことになったであろうから仕方がない。
今後Web系をやっていくのに必要(?)と言うことで納得して欲しい。

1.ディレクトリ作成
以下に示す通りのディレクトリを作成する。
作業ディレクトリ(名称は何でもいい)
|-sinatraTest.rb
|-views(名称は左記の通りにディレクトリを作成)
    |-view.erb

viewsディレクトリはどうにもsinatraのデフォルトのようです。
viewsディレクトリを作成せず、sinatraTest.rbとview.erbを同ディレクトリに置いた場合、
No such a fileと言った感じにエラーが発生します。

その際、「~/views/view.erb」にありませんと言った文言が表示されるので、
viewsがデフォルトであると検討を付けました。

2.ruby側のソースコード作成
以下の通りにソースコード作成する。
以前、以下の記事を見た方はそちらを改造追加する形で行うと楽です。
sinatraを使ってみた。

ソース1

3.erb側のソースコード作成
以下の通りにソースコードを作成する。
ソース2

4.軽く説明&テスト
簡単に説明すると、
sinatraTest.rbにて、erb側で使うものを定義し、view.erbにて利用している。

例)
sinatraTest.rbの「@title」部分が定義部分。
view.erbの「<%= @title %>」部分がhtmlソースへの埋め込み部分。
「erb :view」でview.erbで使うと記述している。

htmlの細かい部分は割愛する。

記事書いてから気づいた...hamlかslim使えばよかった...orz
以上!!

2015年5月8日

今後の予定~

さて、今後の予定なのですが、、、

現状、sinatraさんに心奪われているのですよ!!
(女性にも感じたことがないこの胸の高鳴り!これが...これが恋かwww)
少しは現実でも見た方がいいのでしょうが...しかし気にしない方向でw

というわけで、メインとしてはsinatraを使っていこうかと思います。

でもまぁ、他にも色々とhubotもやりたいし、webhookもwebAPIもやりたいですね。
なので、たまに(?)脱線して他のこともやっていこうと思います。

しかし、Web系の開発知識もすっかり忘れている現状、亀更新になってしまいますね...
一応、sinatraで何か作ってみるのが、直近の目標ですね。(掲示板とか?)

その内ですが、ruby+sinatra+herokuって感じにできれば御の字かと...

それにしてもちょっと離れていた間(約二年)に随分変わった感じがします。
(当時からあったけど、自分が勉強してないだけ?)

一応、備忘録のつもりですが人様が目にすることがあるので、
少しは意識して、皆さんの少しでも役に立つ記事が上げられれば嬉しいですね~。

ちなみに、管理人は割と適当+ある程度ハイテンションが素です。
あまりにもブログ中と口調が違うからと精神的に不安定ではないので、あしからず...
(どうでもいいことですね)

以上、つまらない駄文失礼しました~ノシ

sinatraを使ってみた。

タイトル:sinatraを使ってみた。

目的:sinatraのテストプログラムを書く。

以下の環境により構築
OS:Windows8.1
Ruby: v2.2.2 x64
RubyDevKit:DevKit-mingw64-64-4.7.2-20130224-1432-sfx

前提条件

  • Rubyがインストールされていること
  • RubyのDevKitがインストールされていること

前提条件が満たせていない方は、以下を参考にしてください。

以下の流れにて実施
  1. gemのインストール
  2. sinatraのテストコード
sinatraのサイトの流れに沿って実施した。
一部ソースが異なるため、sinatraのサイトを見て実施した方が確実だと思う。

1.gemのインストール

1.1
Rubyのコマンドプロンプトを立ち上げ、以下のコマンドを実行する。
コマンド1:gem install sinatra
コマンド2:gem install sinatra-contrib

1.2
gemのインストール後、以下のコマンドを実行し、sinatra(バージョン)、sinatra-contrib(バージョン)が確認できれば問題ない。
コマンド:gem list

2.sinatraのテストコード

2.1
以下の内容を作成する。

sinatra-contribを入れた理由としては、自動リロードさせるため。
これがあるとソースを書き換えた後、いちいち再起動しなくて済む。
(ソース中の「require 'sinatra/reloader' if development?」の部分)

しかし途中問題もあった、
sinatraとsinatra-contribをインストールするとtiltと言うgemがインストールされるのだが、
sinatraを入れるとtilt2.0.1、sinatra-contribを入れるとtilt1.4.1が入りsinatra-contribを使うと競合する。

それを避けるため、gemのtiltをバージョン指定で読み込み、requireもしている。
どちらかを消すとかの対処の仕方が調べても出てこないので、
現状こういった方法で対処している。
他、詳しい内容はまだ説明できないので割愛する。

2.2
作成できたら実行し、「localhost:4567」をブラウザから開く。
「Hello World!!」が表示されていれば問題ない。

以上!!しかし、最近Web開発便利になったんだな~(やっぱ一度離れると大変だわw)

参考にさせて頂いたサイト
なし(あえて挙げるならsinatraの本家サイト様)

2015年5月5日

Sublime Text3のRubyプラグインインストール

タイトル:Sublime Text3のRubyプラグインインストール

目的:Sublime Text3にてRubyのプラグラムを作成する際、快適にプログラムできるよう環境を整える。

以下の環境にて構築する。
OS:Windows8.1
Ruby:Ruby 2.2.2 x64
SublimeText3:Sublime Text Build 3083 x64
msysGit:msysGit-netinstall-1.9.5-preview20150319

以下の前提条件を必要とする。

  • SublimeText3がインストールされていること
  • Rubyのインストールがされていること
  • Package Controlがインストールされていること
  • msysGitがインストールされていること


前提条件を満たしていない方は、
以前、記述した記事があるのでそちらを参考にしてください。
Sublime Text3のインストール(Package Control含む)
Rubyのインストール
msysGitのインストール

以下の流れにて実施する。
  1. SublimeCodeIntelプラグインをインストール
  2. SublimeLinterプラグインをインストール
  3. SublimeLinter-Rubyプラグインをインストール

1.SublimeCodeIntelプラグインをインストール

コードの入力を補完してくれるプラグイン。

1.1
SublimeText3を起動する。

1.2
以下の手順を実行する。
「Ctrl+Shift+p」→「install」→「SublimeCodeIntel」

1.3
インストール終了後、初期設定を行う。
以下の順に実施

  1. 上部メニューから、「基本設定」→「Package Settings」→「SublimeCodeIntel」→「Settings - Default」を選択する。
  2. 表示されたテキストを全てコピーする。
  3. 上部メニューから、「基本設定」→「Package Settings」→「SublimeCodeIntel」→「Settings - User」を選択する。
  4. コピーした内容をペーストする。
  5. 以下の内容を最後の行に追加する。(カンマ(,)忘れずに!!)
追加内容
ーーーー
"Ruby": {"ruby": "C:/Rubyインストールフォルダ/bin/ruby", "rubyExtraPaths": ["C:/Rubyインストールフォルダ/lib/ruby/gems/2.2.0"]}
ーーーー


手順1、3の場所

手順5の追加行

1.4
設定のテストを実施する。
任意のディレクトリへrubyファイルを作成する。
作成したファイルは、ドラッグ&ドロップでSublimeへドロップする。

1.5
以下のコードを記述する。
ーーーー
testHash = Hash.new()
testHash.empty?()
ーーーー

記述の際、Hashを新しく作成する時とHashのメソッドを選択する時にコードの保管がされた。

これにてSublimeCodeIntelはインストール完了。

2.SublimeLinterプラグインをインストール

各言語のLinterを使用するために必要なプラグイン。

2.1
上部メニューから、「基本設定」→「Packageフォルダ」を選択する。
もしくは、「C:\Users\ユーザ名\AppData\Roaming\Sublime Text 3\Packages」のフォルダを開く。

2.2
msysGitのプロンプトを起動し、上記ディレクトリへ移動する。

2.3
以下のコマンドを実行する。
コマンド:git clone https://github.com/SublimeLinter/SublimeLinter3.git SublimeLinter

コマンド完了後、Sublimeを再起動する。

3.SublimeLinter-Rubyプラグインをインストール

RubyのLinterプラグイン。

3.1
以下の手順を実行する。
「Ctrl+Shift+p」→「install」→「SublimeLinter-Ruby」

3.2
インストール後、テストを実施する。
任意のディレクトリへrubyファイルを作成する。
作成したファイルは、ドラッグ&ドロップでSublimeへドロップする。

3.3
以下のコードを記述する。
testHashの次にドット(.)ではなく、カンマ(,)を記述する。
ーーーー
testHash = Hash.new()
testHash,
ーーーー

行の左側に赤い点が表示されれば正常にインストールされている。

これにてインストール終了。

また追加したプラグインがあれば、追記するか新しく記事を作成する。
以上!!

以下、参考にさせて頂いたサイト
For myself tomorrow - SublimeText3でRubyをコーディングする際の最低限のインストール&設定(Windows)

人気の投稿