Entertainer Engineering

人を楽しませられる技術者を目指すあおかびんのブログ

Ruby on rails4系でBootstrap系のthemeを使うときに詰まった

どうも、こんにちはaokabinです。

二日間位railsにCosmoのデザインテンプレートを導入するのに苦労したので、備忘録として残しておきます。

事前準備として、

rails new testapp --skip-bundle
cd testapp/

というようにrailsアプリケーションを作って、作業ディレクトリに移動しておきましょう。
加えて、Gemfileの下の方に

gem 'twitter-bootswatch-rails', '~> 3.2.0'
gem 'twitter-bootswatch-rails-helpers'

の２つを記述しておきましょう。

詰まった点
1.therubyracerとlibv8のバージョンのいざこざ
2.bootswatch:importで毎回転ける

1.
gemでtwitter-bootswatch-railsとかhelperとか書いていると、作ったばかりのrails appではbundle installで転けてしまいます。
なんかtherubyracerがねえよ！とか言われるので、Gemfileに

gem 'therubyracer', platforms: :ruby

のコメントアウトを外して再bundle install

bundle install

すると今度はlibv8がねえよ！このバージョンな！と怒られました。

gem 'libv8', 'そのバージョン'

と書いてbundle installすると

libv8がねえよ！このバージョンな！

は？いや、指定しとるやんけ！

こちらのサイトによると

therubyracer 0.11.0 問題まとめ - 自称すーじー。

どうやらtherubyracerとlibv8には互換性が微妙なところがあるらしく、どちらかのバージョンをちゃんと指定しないといけないらしい。

しかも、railsのエラーで言われたバージョンじゃダメらしい、頼むぜぃ。

今回はlibv8のバージョンをそろえるようにしましょう。

gem 'therubyracer', platforms: :ruby
gem 'libv8', '~>; 3.11.8.13'

ということでbundle installするとエラー無く通りました！
本当はもっといい方法があると思うんですがね…
いい方法あったらおしえてください。。。

別のパターンでnokogiriがねえよとか色々と怒られた覚えがあるけど、何かあればコメントでも残して頂ければ幸いです。

とりあえずbundleのエラーは解消されたという風にしておきましょう。

2.
さて、bundle installが通ったのでbootstrapデザインテンプレートを導入していきたいと思います。
次のサイトの2番を参考にして書いていきましょう。


ひと味ちがうTwitter Bootstrapの18個の無料テンプレート&有料まとめサイト - 酒と泪とRubyとRailsと

rails g bootswatch:install readable
rails g bootswatch:import readable
rails g bootswatch:layout readable

すると、bootswatch:importで謎のSSLエラーが発生します。
僕もこのSSLエラーを解消しようと色々調べたのですが、もうimportいいやという結論に至りました。
これもまたいいやり方あったら教えてください。

というわけで手順(使用するテンプレートはCosmo)

rails g bootswatch:install cosmo
rails g bootswatch:layout cosmo

layoutを実行してconflictが出てくるかもしれませんが、そういう時はとりあえずyとEnterの交互連打でなんとかなりました。

これで testapp/app/views/layoutsの中に
application.html.erbとcosmo.html.erbが出来上がるかと思います。
cosmo.html.erbはindex.html.erbにリネームしておいてください。

コレをちょっと検証するために、scaffoldを使って適当なアプリケーションページを作りましょう

まず最初にconfig/initializers/assets.rbに次の1文を追記してください。

Rails.application.config.assets.precompile += %w( cosmo.* )

そして次にlayoutsのcontrollerを作りましょう。

rails g controller layouts

そして最後にconfig/routes.rbにルーティング情報を書き込みます。

resources :layouts

rake routesも忘れないようにしておきましょう。

rake routes

さて、rake routesが終わったら実際に動かしてみましょう。

rails s

http://localhost:3000/layoutsにアクセスして

f:id:aokabin:20140912231727p:plain


このような画面が出てきたら成功です！

いやー疲れた。importって一体何だったんだろう…？

therubyracerとimportの問題について知っている人が居ましたら教えて頂けると幸いです。

AWSでなんとかASP.NETを動かそうと奮闘した話

こんばんは、aokabinです。

今回はAWS使って何とかASP.NETを動かそうと奮闘しておりました。

えー結果から言いますと、AWSLinuxではなくUbuntuを使う事にしました。

サイトで書いてあるCentOSのパッケージリポジトリのURI404だもんで…
こればかりはどうしようもありませんでした…

最初は此方のサイトを参考にしていたのですが
Mono×LinuxでASP.NET MVCを動かすまで
AzureのCentOSだとAST.NETの起動でつまり
AWS Linuxだとそもそもmakeが通らなかったりと
よくわからない問題がありましたので、やめました。すみません。

というわけでUbuntuで実行した話を進めていきたいと思います。
とはいえUbuntuでの進め方は公式サイト(http://www.mono-project.com/docs/getting-started/install/linux/)に書いてあるので、そちらを参考にしても全然できると思います。

まずは環境を整えるために
1.AWSでUbuntuのインスタンスを起動
2.建てたUbuntuサーバーにSSHで接続
というところまでやっておいてください。

入力するコマンドはこんな感じ

sudo su
wget http://download.mono-project.com/repo/xamarin.gpg
apt-key add xamarin.gpg
echo "deb http://download.mono-project.com/repo/debian wheezy main" > /etc/apt/sources.list.d/mono-xamarin.list
apt-get install mono-devel mono-complete

1.管理者権限でログインして
2.xamarin.gpgファイルをダウンロード
3.そしてapt-keyでxamarinのパッケージを認証
4.mono系のパッケージダウンロード先をmono-xamarin.listに登録(多分)
5.mono実行に必要なmono-develとmono-completeをインストール

これでできると思います。

確認のために、ASP.NETのファイルを適当に作成して、ファイルがあるところでxsp4を実行してみてください。

テスト用ファイル

<%@ Page Language="C#" %>
<html>
    <head>
        <title>Test Page</title>
    </head>
    <body>
        <h1>Hello aokabin!</h1>
    </body>

実行コマンドライン

xsp4

実行できましたら、ブラウザでhttp://DNS:8080/ファイル名.aspxにアクセスすると、画面にHello aokabin!の文字が表示されているかと思います！
ちなみにこのとき、AWSでセキュリティグループに8080ポートの開放をするようにしてください！

明日はMVCの方で実行してみます。うまく動くといいんだけどなぁ。

うーん、CentOSで実行できないのがなぁ…
うまく動かせるようであれば教えてください！！

以上aokabinでした！

XamarinのASP.NET MVCフレームワークを使ってWeb APIサーバーを作った話

どうもこんにちは、aokabinです。

今回はXamarinのASP.NET MVCフレームワークを使ってWeb APIサーバーを作った話をしたいと思います。(タイトルのまんま)

しかし資料が少なすぎて非常に困った。

Xamarinをインストールして、開発環境が整っている事前提で話を進めていきたいと思います。

手順としてはこんな感じ↓
1.XamarinでASP.NET MVC を選択してプロジェクトを作る
2.ハンドラーの作り方というか付け方と言うか
3.POSTで受け取ったデータをJson形式でデータを返す

1.
これはそのまま描いてあるように、

Xamarinのファイル>新規>ソリューション

にてC#の欄からASP.NETの「ASP.NET MVC Project」を選択してプロジェクトをクリエイト。
すると色々なファイルやらフォルダやらがまとめて出て来るかと思います。
とりあえず、この時点で一回実行してみましょう。

もし、System.Web.Mvcがうんたらというエラーが出てきたら、
Project名(master)>Project名>参照>From Packages>System.Web.Mvcのところにカーソルを持っていき、パッケージの左側にある歯車ボタンをおして、「最新の状態に更新」を選んでおきましょう。

他のでエラーが出ているならそれを更新してみましょう。
更新してもダメならもう一回だけプロジェクトを作り直して更新し直して見てください。
それでは次に再生ボタンを押して実行してみましょう。

うまく実行できたらブラウザが立ち上がって、簡単なHTMLが表示されるはずです。
ここまできたら次にいきましょう！

2.
ハンドラーというのは、URIでリクエストを送るときに使われる
http://hogehoge.com/こことか/そのまたこことか/index.html
のことですね、多分。

その辺りを設定するために、一度確認しておきましょう。

Xamarinのソリューションビュー部分から「Views」というものを探し出してみてください。その中に「Home」というフォルダがあって、「Index.aspx」というファイルがあるはずです。
それでは、プログラムを実行して、立ち上がったページのURIに/Home/Indexと追記してみてください。(http://127.0.0.1:8080/Home/Index)

すると、遷移する前と同じ画面が表示されたかと思います。

どうなっているのかを説明するために、次はソリューションビューの中から「Controllers」というフォルダを探してください。
そこには「HomeController.cs」というファイルがあるかと思います。その中身を見てみると、次のようなソースコードが見つかるかと思います。 

public ActionResult Index () {
    var mvcName = typeof(Controller).Assembly.GetName ();
    var isMono = Type.GetType ("Mono.Runtime") != null;
    ViewData ["Version"] = mvcName.Version.Major;
    ViewData ["Runtime"] = isMono ? "Mono" : ".NET";
    return View ();
}

実は、このIndex()という関数がHome/Indexで呼ばれるハンドラーとなっていた訳です。
ちなみに、このHomeというのは、ControllerのクラスであるHomeControllerクラスに属するという意味(たぶん)です。

それでは今回はこのIndex関数をPostリクエストからJsonデータを返すようにいじってみましょう。

3.
先ほどのIndex関数の上に[HttpPost]を追記してみましょう。
続いてActionResult→JsonResultに変更。
POSTリクエストで受け取った値は、次のような関数で受け取る事ができます。

string name = Request.Form.Get("name");

これはname変数の中に、POSTリクエストで受け取ったinputのnameが"name"のものの値を入れる、という意味です。(ややこしい)
ここでaokabinは、一度string型でJSON形式っぽく書いてreturnさせています。しかし、絶対もっといいやり方があると思う。

string returnJson = "{name : " + name + "}";
return Json(returnJson);

こんな感じのコードになります。

[HttpPost]
public JsonResult Index () {
    string name = Request.Form.Get ("name");
    string returnJson = "{name:" + name + "}";
    return Json(returnJson);
}

最後のJson(returnJson)は、結果をJson形式にキャストするという関数になります。たしか、Json.NETとかのパッケージを入れなきゃいけなかったかもしれない。

パッケージの入れ方は調べれば出てくるんですが、プロジェクト>Add Packagesを選んで、トグルがOfficial NuGet Galleryになっていれば、検索ボックスから検索してAdd Packageできると思います。

そんなトグルがなければ、一番したまでスクロールして、パッケージ>Sourcesを選択して、追加：名前「Official NuGet Gallery」、URL「https://www.nuget.org/api/v2」にしてAdd Sourceして、念のためXamarinを再起動してください。うまくいっていればプロジェクト>Add Packagesを選ぶとOfficial NuGet Galleryが出てきているはずです。

うまくいってなければググってくだされ。

Viewsが無いからPostできないじゃん！
という方のために、以下のコマンドをご用意致しました！

curl -F "name=YourName" http://localhost:8080/Home/Index

よかったらterminal開いて打ち込んでみてください。
いい結果が得られる事を期待しています！
というわけで、ASPでAPIサーバー作りでした。

それではまた。

bundle installが通らなくて困った話

どうもこんにちはaokabinです。

railsを使ってドットインストールのチュートリアルをやろうと思ったところ

rails new myapp

を実行したところ

To eliminate this warning, please install libyaml and reinstall your ruby.

こんなエラーが出てきました。

libyamlがないならinstallしてやろうと思い、

brew install libyaml

を実行したところ

Warning: libyaml-0.1.6 already installed

おいお前入っとるやないけ！！

ふとrubyのバージョンが悪いのかとおもいrbenvで入っているモノを色々いじっていると、チュートリアルで使っている2.0.0-p247をinstallしたときにyamlをinstallするような動きを始めました。

んで、installが終わったところでバージョンを変えずに(使用時のバージョンは2.0.0-p451)でbundle installしたところ動きました…。

さっきまで入ってたyamlは一体…？

とりあえずメモ

rbenvでrubyのバージョンが切り替わらない時

どうも、aokabinです。

rbenvでバージョン管理、凄い便利ですよね(実力不足で活かした事無いけど)

この間rbenvを導入したらどうもバージョンが切り替わらなかったのでメモ

rbenv global 2.1.1
rbenv version
2.0.0hogehoge
rbenv local --unset
rbenv rehash

2.0.0になってた時は「は？」ってなったけど
rbenv local --unsetでlocalの保存を削除したらちゃんと動いてくれました

超単純…