#Railsのインストール
Railsのインストールをおこないます。参考文献に従い、バージョンは5.2.1を選択。
$ gem install rails -v 5.2.1
無事インストールできました!!
#アプリの雛形作成
アプリの雛形を作成します。
$ rails new tweet_app -d mysql
アプリケーションディレクトリに移動して…
% cd test_app
データベースを作成します。MySQLを起動した状態で次のコマンドを入力。
$ bin/rails db:create
これでDBが作成される…と思ったら、エラーが。
Mysql2::Error::ConnectionError: Access denied for user 'root'@'localhost' (using password: NO)
数時間対処法を探しましたが、一向に解決しないので急遽PostgreSQLを使うことに。
Homebrewでインストールし、先程の手順まで戻ります。
$ bin/rails db:create
今度は無事にDBが作成されました!
続いてサーバーを起動します。
$ bin/rails s
サーバーを起動させたら、ブラウザでhttp://localhost:3000 にアクセスします。
(サーバーを終了させるには[Control + C])
画像の通り、正常に動作しています。
#Slimの導入
Railsを用いた開発では、アプリの画面を「ERB」というテンプレートエンジン(最終的なHTMLを生成する仕組み)を使用しています。
その他に、ERBよりも簡潔な書き方ができる「Slim」があります。今回はこちらを使用することにします。
Slimの導入には2つのgemを使用します。
1.slim-rails: Slimのジェネレータを提供する
2.html2slim: ERB形式のファイルをslim形式に変換する
アプリのGemfileに定義し、
gem 'slim-rails'
gem 'html2slim'
bundleコマンドでインストール。
$ bundle
これで、生成されるテンプレートファイルはSlim形式になりました。
現時点でapp/views/layoutsディレクトリ内にERB形式のファイルが3つあるので、以下のコマンドでSlim形式にします。
$ bundle exec erb2slim app/views/layouts/ --delete
bundle exec [コマンド]で、Bundler管管理下のgemを利用できる状態でコマンドを実行します。
#BootstrapとSassの導入
自力でCSSを組むのは大変なので、フロントエンドフレームワークのBootstrapを導入します。
Gemfileに以下を追記し、bundleコマンドでインストール。
gem 'bootstrap'
CSSにもSlimと同じように効率的な書き方の形式「Sass」があります。
今回はSassの提供する、「SCSS」記法でCSSを買いていきます。
まず、app/assets/stylesheets/application.cssを削除し、
$ rm app/assets/stylesheets/application.css
app/assets/stylesheets/application.scssを作成し、以下をファイルに記述。
@import "bootstrap";
これで、画面をBootstrapが反映された状態にすることができます。
次に、見栄えを具体的に改善するため、app/views/layouts/application.html.slim
ファイルを以下のように編集します。
doctype html
html
head
title
| TweetApp
= csrf_meta_tags
= csp_meta_tag
= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload'
= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
body
.app-title.navbar-expand-md.navbar-light.bg-light
.navar-brand Tweet_app
.container
= yield
#エラーメッセージの日本語化
Railsのエラーメッセージは英語ですが、日本語にすることができます。
日本語翻訳ファイルがGitHub上にあるので、ダウンロードしましょう。
$ wget https://raw.githubusercontent.com/svenfuchs/rails-i18n/master/rails/locale/ja.yml --output-document=config/locales/ja.yml
続いて、デフォルトで日本語コンテンツを使うようにアプリの設定を変更します。
config/initializers/locale.rbを作成し以下を記入。
Rails.application.config.i8m.default_locale = :ja
これで、アプリ製作の下準備は完了です!