【Ruby on rails5】deviceを導入して認証機能をつける【Ruby】
deviceは
認証系アプリに必要な機能を簡単に追加できる便利なgemです。
まずはdeviceのgemを以下のページを元に導入。
github.com
Gemfileに追記
gem 'devise'
bundle installでインストール
すると以下のような文言がターミナルに表示されるので一個ずつ設定していきます。
===============================================================================
Some setup you must do manually if you haven't yet:
1. Ensure you have defined default url options in your environments files. Here
is an example of default_url_options appropriate for a development environment
in config/environments/development.rb:
config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }
In production, :host should be set to the actual host of your application.
2. Ensure you have defined root_url to *something* in your config/routes.rb.
For example:
root to: "home#index"
3. Ensure you have flash messages in app/views/layouts/application.html.erb.
For example:
<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %></p>
4. If you are deploying on Heroku with Rails 3.2 only, you may want to set:
config.assets.initialize_on_precompile = false
On config/application.rb forcing your application to not access the DB
or load models when precompiling your assets.
5. You can copy Devise views (for customization) to your app by running:
rails g devise:views
===============================================================================1. config/environments/development.rbにデフォルトURLの指定
# mailer setting
config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }productionも同様に追記しましょう。
(本番環境用なのであとで実際のhostに変えましょう)
2. config/routes.rb.にroot_urlの指定
root :to => 'pages#index'
ここまできたら一度サーバーを起動してみます。
http://localhost:3000/pages/indexでアクセスしていたurlが
ルートを指定したため
以下のurlでアクセス可能になりました。
http://localhost:3000/
3. app/views/layouts/application.html.erb.を編集してflashメッセージの設定<%= yield %>の下に追記します。
<!DOCTYPE html> <html> <head> <title>MyWebApp</title> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> <%= csrf_meta_tags %> </head> <body> <%= yield %> <p class="notice"><%= notice %></p> <p class="alert"><%= alert %></p> </body> </html>
4. Rails3.2用の設定
ここは対象verでなければ無視！
5. DeviseのViewを作成
ターミナルに指定されたコマンドを貼り付けて実行する
これで完了です。
続いて、、、
Userモデルの設定
rails generate devise User
マイグレーションファイルが作成されました。
続いて以下のコマンド
rails db:migrate
このコマンドを実行すると、RubyがSQLに翻訳されて、データベースに自動接続します。そして、テーブル作成のSQLを自動実行し、正常に作成されたか否かの結果を表示します。
＊一度実行対象になって正常に実行されたマイグレーションファイルは、実行対象から除外される
＊実行していないのだけ対象になる
さて、サーバーを起動し、試しに生成されたurlにアクセスしてみると・・・
ログイン画面が表示されました！！
bootstrapのgrid systemを使ってみる
grid systemを使って、
大阪のうどんの名店「うだま」
の文字を以下のように中央に配置してみます。
以下のbootstrapのページにアクセス
Grid system · Bootstrap
offsetting columnsに利用例が載っています。
中央揃えにしたかったら
col-md-6 col-md-offset-3
と指定すればいいみたいです。
以下のようにすればOK
<div class="row">
//grid systemで中央揃えに！
<div class="col-md-6 col-md-offset-3 text-center">
<h1 class="display-3">うだま!</h1>
</div>
</div>
【Ruby on Rails】 bootstrapを導入する
bootstrapの導入は簡単です。
このページに手順が掲載されているので手順通り実行していくだけ
GitHub - twbs/bootstrap-sass: Official Sass port of Bootstrap 2 and 3.
必要なgemのインストール
cssを加える
javascriptを加える
以上の３ステップで完了です。
【Ruby】超簡単！macでruby on ra rails環境をインストールする手順
以下のコマンドをターミナルで順番に叩いて行けば
必ず誰でもRuby on Rails環境が構築できます。
①コマンドラインツールをインストール！
xcode-select --install
②Homebrewをインストール！！
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
③あなたの Mac に MacPorts で Ruby がインストールされている場合は、アンインストール！！！
sudo port uninstall ruby
④あなたのMacにRVMがインストールされている場合は、除去！！！！
rvm implode brew install rbenv ruby-build echo 'eval "$(rbenv init -)"' >> ~/.bash_profile source ~/.bash_profile
⑤Rubyをインストール
rbenv install 2.3.0 rbenv global 2.3.0 ruby -v
⑥bundlerをインストール！！！！！！
gem install bundler bundle -v
⑦Railsをinstall！！！！！！！！！
gem install rails rails -v
以上で構築完了です。
【Swift】 超簡単！画像にフィルターを付けて加工する方法
まずframeworkをimportする
CoreImage
linked frameworks and librariesのプラスボタンをクリック
CoreImageを選択してADD
あとはボタンタップ時などに以下のように実装すればOKです。
import CoreImage
超簡単ですね！！
// image が 元の画像 let ciImage:CIImage = CIImage(image:image); let ciFilter:CIFilter = CIFilter(name: "CISepiaTone") ciFilter.setValue(ciImage, forKey: kCIInputImageKey) ciFilter.setValue(0.8, forKey: "inputIntensity") let ciContext:CIContext = CIContext(options: nil) let cgimg:CGImageRef = ciContext.createCGImage(ciFilter.outputImage, fromRect:ciFilter.outputImage.extent()) //image2がフィルター後画像 let image2:UIImage? = UIImage(CGImage: cgimg, scale: 1.0, orientation:UIImageOrientation.Up)
【Swift】ScrollViewにボタンをつけることで任意のイメージを選択時に背景画像に適用する
UIScrollViewにボタンをつけることで任意のイメージを選択時に背景画像に適用する方法を記載。
まず、ストーリーボードにUIScrollViewを配置
続いてソースに関連付け
@IBOutlet var sc: UIScrollView!
あとは以下のようにコードをゴリゴリ書きましょう
//scrollView用
var uv = UIView()
//以下はvieDIdLoad内に記述することで画面表示時に scrollViewに画像がセットされている状態にする
//位置とサイズを決める
uv.frame = CGRect(x: 0, y: 418, width: self.view.frame.size.width*2, height: 128)
//UIButtonを作成
for i in 0..<6{
let button:UIButton = UIButton()
//x軸はi*80都することでボタンを一定間隔ごとに配置していく
button.frame = CGRect(x: i*80, y: 0, width: 80, height: 80)
button.tag = i
//どこのメソッドを呼ぶか定義しておく
button.addTarget(self, action: #selector(tap/*これを呼ぶ*/), for: .touchUpInside/*タッチアップ時にメソッド発動*/)
let buttonImage:UIImage = UIImage(named: String(i) + ".jpg")!
button.setImage(buttonImage, for: UIControlState.normal)
uv.addSubview(button)
}
//scrollViewにUIViewを貼り付ける
sc.addSubview(uv)
///scrollVieのサイズをUIViewのサイズに合わせておく（２倍のサイズにしているためスクロールする）
sc.contentSize = uv.bounds.size
【Swift】値を渡しながら画面遷移する
Swiftで値を渡しながら画面遷移する方法について書きます。
かなり簡単にかけます。
segueにIDをつけておきます。
今回はNextと設定
推移元のcontrollerにprepareメソッドをoverride
これが画面推移前に呼ばれるメソッドなので、値を渡したい時はここでセットしていきます。
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
//上記でセットしたidentifierのsegueであれば、
//推移先のcontrollerの変数（ここではUIImage）に推移元のcontrollerのUIImageをセット
if segue.identifier == "next" {
let subVC:EditViewController = segue.destination as! EditViewController
subVC.willEdit = imageView.image!
}
}これで値を渡すことができました。
画面推移は以下
//以下を推移したいタイミング（例えばボタンのタップ時のメソッドの中で呼ぶ）
performSegue(withIdentifier: "next", sender: nil)
以上です。かなり簡単ですね。
