Input typeのFocus helightの指定方法
stackoverflowより
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border-color: rgba(126, 239, 104, 0.8);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);
outline: 0 none;
}
Bootstrap3では
.form-control:focus {
border-color: #FF0000;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}
結構忘れがち。フラットデザインのサイトのフォームは必須な気がします。
Railsで固定ページを作成する手順
1.テストを書く(RED)
spec/requests/****_spec.rb
describe "Contact page" do
it "should have the content 'Contact'" do
visit '/static_pages/contact' expect(page).to have_content('Contact')
end
it "should have the title 'Contact'" do
visit '/static_pages/contact' expect(page).to have_title("Ruby on Rails Tutorial Sample App | Contact")
end
end
実行(RED)
bundle exec rspec spec/requests/****_spec.rb
2.ルートを追加する
config/routes.rb
SampleApp::Application.routes.draw do
get "static_pages/home"
get "static_pages/help"
get "static_pages/about"
get "static_pages/contact" <<===
end
3.コントローラーにアクションを追加
app/controllers/*****_controller.rb
class StaticPagesController < ApplicationController def contact #ページファイル名 end end
4.ファイルにHTML / ERBを書く
app/views/static_pages/****.html.erb
class StaticPagesController < ApplicationController def contact #ページファイル名 end end
5.テストをする(GREEN)
bundle exec rspec spec/requests/****_spec.rb
■
アセットパイプラインとは
アセットパイプラインとは、JavaScriptやCSSのアセットを最小化 (minify: スペースや改行を詰めるなど) または圧縮して連結するためのフレームワークです。アセットパイプラインでは、CoffeeScriptやSASS、ERBなど他の言語で記述されたアセットを作成する機能を追加することもできます。 技術的には、アセットパイプラインは既にRails 4のコア機能ではありません。フレームワークから分離され、sprockets-railsというgemに書き出されています。
アセットパイプラインのファイル場所
app/assets: 現在のアプリケーション固有のアセット
lib/assets: あなたの開発チームによって作成されたライブラリ用のアセット
vendor/assets: サードパーティのアセット
これらのディレクトリには、それぞれのアセットクラス用のサブディレクトリがあります。たとえば、app/assetsには次のようなサブディレクトリがあります。
imgages
stylesheet
マニュフェストファイル
マニュフェストファイル app/assets/stylesheets/application.css
/* * This is a manifest file that'll automatically include all the stylesheets * available in this directory and any sub-directories. You're free to add * application-wide styles to this file and they'll appear at the top of the * compiled file, but it's generally better to create a new file per style * scope. *= require_self *= require_tree . */
*= require_self
これはapplication.css自身を含むことを宣言している。
*= require_tree .
これはapp/assets/stylesheetsディレクトリの中のすべてのCSSファイルをCSSにインクルードするように宣言している。
プリプロッサエンジン
必要なアセットをディレクトリに配置してまとめた後、Railsはさまざまなプリプロセッサエンジンを介してそれらを実行し、ブラウザに配信できるようにそれらをマニフェストファイルを用いて結合し、サイトテンプレート用に準備します。Railsは、どのプリプロセッサを使用するかを、ファイル名の拡張子を使用して判断します。最も一般的な拡張子は、Sass用の.scss、CoffeeScript用の.coffee、埋め込みRuby (ERb) 用の.erbです。3.3.3では最初にERbを、5.2.2ではSassをそれぞれ扱いました。 なお本書では扱いませんが、CoffeeScriptはエレガントで簡潔な言語で、JavaScriptにコンパイルして実行します (興味のある方は、RailsCastの「CoffeeScriptの基礎 (英語)」から始めると良いでしょう)。
Rspec実行時のエラー
Rails 4.1.0.betaでRSpecを実行した場合
一応テストは動きますが、長ったらしいエラーが毎回表示されるので、その解消法を調べました。
Error内容
Warning: you should require 'minitest/autorun' instead. Warning: or add 'gem "minitest"' before 'require "minitest/autorun"'
・gemに以下を追加
gem 'minitest'
・spec_helperに以下を追加
=>>require 'minitest/autorun' require 'rspec/rails' require 'rspec/autorun'
こうすると長いエラー表示なしに動きます。
RoRチュートリアルメモ（第３章）
Railsアプリケーション作成の際
rails new sample_app --skip-test-unit
railsの--skip-test-unitというオプションはTest::Unitフレームワークと関連しているtestディレクトリを作成しないようにするオプションでRspecを使う場合使用する。
Rails Gemfileについて
#開発環境 group :development do gem 'sqlite3', '1.3.8' gem 'rspec-rails', '2.13.1' end #テスト環境 group :test do gem 'selenium-webdriver', '2.35.1' gem 'capybara', '2.1.0' end ＃本番環境 group :production do gem 'pg', '0.15.1' gem 'rails_12factor', '0.0.2' end #セットで書くこともできる group <u>:development, :test </u>do gem 'sqlite3', '1.3.8' gem 'rspec-rails', '2.13.1' end group :doc do gem 'sdoc', '0.3.20', require: false end
Bundle Install
Bundle Installの手順
$ bundle install --without production $ bundle update $ bundle install
--without productionオプションを追加することで、本番環境のgemのみをインストールしないようにすることができる。 このオプションは “remembered option” と呼ばれるもので、このオプションを一度実行するとコマンドに保存され、今後Bundlerを実行するときにオプションを追加する必要がなくなります。このため、今後は単にbundle installを実行するだけで、自動的に本番環境用gemをスキップできるようになります2。
Gemfile.lockについて
「Gemfile.lock」はインストールされたGemパッケージの名前とバージョンが記録されたものです。
他の環境で同じアプリケーションの開発を行なう場合は、プログラムファイルに加えてこの「Gemfile.lock」ファイルを配布します。
そして他の環境で「bundle install」を実行すると、今度は「Gemfile.lock」ファイルが参照され、指定されたバージョンのGemパッケージがインストールされます。
Gemfile.lockがない場合(通常は開発最初期)
Gemfile.lockが作成され、Gemfileに従ってgemがインストールされる。そのときに実際にインストールされたgemとその依存関係がGemfile.lockに保存される。
Gemfileにgemが追加された場合(通常は開発時)
Gemfileに追加されたgemとそれに依存する未インストールgemのみがインストールされ、Gemfile.lockはそれらのgemについてのみ更新される。
Gemfileに変更がない場合(通常はデプロイ時)
Gemfile.lockに従ってインストールされる。Gemfileは参照されず、Gemfile.lockは更新されない。
bundle installとupdateの使い方について - saj_kzの日記
補足: bundle updateについて
ここで注意すべきはbundle updateです。
bundle updateを実行すると現状のGemfile.lockの内容は無視され、 上で言う「Gemfile.lockがない場合」と同じことが行われます。 当然ながら、Gemfile.lockは、現時点の最新バージョンと依存関係を持つgemによってごっそり更新されてしまいます。
かく言う私も、当初はbundle installとbundle updateの違いに気付かないままカジュアルにbundle updateを実行してしまってました。
gemの紹介記事などでbundle updateを指示していることが時たまあり、 それに釣られてしまっていたようです。 恐ろしいことです。
アプリ開発の初期段階では、bundle installとbundle updateのどちらを実行していても矛盾は顕在化しません。
しかし、しばらく更新が行われていない間にgemのバージョンが進んでしまうと、 bundle updateを実行したときにgemとGemfile.lockが一斉更新されてしまい、 以前動作したgemが動作しなくなるようなことがあります。
開発初期のローカルアプリならともかく、 実際に動いているシステムのメンテ中にうかつにbundle updateを実行すると死を招きます。
そしてGemfile.lockがリポジトリに登録されておらず、 前回デプロイ時のバックアップもなければ、動いていた状態を再現できなくなって詰んで終わります。
Gemfile.lockはリポジトリに登録しましょう。 そしてbundle updateは基本的に実行せず、 特定のgemのみを最新にする目的でbundle update gem名のようにgem名を指定して実行するぐらいにとどめましょう。
なお、Gemfile.lockがあるとデプロイがうまくいかないのは、 開発・本番環境間の不整合が原因である可能性が高いので、 Gemfile.lockを除外するのではなく不整合を解決する必要があります。
セキュリティ面について
必ず.gitignoreは設定する。
# Ignore bundler config. /.bundle # Ignore the default SQLite database. /db/*.sqlite3 /db/*.sqlite3-journal # Ignore all logfiles and tempfiles. /log/*.log /tmp # Ignore other unneeded files. doc/ *.swp *~ .project .DS_Store .idea .secret
Rsepcのインストール
rails generate rspec:install
create .rspec
create spec
create spec/spec_helper.rb
Railsの基礎操作
モデル、コントローラー、ビューの作成
$ rails generate controller $ rails destroy controller
コントローラーを生成すると自動でconfig/routes.rbファイルが自動的に更新されます。この routesファイルに記述されている内容 (ルーティング) に従って、 複数のURLとWebページを対応付けます。
configディレクトリという名前のとおり、このディレクトリ内にあるファイルは、Railsがアプリケーションの設定を読み込む時に必要になります。
マイグレート処理
#データベースのマイグレーションを変更できる $ rake db:migrate #１つ前の状態に戻る $ rake db:rollback #最初の状態に戻す $ rake db:migrate VERSION=0 #versionを変えることで
