【Ruby on Rails】ポートフォリオ作成してみた。その2

ポートフォリオ作成のための準備

まずチュートリアルの第一章から改めて。

勝手に作り出せるほど覚えているわけでもないので。

環境設定

AWS Cloud9の設定

12月Cloud9が突然AWSに入ってしまい、AWSもCloud9の知らないのにどーしよー!!って思っていたのが嘘のよう。やれば慣れるものだ。まぁ画面がすごい早い単位で変更してくれるから、この画面がいつまで役立つのかわからないのだけど。

f:id:kisokoji:20180327211931p:plain:w600

AWSにアカウントを作成はしたとして、ダッシュボードから「Cloud9」に入る。最初は検索するといい。

f:id:kisokoji:20180327210814p:plain:w600

AWSのCloud9で「Create environment」をクリック。

f:id:kisokoji:20180327211046p:plain:w600

「Name environment」でNameを入力。

「Description」はオプションだから入れなくても大丈夫。

「Next Step」

f:id:kisokoji:20180327211212p:plain:w600 f:id:kisokoji:20180327211225p:plain:w600

ここはデフォルトのままでいいらしい。

「Next Step」

f:id:kisokoji:20180327211500p:plain:w600 f:id:kisokoji:20180327211516p:plain:w600

「Preview」で内容を確認して「Create environment」でIDE画面へ遷移する。

f:id:kisokoji:20180327212507p:plain:w600

こんな感じ。

右上の設定をクリックして画面設定をしておく。

f:id:kisokoji:20180327212828p:plain:w600

特に「Soft Tab」はデフォルト「4」を「2」に変更する。

Railsのインストール

ターミナル部分で早速インストール。

ターミナルってどこよ!って初心者思いますよね。はい。

f:id:kisokoji:20180327213456p:plain:w600

ターミナル部分をクリックして

$ gem install rails -v 5.1.4

チュートリアルではバージョンを指定してインストール。

rails newをする

$ rails new アプリケーション名 [option]

ってことでチュートリアルでは

$ cd ~/environment $ rails 5.1.4 new sample_app $ cd sample_app

ホームディレクトリでバージョンを設定して「sample_app」を作って、「sample_app」ディレクトリへ移動。ここまでを一過程としておくとテンパらない。

ファイルシステムはクリックすればどのディレクトリにもいけるから、ファイルの変更をしてそのままコピペしてコマンドを実行しがちなのだ。

Gemfileの変更

順序としてまずGemfileを変更する。チュートリアルの初期値をそのままコピペしておく。

source 'https://rubygems.org'  

gem 'rails',        '5.1.4'  
gem 'puma',         '3.9.1'  
gem 'sass-rails',   '5.0.6'  
gem 'uglifier',     '3.2.0'  
gem 'coffee-rails', '4.2.2'  
gem 'jquery-rails', '4.3.1'  
gem 'turbolinks',   '5.0.1'  
gem 'jbuilder',     '2.7.0'  

group :development, :test do  
  gem 'sqlite3', '1.3.13'  
  gem 'byebug',  '9.0.6', platform: :mri  
end  

group :development do  
  gem 'web-console',           '3.5.1'  
  gem 'listen',                '3.1.5'  
  gem 'spring',                '2.0.2'  
  gem 'spring-watcher-listen', '2.0.1'  
end  

group :test do  
  gem 'rails-controller-testing', '1.0.2'  
  gem 'minitest-reporters',       '1.1.14'  
  gem 'guard',                    '2.13.0'  
  gem 'guard-minitest',           '2.4.4'  
end  

group :production do  
  gem 'pg', '0.18.4'  
end  

**Windows環境ではtzinfo-dataというgemを含める必要があります  **  
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]  

保存 command + s ( ctl + s) して

$ bundle install --without production

git

ここまでをスタートアップ処理として覚えてしまうといいとやっと思える。

$ git init
$ git add -A
$ git commit -m "Initialize repository"

READMEの編集
README.md
チュートリアルを参考にしておけば最低限はOKなんじゃないか?基本的にはこれをしなきゃなわけでしょ。

保存してコミット。

$ git commit -am "Improve the README"

bitbucketにリポジトリを作成

bitbucketでまず新規でリポジトリを作成する。

$ git remote add origin git@bitbucket.org:ユーザー名/sample_app.git
$ git push -u origin --all # リポジトリやその参照先もすべてプッシュする

ハロワ

デプロイの確認用にハロワを設定する。

app/controllers/application_controller.rb

class ApplicationController < ActionController::Base
 
protect_from_forgery with: :exception

 def hello
  render html: "hello, world!"
 end
end

config/routes.rb

Rails.application.routes.draw do
 root 'application#hello'
end

Herokuへデプロイ

$ heroku --version

バージョン情報があるか確認し、ない場合はインストール

クラウドIDE上でHerokuをインストールするコマンド

$ source <(curl -sL https://cdn.learnenough.com/heroku_install)

再度バージョン情報を確認。表示されたら

$ heroku login
$ heroku keys:add

Herokuに登録したメールアドレス、パスワードを入力する。

Found an SSH public key at /home/ec2-user/.ssh/id_rsa.pub ? Would you like to upload it to Heroku? (Y/n)

迷わず「Y」を入力してEnter

Herokuに新しいアプリケーションを作成する

heroku create

Herokuへプッシュ

$ git commit -am "Add hello"
$ git push
$ git push heroku master

Herokuのリネーム

$ heroku rename 新しいアプリケーション名

確認

$ heroku open

として出て来るURLをクリックし、オープンするとブラウザが立ち上がる。

ハロワが表示されていたらデプロイ成功!

まだまだ作成までは程遠い。。。