Sinatraで画像ファイルを扱う

画像ファイルやcssファイル等、静的ファイルはpublicフォルダに入れておけばいい。

そのファイルを指定するときは、public/hoge.png、ではなく /hoge.png で指定できる。

さくらのVPS上にgitのリモートリポジトリを作る

myatsumoto先生、shokai先生に感謝

リモート

% mkdir git/hogehoge.git
% cd git/hogehoge.git
% git init --bare

ローカル

% mkdir hoge
% cd hoge
% git init
% touch README
% git add .
% git commit -m "initial"
% git remote add origin ssh://ユーザ@ムニャムニャ.sakura.ne.jp:ポート番号/home/user/git/hogehoge.git
% git push origin master

VPS上で作業したいときもリポジトリからcloneとかpullとかしてやるってことを理解するまで時間かかった。疲れた。

【Ubuntu】さくらのVPSでSinatraを動かす

Ubuntuにしてrvmが入ってなかったので入れる。

参考:さくらのVPSにRVM、Rubyをインストール


sinatraをインストール

% gem install sinatra

そして以下を参考に

さくらのVPSでsinatraを動かすまでのメモ

さくらのVPSでゼロからubuntuとrailsでなんか動かす 6 apache + passenger

% gem install passenger
% passenger-install-apache2-module

したら、何か色々インストールしろという指示が出たのでaptitude installしてもっかいやってみたけどインストールしろしろと言ってくる。

よくみたらNot Foundになってるものがあってインストールできてなかった。

aptitude updateしてから再度aptitude installしたらできた。

sudo emacs /etc/apache2/conf.d/passenger

して以下を追加

LoadModule passenger_module /home/ユーザ/.rvm/gems/ruby-1.8.7-p334/gems/passenger-3.0.3/ext/apache2/mod_passenger.so
PassengerRoot /home/ユーザ/.rvm/gems/ruby-1.8.7-p334/gems/passenger-3.0.3
PassengerRuby /home/ユーザ/.rvm/wrappers/ruby-1.8.7-p334/ruby

ファイル名はpassengerじゃなくてもいい。なんでもいいらしい。

Sinatraアプリケーションのフォルダ、例えばsinatrappって名前のフォルダの中に、config.ru、myapp.rb、publicフォルダ、tmpフォルダを作成する。

config.ruの中身は適当にこんな感じ

require 'myapp'

run Sinatra::Application

myapp.rb

require 'rubygems'
require 'sinatra'

get '/' do
'Hello, world.'
end

さっきの /etc/apache2/conf.d/passenger に

RackBaseURI /sinatrapp

って加える。

そしてDocument Rootにシンボリックリンクを貼る。

% sudo ln -s /home/ユーザ/sinatrapp/public /var/www/sinatrapp

apacheを再起動するともう動いてる。

% sudo /etc/init.d/apache2 restart

相変わらずshokaiさんのブログも激しく役に立った。
[Ubuntu][MAG][Passenger][Sinatra][Apache2]passengerでsinatraアプリをサブディレクトリで実行する

【Ubuntu】さくらのVPSにzshをインストール

$ sudo aptitude install zsh

$ chsh

で、

/usr/bin/zsh

を入力

zshrcファイルが無いけどどうする？みたいなことを３択で聞かれるので、作るなり作らないなり好きにする(僕はとりあえず作るだけ作ってその画面が出ないようにするってのを選んだ)。

ちょっと疲れた。

【Ubuntu】さくらのVPSにapacheをインストールして動かす

参考:『さくらのVPS』でWordPressを動かすまで – Apache2のインストール①

$ sudo aptitude install apache2

でインストール。

/etc/apache2/conf.d/security を以下のように修正

-ServerTokens Full
+ServerTokens Prod

-ServerSignature On
+ServerSignature Off

-TraceEnable On
+TraceEnable Off

設定を反映して再起動

$ sudo /etc/init.d/apache2 reload
$ sudo /etc/init.d/apache2 restart

これで動いてるはずと思ってアクセスしてみたら動いてない。
ファイアウォールの設定の問題だった。

$ sudo ufw allow 80

して、もっかいアクセスしてみたらIt works!

さくらのVPSにUbuntu 10.04をインストールした

カスタムOSインストールガイド ： Ubuntu 10.04

の通りにやればいいだけのはずだったのだが、VNCコンソールが一向に開かなくて困った。

結局Firefox4 betaとChromeがいけなかったのかなんなのか、Safariでやったら普通にVNCコンソールが開いてインストール出来た。

インストールした後は

さくらVPSにカスタムOSのUbuntu 10.04をインストール+セキュリティ設定などをした時のメモ

を参考にしてセキュリティ関係を簡単に設定。

myatsumotoの勧めで、今後はaptitudeを使うことにした。

さくらのVPSにRVM、Rubyをインストール

RVMのインストール。

% bash < <( curl http://rvm.beginrescueend.com/releases/rvm-install-head )

そしてPATHを通す。

% emacs .zshrc

[[ -s "$HOME/.rvm/scripts/rvm" ]] && source "$HOME/.rvm/scripts/rvm"

% source .zshrc

Rubyをインストールする前に依存ライブラリをインストール

% sudo yum install -y gcc-c++ patch readline readline-devel zlib zlib-devel libyaml-devel libffi-devel openssl-devel

そしてRubyのインストール。1.8.7と1.9.2をインストールして1.8.7をデフォルトに設定した。

% rvm install 1.8.7
% rvm install 1.9.2
% rvm use 1.8.7 --default

さくらのVPSにemacs、zsh、Git、tigをインストール

viに慣れるのもいいかと思ってたんだけど、やっぱり煩わしいことが多いので

% sudo yum install emacs

でemacsをインストール。

zshのインストールは

• さくらのVPSサーバー構築メモ – vim, zsh, gitをインストール

を参考に(というかほぼ丸写し)して

% sudo yum -y install zsh

% emacs ~/.bash_profile

# use zsh
if [ -f /bin/zsh ]; then
exec /bin/zsh
fi

zshrcもとりあえずはコピペ

% emacs ~/.zshrc

#
# alias設定
#

# 基本的なこと
alias ls='ls -AF'
alias ll='ls -l'
alias df="df -h"
alias du="du -h"

# vim関連
alias vi=vim

# 検索を便利にする
alias rgrep="grep -R"
alias rgrepsvn="rgrep --exclude=\"*.svn*\""

#
# zsh的な設定
#

## 補完時に大小文字を区別しない
zstyle ':completion:*' matcher-list 'm:{a-z}={A-Z}'
zstyle ':completion:*' menu select=1

autoload -U compinit && compinit

## options
setopt bash_auto_list
setopt list_ambiguous
setopt list_packed # つめて表示されるようになる
setopt correct # コマンドの間違いを自動修正
setopt auto_pushd # 自動でディレクトリをPUSH
setopt nolistbeep # beep音を鳴らさない

## history
HISTFILE="$HOME/.zsh_history"
HISTSIZE=10000
SAVEHIST=10000
setopt hist_ignore_all_dups
setopt hist_reduce_blanks
setopt share_history

# emacs
bindkey -e

続いてGitのインストール

参考:

• さくらVPSにLAMP環境を整えてみる。
• さくらVPS設定その3 Git+Ruby+Gem+Rails+Passenger

% rpm -ivh http://repo.webtatic.com/yum/centos/5/`uname -i`/webtatic-release-5-1.noarch.rpm

したら

can’t create transaction lock on /var/lib/rpm/__db.000

とかいうエラーが出た。

rootでやらないといけないってことらしいので、

% su -

してもっかいやったらできた。

で、

% sudo yum install --enablerepo=webtatic git

そしてtigをインストール

% yum install ncurses-devel.`uname -i` -y
% cd /tmp
% wget http://jonas.nitro.dk/tig/releases/tig-0.16.2.tar.gz
% tar -zxvf tig-0.16.2.tar.gz
% cd tig-0.16.2/
% ./configure
% make
% make install
% cd ../
% rm -rf tig-0.16.2.tar.gz
% rm -rf tig-0.16.2

おしまい。

CUIのGitブラウザ、tigをインストール

最近はTowerを使うことが多いのですが、興味がわいたのでCUIのGitブラウザ「tig」をインストールしました。

sudo port install tig

インストールの参考にしたのはこっち

• gitをブラウズするのに最適な「tig」をMacportsから入れてみた

使い方の参考はこっち

• CUI な Git ブラウザ tig を入れてみた

さくらVPSの初期設定

さくらVPSに登録して、見よう見真似で諸々の設定をした。

主に参考にしたのは以下のページ

さくらVPS設定その1 User+SSH+Firewall

↑ここに書いてあることをひと通りやれば大体必要なことはできてるっぽい。

他にも、色んなところで参考にされてるさくらのVPS｜アカベコマイリとかも見ながらいじってみてる。

CSSのiframeを二つ並べて、スクロールを連動させる

CSSで擬似iframeを作成するには

とかやってやると


こんな感じになる。

aaa

これを左寄せで二つ並べるには


でこんな風に。

aaa

bbb

僕が使う都合上、左はoverflow:hiddenにして、右のフレームにしかスクロールバーが出ないようにしている。



右のスクロールバーを動かすと両方のフレームが連動してスクロールされるようにするにはjQueryを使ってこう書く。


#migiでscrollイベントが起こったら、#hidariのscrollTopを#migiのscrollTopと同じところまでスクロールする。

ってことをしている。
上のサンプルもちゃんと連動してスクロールされるはず。

MacのSafari, Firefox, Google Chrome, Opera,あとiPhoneのmobileSafari(二本指スクロール)で動作確認した。