35
33

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Ruby】SinatraをVagrantに速攻構築。全部コピペで出来るようにしました。

Last updated at Posted at 2015-09-16

#Sinatraとは?
SinatraとはRubyフレームワークのひとつです。
RubyのフレームワークといえばRuby On Railsが有名ですが、
Sinatraフレームワークは「とにかく軽量」「さっくと始める」事に特化しています。
何が良いかというと、とにかくroutingが楽です。

詳しくは
https://ja.wikipedia.org/wiki/Sinatra
http://www.sinatrarb.com/intro-ja.html
辺りを参考にして頂けるとわかりやすいかと思います。

また今回は、Slim, CoffeScript, Sassをテンプレートにして構築していきます。
OSはCentOS65を使用します。

#Vagrantの準備
##プロジェクトディレクトリ作成, Vagarntの初期化
本記事はDesktopに作成

shell
$ cd ~/Desktop 
$ mkdir sinatra
$ cd sinatra
$ vagrant init

##Vagrantfile書き換え
Vagrantfileが生成させています。開くと色々書いてありますが、全部消して 下記をコピペしてください。

Vagrantfile
# -*- mode: ruby -*-
# vi: set ft=ruby :
VAGRANTFILE_API_VERSION = "2"

Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
  config.vm.box = "https://github.com/2creatives/vagrant-centos/releases/download/v6.5.3/centos65-x86_64-20140116.box"
  config.ssh.forward_agent = true
  # config.vm.synced_folder "./", "/vagrant", nfs: true
  config.vm.network :private_network, ip:"192.168.33.33"
  config.vm.provider :virtualbox do |vb|
    vb.customize ["modifyvm", :id, "--natdnsproxy1", "off"]
    vb.customize ["modifyvm", :id, "--natdnshostresolver1", "off"]
  end
end

コピペしたら保存します。

##Vagrantの起動、ログイン
下記コマンドでVagrantの起動、ログインします。

shell
$ vagrant up
$ vagrant ssh

ログインが完了したら、下記コマンドで諸々インストールします。

shell
$ sudo yum update
$ sudo yum install wget vim
$ sudo yum -y install curl-devel libffi-devel expat-devel gettext-devel openssl-devel zlib-devel perl-ExtUtils-MakeMaker 
$ sudo yum -y install libxslt-devel libxml2-devel sqlite-devel
$ sudo yum -y install gcc gcc-c++
$ sudo yum -y groupinstall "Development Tools"
$ sudo yum -y install readline-devel

gitのアップデート

shell
$ cd
$ wget https://www.kernel.org/pub/software/scm/git/git-2.5.0.tar.gz
$ tar zxvf git-2.5.0.tar.gz
$ cd git-*
$ ./configure --prefix=/usr/local
$ make
$ sudo make install
$ which git 
$ git --version

#rbenvでRuby, Bundlerのインストール
準備が整ったらRubyをインストールします。下記コマンドでRubyをインストールしてください。

Rubyのインストール

shell
$ git clone https://github.com/sstephenson/rbenv.git ~/.rbenv
$ git clone https://github.com/sstephenson/ruby-build.git ~/.rbenv/plugins/ruby-build

$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bash_profile
$ echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
$ exec $SHELL -l

$ rbenv install 2.2.1 #安定版インストール。少し時間がかかります。
$ rbenv global 2.2.1
$ which ruby
$ which gem
$ ruby -v
$ gem -v

Bundlerのインストール

shell
$ rbenv exec gem install bundler
$ rbenv rehash
$ which bundler # ~/.rbenv/配下に入る
$ bundler -v
$ gem list bundler

#sinatraプロジェクトの作成
bundlerのインストールが終わったので、いよいよsinatraを入れていきます。

##作業ディレクトリの作成

shell
$ cd /vagrant
$ mkdir sinatra #ディレクトリ名は任意に変更してください
$ cd sinatra

##Bundlerの初期化, Gemのインストール

shell
$ bundle init

上記コマンドでVagrantfileが生成させています。開くと色々書いてありますが、全部消して 下記をコピペしてください。

Gemfile
source 'https://rubygems.org'

gem 'sinatra'
gem 'sinatra-contrib'
gem 'sass'
gem 'slim'
gem 'coffee-script'
gem 'therubyracer'

group :develoopment do
  gem 'shotgun'
  gem 'thin'
end

保存が完了したら下記コマンドでGemをインストールします。

shell
$ bundle install --path vendor/bundle

Gemのインストールが完了しました。

#sinatrateのテンプレート作成
ここまで来たらとは自分の作業しやすいようにゴリゴリディレクトリ等を作っていくだけです!
僕は下記のようにディレクトリ、ファイルを配置してみました。

sinatra
sinatra/
 ├ app.rb
 ├ assets/
 │ └ js/
 │ └ scss/
 ├ config.ru # sinatra起動時に一番最初に呼ばれる
 ├ Gemfile
 ├ Gemfile.lock
 ├ Vendor/
 ├ views/
 │ └ index.slim

こんな感じです。app.rb, config.ruは必須です。
viewsにhtml系を、assetsにjsやscssを格納するようにしました。(ここらへんは作業しやすいように変更も大丈夫です)

##app.rb, config.ruの設定
上記で作成した、app.rb, config.ruを編集します。
config.ru ・・・sinatra起動時に一番最初に呼び出せれるファイル。ここでapp.rbを呼び出すようにしてます。
app.rb ・・・ Controllerの役割をします。ここでroutingの設定をおこないます。

config.ru

config.ru
require 'bundler'
Bundler.setup
require File.expand_path(File.join('..','app'), __FILE__)
run App

app.rb

app.rb
require 'sinatra/base'
require 'sinatra/reloader'
require 'slim'
require 'sass'
require 'coffee-script'

class App < Sinatra::Base
  configure :development do
    register Sinatra::Reloader
  end

  # routingの設定
  get '/' do
    slim :index
  end
end

#sinatraの起動
下記コマンドでsinatraを起動します。

shell
$ bundle exec shotgun --server=thin --port=3000 -o 192.168.33.33

最後にブラウザに
**http://192.168.33.33:3000/**アクセスして結果を確認しましょう!
下記図のようにhelloworldが出れば大成功です!!
192_168_33_33_3000.png

お疲れ様でした!以上がVagrantにsinatra開発環境作成手順になります!
Railsより簡単に作業を始められるので小さめのプロジェクトにおすすめですね!

#おまけ
##nfsをONにして読み込み速度高速化
Vagrantfileの下記コメントを外す

Vagrantfile
config.vm.synced_folder "./", "/vagrant", nfs: true

#参考
http://cu39.hateblo.jp/entry/2013/07/02/183935
http://qiita.com/mochizukikotaro/items/f6f7ac94576728cd0f2a
http://qiita.com/mochizukikotaro/items/970e69b0217eeb790752

35
33
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
35
33

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?