今回Googleだと多くの人が使っているし、新たにアカウント・パスワードを取得しなくても良い、またやはりGoogle Docsのツールはかなり考えられて作られているので便利であるということから、コミュニティー運営のサイトの一部をGoogle Docsの上でコンテンツ管理ができる様に制作しました（ちなみにお問い合わせフォームの問い合わせ管理もGoogle Groupsを活用です）。
実装にはサイトの中のどの部分をGoogle Docsで管理できる様にするかを決めて、あとは対象のGoogle Docsを公開してREST APIでjsonデータを引っ張ってくるだけです。
それなりにコンセプトは面白いのですが、ログインの為に新しいアカウントが必要無い・データの管理が楽だという理由ではむしろ自前で普通にデータベースを構築してシンプルなインターフェースを作り、OAuthでGoogleのアカウントを使ってユーザにログインしてもらった方が良さそうですね。
今回はまたちょっと失敗なアイデアでした。データベースを自前で構築しない・コミュニティーによる管理が楽な画期的なアイデアだと思ったのですが、ちょっと残念です。まあどれだけ手間がかかるとか、実際に動かしてみた時の利便性は実際に経験してみないと分からないので、やってみて良かったです。
Wednesday 31 October 2012
Monday 29 October 2012
SinatraとRSpecで開発（ちょっとしんどい）
ここ２日程SinatraとRSpecを使って、１ページウェブサイトの制作をしていました。
Sinatraはとてもシンプルなのが好きで使っているのですが、少しやる事が複雑になると一つずつrequireを追加していく必要があります。フォームを設置する、外部APIを使用する、テストを書くという程度の制作になればSinatraではなくてRailsにしたほうがかなり時間を抑えて開発できるのではないでしょうか。小さな規模のサイトなのにかなり時間がかかりました。
例えばURLのパースにはURIを使い、外部APIを使うにはNet:HTTPを使い、メールの送信にはPonyかMailなどのgemを使用、viewのヘルパーもデフォルトでは便利なものが多くないので、Sinatra_moreのgemを引っ張ってくるという具合です。RSpecのテストをする際にもデフォルトではassignsやrender_templateなどの何気なく使用しているマッチャーも無く、カスタマイズが必要でした。メールの送信もあまりマニュアルが整備されていないgemを使う必要があり、コードを読みにいったりする必要がありました。
今回はいかにRoRが皆に支持されていろんな便利なツールを実装しているか知る良い機会になりました。それはそれでありがたい経験です。
Sinatraはとてもシンプルなのが好きで使っているのですが、少しやる事が複雑になると一つずつrequireを追加していく必要があります。フォームを設置する、外部APIを使用する、テストを書くという程度の制作になればSinatraではなくてRailsにしたほうがかなり時間を抑えて開発できるのではないでしょうか。小さな規模のサイトなのにかなり時間がかかりました。
例えばURLのパースにはURIを使い、外部APIを使うにはNet:HTTPを使い、メールの送信にはPonyかMailなどのgemを使用、viewのヘルパーもデフォルトでは便利なものが多くないので、Sinatra_moreのgemを引っ張ってくるという具合です。RSpecのテストをする際にもデフォルトではassignsやrender_templateなどの何気なく使用しているマッチャーも無く、カスタマイズが必要でした。メールの送信もあまりマニュアルが整備されていないgemを使う必要があり、コードを読みにいったりする必要がありました。
今回はいかにRoRが皆に支持されていろんな便利なツールを実装しているか知る良い機会になりました。それはそれでありがたい経験です。
Friday 26 October 2012
Google API Spreadsheetからjsonでデータを取得
Google API Spreadsheetからjsonでデータを取得しようとしてGoogleのドキュメントを見ていたのですが、なかなかドキュメントが見つかりませんでした。json形式でスプレッドシートの内容を取って来れる仕様は無くなってしまう方向なのかもしれませんね。下にjson形式でデータを取ってくる方法が書いてありました。
http://datatables.net/forums/discussion/5611/how-to-grab-datatables-data-from-a-google-spreadsheet/p1
現在jsonc形式もxmlもサポートされていないようです。Google Data API のjsonはパースすると$tなどなんだかわけの分からないキーを打たないといけないので、なんだか気持ちが悪いです。Google Calendarではjsonc形式が使えて、こちらはもっと人間フレンドリーなデータ構造になっていました。
http://datatables.net/forums/discussion/5611/how-to-grab-datatables-data-from-a-google-spreadsheet/p1
現在jsonc形式もxmlもサポートされていないようです。Google Data API のjsonはパースすると$tなどなんだかわけの分からないキーを打たないといけないので、なんだか気持ちが悪いです。Google Calendarではjsonc形式が使えて、こちらはもっと人間フレンドリーなデータ構造になっていました。
Wednesday 24 October 2012
Railsでたくさんページがあるサイトを作る時はパーツをwidget化すると便利ではないでしょうか？
apotomoというwidgetを表示するgemがありました。ページがたくさんあるサイトはサイドバーに幾つかのページで共通のwidgetがあるのが一般的ではないでしょうか？
できるだけコードを少なくして手間を少なくするのはプログラマーの一般的習性かと思います。viewのお掃除には勿論Railsのサブレイアウトを使う手段がありますが同時に、レイアウト間で共通に使用するアイテムはwidget化してしまうのも一つの手段です。
使い方は制作者のサイトにスクリーンキャストがあるので、見せてもらいました。
以下、全く本文とは関係無いトピックです。一つのスクリーンキャストを見終わった時に全然関係無いLinuxのスクリーンキャスト作成ツールを紹介するスクリーンキャストが出てきたのですが、このスクリーンキャストがまたスイートです。テック系でこんなスイートなスクリーンキャストを見る事ができるのは素晴らしいアイデアですね。ノックアウトという感じです…。
できるだけコードを少なくして手間を少なくするのはプログラマーの一般的習性かと思います。viewのお掃除には勿論Railsのサブレイアウトを使う手段がありますが同時に、レイアウト間で共通に使用するアイテムはwidget化してしまうのも一つの手段です。
使い方は制作者のサイトにスクリーンキャストがあるので、見せてもらいました。
以下、全く本文とは関係無いトピックです。一つのスクリーンキャストを見終わった時に全然関係無いLinuxのスクリーンキャスト作成ツールを紹介するスクリーンキャストが出てきたのですが、このスクリーンキャストがまたスイートです。テック系でこんなスイートなスクリーンキャストを見る事ができるのは素晴らしいアイデアですね。ノックアウトという感じです…。
Monday 22 October 2012
pry gem
pryというgemを今更ですが発見しました。**nixシステムのシェルみたいにrubyプロジェクトのフォルダやファイルを行ったり来たりしてクラスやメソッドを見れる助けをするライブラリのようです。https://vimeo.com/26391171にテンポ良く機能を紹介してくれるスクリーンキャストがあります。
pryでは例えば
pry(main) > require "hello_world"
pry(main) > ls HelloWorld
と打てばHelloWorldクラスのメソッドや変数を見せてくれます。また、
pry(main) > cd HelloWorld
と打てばHelloWorldクラスにcdしてくれるような挙動になり、
pry(HelloWorld) > ls
でHelloWorldクラスのメソッドや変数が見れます。また、
pry(HelloWorld) > show-method say_helloとすればメソッドのコードとファイルの場所が見れます。デバッグの時、テキストエディタの検索機能を駆使しなくても目的のコードに簡単にたどり着けそうです。
pryでは例えば
pry(main) > require "hello_world"
pry(main) > ls HelloWorld
と打てばHelloWorldクラスのメソッドや変数を見せてくれます。また、
pry(main) > cd HelloWorld
と打てばHelloWorldクラスにcdしてくれるような挙動になり、
pry(HelloWorld) > ls
でHelloWorldクラスのメソッドや変数が見れます。また、
pry(HelloWorld) > show-method say_helloとすればメソッドのコードとファイルの場所が見れます。デバッグの時、テキストエディタの検索機能を駆使しなくても目的のコードに簡単にたどり着けそうです。
Thursday 18 October 2012
sass 便利です
css extensionのsassをこれまた最近仕事で使う事になったのですが、便利ですし、おもしろいです。
sassでは変数が使えるので、ローカルファイルでいろいろ変数を使い回したり、グローバル変数を設定して@importで設定ファイルを読み込んだりと使い方ができます。ただRubyで使用する場合など、変数の設定はrequireでは読み込めないので、@importする必要があるようです。これはちょっと不便ですが…
OOPのようにcssを使う方法としてsassが使えます。
@extendがどちらかというと継承に使えるツールで、一番下のレイヤーcssを作っていく際など、下の様にまずプロトタイプを作ってクラスにさせて作成するというような事ができます。
%layer
width: 100%
#header, #contents, #footer
@extend %layer
機能追加をする Ruby でいうモジュールのような機能はミックスインで利用できます。例えばclearfixやしましまビジュアルをある要素に追加したいという場合はまずミックスインを定義してそれを要素にインクルードします。ミックスインの定義は下の様にします。
=clearfix
*zoom: 1
&:after
content: "."
display: block
clear: both
height: 0
visibility: hidden
このミックスインをインクルードしたい要素にインクルードします。
#header, #contents, #footer
+clearfix
以上が私としてはレイアウトの定義に使えるツールだったのですが、色や背景画像などのテーマを作成するにはどうしたら良いかと暫く悩んだのですが、結局関数の定義の機能を使用する事にしました。他に良いアイデアがあれば教えてほしいですね…
関数の定義は@functionを使って'whiteTheme'と'blackTheme'テーマのパーツ毎に引き出してくる形にしました。
@function themeParts( $scope, $theme: blackTheme )
$base_bg_color = #000
$base_font_color = #fff
@if $theme == whiteTheme
$base_bg_color = #fff
$base_font_color = #000
@if scope == base_bg_color
@return $base_bg_color
@if scope == base_font_color
@return $base_font_color
以上がテーマのパーツを選んでくる関数のベースで、これを実際のテーマに入れていきます。ここで@eachを使います。
@each $theme in blackTheme, whiteTheme
body.#{$theme}
background: themeParts(base_bg_color, $theme)
color: themeParts(base_font_color, $theme)
これでsassをコンパイルした時にbody.blackThemeとbody.whiteThemeのそれぞれのcssが作成されて、テーマ分けができます。随時背景画像やネストされたクラスなど同様に登録していきます。
sassは素のcssよりかなり機能が充実しているので、技に溺れて不要なツールを使いすぎてしまう可能性があるのですが、ちゃんと使えばかなりすっきりしたコードにリファクタリングできると思います。
皆さん楽しくsassを使ってみてください。
sassでは変数が使えるので、ローカルファイルでいろいろ変数を使い回したり、グローバル変数を設定して@importで設定ファイルを読み込んだりと使い方ができます。ただRubyで使用する場合など、変数の設定はrequireでは読み込めないので、@importする必要があるようです。これはちょっと不便ですが…
OOPのようにcssを使う方法としてsassが使えます。
@extendがどちらかというと継承に使えるツールで、一番下のレイヤーcssを作っていく際など、下の様にまずプロトタイプを作ってクラスにさせて作成するというような事ができます。
%layer
width: 100%
#header, #contents, #footer
@extend %layer
機能追加をする Ruby でいうモジュールのような機能はミックスインで利用できます。例えばclearfixやしましまビジュアルをある要素に追加したいという場合はまずミックスインを定義してそれを要素にインクルードします。ミックスインの定義は下の様にします。
=clearfix
*zoom: 1
&:after
content: "."
display: block
clear: both
height: 0
visibility: hidden
このミックスインをインクルードしたい要素にインクルードします。
#header, #contents, #footer
+clearfix
以上が私としてはレイアウトの定義に使えるツールだったのですが、色や背景画像などのテーマを作成するにはどうしたら良いかと暫く悩んだのですが、結局関数の定義の機能を使用する事にしました。他に良いアイデアがあれば教えてほしいですね…
関数の定義は@functionを使って'whiteTheme'と'blackTheme'テーマのパーツ毎に引き出してくる形にしました。
@function themeParts( $scope, $theme: blackTheme )
$base_bg_color = #000
$base_font_color = #fff
@if $theme == whiteTheme
$base_bg_color = #fff
$base_font_color = #000
@if scope == base_bg_color
@return $base_bg_color
@if scope == base_font_color
@return $base_font_color
以上がテーマのパーツを選んでくる関数のベースで、これを実際のテーマに入れていきます。ここで@eachを使います。
@each $theme in blackTheme, whiteTheme
body.#{$theme}
background: themeParts(base_bg_color, $theme)
color: themeParts(base_font_color, $theme)
これでsassをコンパイルした時にbody.blackThemeとbody.whiteThemeのそれぞれのcssが作成されて、テーマ分けができます。随時背景画像やネストされたクラスなど同様に登録していきます。
sassは素のcssよりかなり機能が充実しているので、技に溺れて不要なツールを使いすぎてしまう可能性があるのですが、ちゃんと使えばかなりすっきりしたコードにリファクタリングできると思います。
皆さん楽しくsassを使ってみてください。
Tuesday 16 October 2012
slim コメント方法
最近 Ruby テンプレートエンジンの slim を仕事で使い始めました。便利なのですが、困った事が一つありました。コメントをどうするか？です。
勿論本家マニュアルにはコメントの方法は書いてあるのですが、どうもうまくいきません。困って無量井さんに訊いたところ、コメントの "/" もインデント処理が有効という事でした。ということは
/ Comment
p Lorem ipsum
p dolor sit amet
とすると / Comment 以下の行が全部コメントになってしまいます。なので、コメント以下の行を有効にしようとすると下のようにしないといけないという事でした。
/ Comment
p Lorem ipsum
p dolor sit amet
そんな些細な事は本家のマニュアルには書いていないし…。困った方の参考になれば幸いです。
勿論本家マニュアルにはコメントの方法は書いてあるのですが、どうもうまくいきません。困って無量井さんに訊いたところ、コメントの "/" もインデント処理が有効という事でした。ということは
/ Comment
p Lorem ipsum
p dolor sit amet
とすると / Comment 以下の行が全部コメントになってしまいます。なので、コメント以下の行を有効にしようとすると下のようにしないといけないという事でした。
/ Comment
p Lorem ipsum
p dolor sit amet
そんな些細な事は本家のマニュアルには書いていないし…。困った方の参考になれば幸いです。
Saturday 6 October 2012
mongoid/MongHQ/Heroku設定
mongoid(3.1.0)/MongHQ/Heroku設定で少しはまりました。
Herokuのドキュメント上ではmongoid.ymlのファイルは下のように設定するのがおすすめと書かれていました。
このまま設定しようとするとうまく動きません。調べてみるとこれはyamlファイルのインデントの問題でした。下記のようにインデントを直すとうまくDBが繋がりました。
Heroku の上のドキュメントは多分多くの人が参照するので、MongoHQにドキュメントを修正するようにお願いして修正するという解答が来たのですが、今日の時点ではまだ修正されていない様ですね…。まあみんな忙しいですからね…。
Herokuのドキュメント上ではmongoid.ymlのファイルは下のように設定するのがおすすめと書かれていました。
production:
sessions:
default:
uri: <%= ENV['MONGOHQ_URL'] %>
options:
skip_version_check: true
safe: true
このまま設定しようとするとうまく動きません。調べてみるとこれはyamlファイルのインデントの問題でした。下記のようにインデントを直すとうまくDBが繋がりました。
production:
sessions:
default:
uri: <%= ENV['MONGOHQ_URL'] %>
options:
skip_version_check: true
safe: true
Heroku の上のドキュメントは多分多くの人が参照するので、MongoHQにドキュメントを修正するようにお願いして修正するという解答が来たのですが、今日の時点ではまだ修正されていない様ですね…。まあみんな忙しいですからね…。
Friday 5 October 2012
S3で静的ウェブサイト提供
３時間ほど前にAWSから"Amazon S3 Support for Web Page Redirects"というタイトルでメールが届きました。
なんでもS3で提供する静的ウェブサイトにリダイレクトの機能が追加されたとか。そもそも静的ウェブサイトをS3上で構築できるとは知らなかったです。わざわざHeroku+Sinatraで構築などしなくても良かったんですね…。S3上ならほぼ費用はほぼ無料に近いのではないでしょうか？
ただS3にはスピードには懸念があるので検証は必要ですね。
なんでもS3で提供する静的ウェブサイトにリダイレクトの機能が追加されたとか。そもそも静的ウェブサイトをS3上で構築できるとは知らなかったです。わざわざHeroku+Sinatraで構築などしなくても良かったんですね…。S3上ならほぼ費用はほぼ無料に近いのではないでしょうか？
ただS3にはスピードには懸念があるので検証は必要ですね。
さよならは新しい関係にこんにちは
ひたすら自分が納得できる仕事を追求したかったため、先月末で約１年間一緒に仕事をしてきたクライエントから離れました。最後まで刺激的な人たちと楽しく仕事ができました。この人たちはもっともっとビジネスで成功してほしいです。
リスクは大きいですが、私は安全な方法を取るよりは自分に嘘をつかないで現在考えられるベストな生き方をしていきたいと思います。現在はやりたかった事を試行錯誤しながらどんどん試しているところです。
さよならは新しい関係にこんにちは、になれば良いなと思います。
リスクは大きいですが、私は安全な方法を取るよりは自分に嘘をつかないで現在考えられるベストな生き方をしていきたいと思います。現在はやりたかった事を試行錯誤しながらどんどん試しているところです。
さよならは新しい関係にこんにちは、になれば良いなと思います。
OS X ハードディスクを初期状態に戻す
当初デザインの仕事が多くなると思いiMac 27インチを購入したのですが、結局RoRやRubyがメインの仕事になり、大きなスクリーンが必要である作業が最近ほぼ皆無になりました。ほとんど使わないで机の上に置いておくのはもったいないので、誰かに買取ってもらう事にしました。
日本でも日本語で中古品を個人で自分の責任で売買できるサービスというのは私はこれまで全然見つからなくて、英語で運営されているコミュニティー上で話が決まりました。TaSJ
さて、マックのHDDを初期状態に戻す方法ですが、まずiTunesStoreからマシンの登録削除をしておいた方が便利です。そのためにはiTunesを起動してStore（日本語のメニューの名前が分かりません…）メニューから"Deauthorize this computer"を選択。Appleのサイト（ここは英語）にも勿論ガイドはあります。
後は基本はアップルのサイトにあるリカバリーの機能を使います。データのバックアップを取った後、コンピュータを再起動してoptionキーを押しているとブートに使用するディスクを選択する画面が出てきます。
ここでリカバリーディスクを選択してブートし、まずHDDの内容を削除します。私はセキュリティー機能を使用してHDDにランダムな情報を３回ぐらい書き込む削除方法を選択したためにデータの削除だけで１１時間かかりました。このリカバリーディスクにはOSのデータが入っているのでしょうか？リカバリーディスクの内容は削除できないようなので、結構便利に使用できます。さすが考えられているなと思います。
HDDの内容の削除を行うと、次にOSXを再インストールボタンでOSXを入れ直します。インストールができたらCommand + Qを押して設定せずに終了すると次回起動した時に初期設定のムービーが流れます。
日本でも日本語で中古品を個人で自分の責任で売買できるサービスというのは私はこれまで全然見つからなくて、英語で運営されているコミュニティー上で話が決まりました。TaSJ
さて、マックのHDDを初期状態に戻す方法ですが、まずiTunesStoreからマシンの登録削除をしておいた方が便利です。そのためにはiTunesを起動してStore（日本語のメニューの名前が分かりません…）メニューから"Deauthorize this computer"を選択。Appleのサイト（ここは英語）にも勿論ガイドはあります。
後は基本はアップルのサイトにあるリカバリーの機能を使います。データのバックアップを取った後、コンピュータを再起動してoptionキーを押しているとブートに使用するディスクを選択する画面が出てきます。
ここでリカバリーディスクを選択してブートし、まずHDDの内容を削除します。私はセキュリティー機能を使用してHDDにランダムな情報を３回ぐらい書き込む削除方法を選択したためにデータの削除だけで１１時間かかりました。このリカバリーディスクにはOSのデータが入っているのでしょうか？リカバリーディスクの内容は削除できないようなので、結構便利に使用できます。さすが考えられているなと思います。
HDDの内容の削除を行うと、次にOSXを再インストールボタンでOSXを入れ直します。インストールができたらCommand + Qを押して設定せずに終了すると次回起動した時に初期設定のムービーが流れます。
Subscribe to:
Posts (Atom)