tDiaryをunicornで動かす

このブログで使っているtDiaryを最新版に上げた上でunicornで動くように設定した。

表示時間が平均2000~3000msくらいだったのが200~300msになった。

ちょっぱやである。

最終更新時刻: 2016年05月19日

tDiaryにDISQUSのコメント欄をつけた

このブログ(tDiary)にDISQUSのコメント欄をつけました。

そのためのプラグイン、disqus.rb作りました。

テストコメントでもいいのでコメント頂けると助かります。

# 既存ツッコミフォームを非表示にする
@conf.hide_comment_form = true

def permalink( date, index = nil, escape = true )
        ymd = date.strftime( "%Y%m%d" )
        uri = @conf.index.dup
        uri.sub!( %r|\A(?!https?://)|i, @conf.base_url )
        uri.gsub!( %r|/\.(?=/)|, "" ) # /././ -> /
        link = uri + anchor( "#{ymd}p%02d" % index )
        link.sub!( "#", "%23" ) if escape
        link
end

def disqus_form(date)
        return '' if feed?

        r = <<-HTML
<div id="disqus_thread"></div>
<script>
var disqus_config = function () {
this.page.url = '#{permalink(date, index, false)}'; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = '#{permalink(date, index, false)}'; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
};
(function() { // DON'T EDIT BELOW THIS LINE
var d = document, s = d.createElement('script');

s.src = '//pc-memo.disqus.com/embed.js';

s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
        HTML

end

add_body_leave_proc do |date|
        if @mode=='day' then disqus_form(date) end
end

add_header_proc do
        # 既存ツッコミフォームを非表示にする
        r = <<-HTML
<style>
.comment{
  display: none;
}
</style>
        HTML
end
最終更新時刻: 2016年05月07日

DockerでWordPressをあっという間に立てる

まずはdocker本体をインストール。環境はCentOS 6.7。

$ sudo yum install docker-io
$ sudo docker -v

ここで間違えて「docker-io」パッケージではなく「docker」パッケージをインストールしてしまうとdockerコマンドを実行した時に下記エラーが出る。 同じパッケージ名だが別物らしいので非常に紛らわしい。

Segmentation Fault or Critical Error encountered. Dumping core and aborting.

次にdockerサービスを登録して起動する。

$ sudo chkconfig docker on
$ sudo service docker start

dockerイメージをイメージをダウンロード。

$ sudo docker pull tutum/wordpress

次にコンテナを起動する。-p でポートを「外部からアクセスされるポート:コンテナ側のポート番号」の順に指定する。

$ sudo docker run -d -p 3000:80 --name wordpress tutum/wordpress

下記スライドを参考にしました。

http://www.slideshare.net/mookjp/dockerword-press

最終更新時刻: 2016年05月07日

ブログを始めた理由とtDiaryを使って得たもの

本日(2016.4.23)はこのブログで2003年から現在まで使っている日記システム「tDiary」の15周年記念パーティに参加しました。

http://eventdots.jp/event/580813

自己紹介も兼ねてLTしました。発表資料は下記です。このブログで先日書いたbootstrapに関する内容を話しました。

http://bit.ly/tdiary15th

この機会に、私がブログを書くことになった理由と、tDiaryを使うことで得たものを書き留めておきたいと思います。

当時、就職を考えていた私は以下の理由からブログを書くことを決めました。

  • 文章力の向上
  • 自己アピール
  • 技術情報のメモ

まず「文章力の向上」。これは会社に入ったら必要になるであろう文章力を磨くためには普段から人に見られる文章を書くことが最善であると考えました。文章力については現在も課題です。。。

次に「自己アピール」。就職先の企業の方が読んでくれるかもしれない。当時大手への就職をあまり考えておらず、実際ベンチャーに入った際には社長が私のブログを読んで頂いたようです。決め手になったかどうかはわかりませんが、アピールの一つとなったのだと思います。

最後に「技術情報のメモ」。当時からインフラ構築やコードを書いたりしていたのですが、その情報を書き留めて後から参照したいと思っていました。実際、「あーこれどうやるんだっけ」とググった際に昔自分が書いた記事が出てきて「当時の自分グッジョブ!」となったりします。

そして、当時は想定していなかったけれど、tDiaryを使ったことで貴重な経験ができました。

それは「オープンソースコミュニティへの参加」という経験です。

例えば不具合と思われる内容があったら、コミュニティのメーリングリストで相談するとそれに対してレスポンスがもらえて、そのまま不具合が修正される。欲しいプラグインがあったら自分でコードを書いてGitHubでプルリクエストを出して本体に取り込んでもらう。というやり取りは私にとってtDiaryが初めてでした。

以上が、ブログを始めた理由と、tDiaryを使うことによって得たもの(経験)です。

最終更新時刻: 2016年04月24日

CartoDBのインストールではまったポイント

基本的には下記インストールマニュアルに書いてある通りに進んでいけばいいんだけど、いくつかはまるポイントがある。

http://cartodb.readthedocs.org/en/latest/install.html

まず初めにapt-get updateしておく。これをしないと最初のapt-getで失敗する。

sudo apt-get update

次に、要所要所でsudoで実行するにあたって、rubyやgemのパスが通ってなくてエラーとなる場合がある。これはsudoの基本設定がPATHを引き継がない設定になっているため。visudoを実行し、/etc/sudoersファイルを下記のように書き換えておく。

#Defaults       env_reset
#Defaults       secure_path="/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:$
Defaults        env_keep += "PATH CPLUS_INCLUDE_PATH C_INCLUDE_PATH"

次に、nodeをインストール(sudo apt-get install nodejs)した直後に、npmをアップデートしておかないと、以降のnpmコマンドで失敗する。

sudo npm install npm -g

途中、rake db:migrateする箇所では、先にdb:createしないと失敗する。また、db:setup_userも失敗するが、こちらは失敗しても問題ないので飛ばす。

RAILS_ENV=development bundle exec rake db:create

また同じくPostgreSQLのインストールチェック(下記コマンド)も失敗するが気にしないことにした。

sudo PGUSER=postgres make installcheck # to run tests

一通りインストールが終わったあと、CartoDB-SQL-APIの設定ファイル(CartoDB-SQL-API/config/environments/development.js)を下記のように書き換える。

module.exports.node_host    = '';

同じくWindshaft-cartodbの設定ファイル(Windshaft-cartodb/config/environments/development.js)の最初の方を書き換える。

,host: ''

この2つの設定ファイル書き換えをしておかないと、CartoDB Editorは起動するけどエラーでデータ表示ができないので注意。

それから、CartoDB Editorの設定ファイル(cartodb/config/app_config.yml)のうち、「localhost.lan」となっている箇所をひとまずサーバのIPアドレスに変更する。

これもやっておかないと同じくエラーでデータ表示できない。

更にサブドメインレス運用するために下記も書き換える。

subdomainless_urls: true

最後に、起動コマンドは下記のように標準出力と標準エラー出力を/dev/nullに出力したうえで、バックグラウンド実行させるようにすると良い。

cd ~/cartodb
bundle exec script/resque > /dev/null 2>&1 &
bundle exec thin start --threaded -p 3000 --threadpool-size 5 > /dev/null 2>&1 &
cd ../CartoDB-SQL-API/
node app.js development >/dev/null 2>&1 &
cd ../Windshaft-cartodb/
node app.js development >/dev/null 2>&1 &

以上、ざっとはまりそうな箇所でした。

最終更新時刻: 2016年05月30日

MacでSJISネイティブ対応のエディタを探してみた

Macでお手軽にSJISとUTF-8を変換するために、ネイティブ(プラグイン等を入れる必要がない)でSJIS対応してるエディタを探してみた。

結果、SJISネイティブ対応であることを確認できたのは下記4つ。

今回の目的は国内オープンデータのCSVデータ(大半がSJIS)をUTF-8に変換するためのツールを非エンジニアに紹介することなので、CotEditorがシンプルで良さそう。

SJISネイティブ非対応であることを確認したのは下記3つ。

この調査をするまで「時代はAtomだよね」って思ってたけど、数1000行程度のCSV読み込んでエンコーディング変換しようとしただけで固まることが判明したので一旦、Sublime Textをデフォルトエディタにした。

Windows環境でxyzzy使って数十MBのログファイルをさくっと開けることに慣れてる身としてはAtomの挙動に耐えられない。用途が異なることは知っているが、xyzzyが万能すぎる。

MacVIMも良さそうなので要調査。Macでもxyzzy動けばいいのに。

掲載したエディタは本日(2016.3.2)時点の最新安定版を入れて調査しました。

最終更新時刻: 2016年03月03日

E2D3の開発環境を整えた(Windows編)

ExcelでJavaScriptを使ったインタラクティブなグラフを表示することができる「E2D3」というツールがあります。

E2D3公式サイト

このメモの目的は、E2D3上の新しいグラフの開発やグラフのカスタマイズをするための環境づくりの備忘録です。

本記事の内容は下記公式ドキュメントを参考にしています。非常にわかりやすいドキュメントです。

Excel上に挿入したE2D3およびグラフは、E2D3が用意したWebサーバにアクセスすることで表示されています。

開発する際は、E2D3が参照するWebサーバをローカルの開発用簡易Webサーバに切替え、ローカルのグラフのソースコード(E2D3ではテンプレートと呼んでいます)を書き換えることで開発していくことになります。

開発用簡易Webサーバはnode.jsで稼働します。よって、まずはnode.jsをダウンロードしインストールします。

今回は下記ファイルをインストールしました。

https://nodejs.org/dist/v5.6.0/node-v5.6.0-x86.msi

次にコマンドプロンプトを開きnpmコマンドを使って開発用簡易Webサーバをインストールします。

> npm install -g e2d3

次に、グラフのソースコードをGitHubからcloneしてきます。

git clone https://github.com/e2d3/e2d3-contrib.git

上記では本家のリポジトリから直接cloneしていますが、私の場合はPull Requestを送りたいので自分のGitHubアカウントにforkしてからcloneしました。

ソースコードがダウンロードできたら、cloneしたフォルダに移動しe2d3コマンドを実行(Webサーバを起動)します。

> cd e2d3-contrib
> e2d3

するとブラウザが起動し、e2d3のグラフ画面が起動され、開発用簡易Webサーバ上で稼働するE2D3が表示されます。

この際、開発用簡易WebサーバはデフォルトでHTTP通信を8000ポート、HTTPS通信を8443ポートで待ち受けます。

Excel上のE2D3からはHTTPSで通信する必要があるため、ブラウザでhttps://localhost:8443にアクセスし、証明書の使用を許可しておく必要があります。毎回この作業を行うのは面倒なので証明書をインポートしておくと良いと思います。

証明書の認証が済んだら、Excel上でE2D3を立ち上げ、CTRLキーを5回連打することで表示される「Go into delegate mode」のボタンを押下します。

すると、E2D3のWebサーバにアクセスするのではなく、さきほど立ち上げたローカルの開発用簡易Webサーバの内容が表示されるようになります。

以上で、ローカルのテンプレートをガシガシ書き換えて、E2D3で確認、デバッグ事が可能になります。

テンプレートを書き換えて、本家に取り込んでもらう流れは公式ドキュメントの下記に記載されています。

https://github.com/e2d3/e2d3/wiki/Adding-your-template-to-E2D3_ja

最終更新時刻: 2016年02月17日

スマート鳩時計の作り方(スマート鳩時計の紹介&サーボモータ制御編)

このブログはmyThings Advent Calendar 2015の8日目の記事です。

本記事はmyThingsを使った「スマート鳩時計」の紹介と、最も重要な機能である「鳩を動かす」ためのサーボモータの制御について記載します。

Raspberry PIの基本的な操作は割愛します。ご容赦ください。

Read more...

最終更新時刻: 2015年12月08日

このブログのデザインを変更した

bootstrapを使ったテーマに変更した。

テーマ

bootstrap-sassをちょこっとカスタマイズして作成した。手順は以下。

まずはbootstrap-sassをダウンロード。

https://github.com/twbs/bootstrap-sass/archive/v3.3.6.tar.gz

解凍したファイルの /assets/stylesheets/_variables.scss の下記行を書き換え。

$font-size-base:          16px !default;
$line-height-base:        1.8 !default; // 20/14
$font-family-base:        Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif, $font-family-sans-serif !default;
$font-size-h1:            floor(($font-size-base * 1.4)) !default;
$font-size-h2:            floor(($font-size-base * 1.4)) !default;
$font-size-h3:            ceil(($font-size-base * 1.2)) !default;
$font-size-h4:            ceil(($font-size-base * 1.1)) !default;

/my.scss を新規ファイルとして作成してtDiary用に書き換える。

@import "_bootstrap.scss";

div.lm {
  text-align: right;
}

span.lm {
  @extend .label;
  @extend .label-default;
}

.comment{
  @extend .panel;
  @extend .panel-info;
}

.caption {
  @extend .panel-heading;
}

.commentshort {
  @extend .panel-body;
}

body {
  padding-top: 70px;
}

h1, h2, h3, h4 {
  font-weight: bold;
}

p {
  word-break: break-all;
}

.footer
{
  @extend .text-right;
}

body.update {
  padding-top: 1em;
}

body.update div.whole-content
{
  @extend .container-fluid;
}

body.update div.title
{
  @extend .form-group;
}

body.update div.title input
{
  @extend .form-control;
}

body.update div.textarea textarea
{
  @extend .form-control;
}

body.update button,
body.update span.button input
{
  @extend .btn;
  @extend .btn-primary;
}

body.update h1,
body.update h2,
body.update h3
{
  @extend .hidden;
}

sassをインストールしてmy.scssをコンパイルする。

$ sudo gem install sass
$ sass my.scss:my.css

出来上がったmy.cssをtDiaryの/theme/my/my.cssとして設置して完了。

最終更新時刻: 2016年04月24日

tDiaryを久しぶりにバージョンアップした

tDiary 3.1.0から、一気に最新版の4.1.2にバージョンアップ。

ruby 1.9.xからruby 2.2.2にバージョンアップしたり、gem install bundleとか色々やった気がする。

あと、ヘッダの広告がうざかったのでとりあえずフッタに移動させた。

最終更新時刻: 2015年05月31日