初めに
ruby on railsでbootstrapを使ってデザインを整えることがある
そのさいいつも適当にコピペして作っていたのでgemで最初に簡単なbootstrapデザインを実装出来たらよいのではないかということで作ってみる
ちなみに
今回はとりあえず動けばよいということで機能は後々追加していくことにする
gemパッケージ作成
とりあえずgemパッケージを作成するには
gem install bundler
bundle gem gemname -b
でとりあえずファイルが作られる
gemspec編集
このあとgemspecを編集する
最初はこんな感じになっている
lib = File.expand_path("../lib", __FILE__)
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
require "gemname/version"
Gem::Specification.new do |spec|
spec.name = "gemname"
spec.version = Gemname::VERSION
spec.authors = ["sibakenY"]
spec.email = ["sibakoro.919@gmail.com"]
spec.summary = %q{TODO: Write a short summary, because RubyGems requires one.}
spec.description = %q{TODO: Write a longer description or delete this line.}
spec.homepage = "TODO: Put your gem's website or public repo URL here."
# Prevent pushing this gem to RubyGems.org. To allow pushes either set the 'allowed_push_host'
# to allow pushing to a single host or delete this section to allow pushing to any host.
if spec.respond_to?(:metadata)
spec.metadata["allowed_push_host"] = "TODO: Set to 'http://mygemserver.com'"
spec.metadata["homepage_uri"] = spec.homepage
spec.metadata["source_code_uri"] = "TODO: Put your gem's public repo URL here."
spec.metadata["changelog_uri"] = "TODO: Put your gem's CHANGELOG.md URL here."
else
raise "RubyGems 2.0 or newer is required to protect against " \
"public gem pushes."
end
# Specify which files should be added to the gem when it is released.
# The `git ls-files -z` loads the files in the RubyGem that have been added into git.
spec.files = Dir.chdir(File.expand_path('..', __FILE__)) do
`git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
end
spec.bindir = "exe"
spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
spec.require_paths = ["lib"]
spec.add_development_dependency "bundler", "~> 1.17"
spec.add_development_dependency "rake", "~> 10.0"
end
これのTODOって書いてあるところは編集しておかないとエラーが出てしまう。
とりあえず適当に編集してそのあとlibのなかにある***.rbってファイルにいろいろ書く
とりあえず今回はapp/views/layoutsのapplication.html.erbを編集してbootstrapでそこそこきれいに見えるようheaderとfooterを追加して<%= yield %>のところを.containerでくくりたいと思う。
完成したコードがこんな感じ
require "b_format/version"
require 'boot_format_erb.rb'
module BFormat
class Error < StandardError; end
def self.bformat
@directory_all = []
Dir.chdir 'app/views' do
@directory_all << Dir.glob("*")
end
@directory_all.flatten!
@directory_all.each do |name|
if name == "layouts"
Dir.chdir 'app/views/layouts'
File.open '_header.html.erb', "w" do |file|
file.write APPLICATION_HTML_BOOT_HEADER
end
File.open '_footer.html.erb', "w" do |file|
file.write APPLICATION_HTML_BOOT_FOOTER
end
File.open 'application.html.erb', "r" do |file|
@data = file.read
@data.gsub!("<%= yield %>", APPLICATION_HTML_BOOT_BODY)
end
File.open 'application.html.erb', "w" do |file|
file.write @data
end
end
end
end
end
@directory_allはviewsの中にあるディレクトリを入れるもので後々の機能としてlayouts以外のものにもいろいろ手を加えるようにしたいから作った。
今回は用なし…
Dir.chdir 'app/views/layouts'
で現在のディレクトリをlayoutsにして、そこから
File.open '_header.html.erb', "w" do |file|
file.write APPLICATION_HTML_BOOT_HEADER
end
File.open '_footer.html.erb', "w" do |file|
file.write APPLICATION_HTML_BOOT_FOOTER
end
File.open 'application.html.erb', "r" do |file|
@data = file.read
@data.gsub!("<%= yield %>", APPLICATION_HTML_BOOT_BODY)
end
File.open 'application.html.erb', "w" do |file|
file.write @data
end
これでファイルを開いてAPPLICATION_HTML_BOOT_HEADERとかをファイルに書き込んでいます。
パーシャルを使うことにしたので
_header.html.erb と _footer.html.erbというファイルを作ってそこにテンプレートを書き込む感じ
application.html.erbに関しては<%= yield %>と書かれてい場所を書き換えて保存しています。
APPLICATION_HTML_BOOT_HEADER,FOOTER,BODYのそれぞれのコードはboot_format_erb.rbという別のファイルに保存してそれを
require 'boot_format_erb.rb'
として読み込んでいます
boot_format_erb.rbはこんな感じ
APPLICATION_HTML_BOOT_BODY = <<EOS
<%= render partial: '_header.html.erb' %>
<% if flash[:notice] %>
<div class="alert alert-success">
<%= flash[:notice] %>
</div>
<% end %>
<div class="container min-height">
<%= yield %>
</div>
<%= render partial: "_footer.html.erb" %>
EOS
APPLICATION_HTML_BOOT_HEADER = <<EOS
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Your Site Title !</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#">Contact</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<% unless session[:user_id] %>
<li><a href="#">Log in</a></li>
<li><a href="#">Create Account</a></li>
<% else %>
<li><a href="#">MyPage</a></li>
<li><%= link_to "Logout", "#"%></li>
<% end %>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
EOS
APPLICATION_HTML_BOOT_FOOTER = <<EOS
<footer class="footer">
<div class="container">
<p class="text-muted">Your Site Title</p>
</div>
</footer>
EOS
gemをリリース
gemをリリースするには
rake release
とコマンドを打てばよいのですがその前にすることがあります。
まず
https://rubygems.org/
ここにアクセスしてアカウントを作ります。
そのあとログインしマイページ的なところに書いてあるEdit profileをクリックします。
下に
curl -u sibakenY https://rubygems.org/api/v1/api_key.yaml > ~/.gem/credentials; chmod 0600 ~/.gem/credentials
こんな感じのコマンドが出ます。
sibakenYはアカウント名です。
windowsの場合うまくいかない
windowsの場合さっきのコマンドがうまくできません。(少なくとも自分の場合は…)
なので今回はこのコマンドだけはWSLを使ってubuntuからコマンドを打ちました。
rake release
rake releaseするときにgit commitをしていないと
rake aborted!
There are files that need to be committed first.
こんな感じで怒られると思うのでcommitしてからrake releaseする
最後に
あとはgem install gemnameでインストールできる。
だけど問題点があってどうやってコマンドでメソッドを実行させるのかわからない…
とりあえず動作確認に
require 'b_format'
BFormat.bformat
というファイルをルートディレクトリに作ってこれを実行する感じにして動作確認をしましたがやはりコマンドで実行したりしたい。
thor
rubyでコマンドラインを作るならthorってライブラリを使うらしいけど軽く調べた程度じゃよくわからなかったので今回はこれで終わり。
また今度調べて実装していきたい