【rails6】Railsで新規アプリを作る【初心者】

概要

Hello, Qiita！！
今回の記事は、「Rails6で新規アプリを作る過程」についてです。
Rails6からはwebpackやyarnなど、よくわからない素敵なパッケージが登場してきます。
環境構築でハマった人も多いのではないでしょうか（私がその例）
Dockerでも環境構築はできたのですが、Dockerの理解がざっくりし過ぎているのでlocal環境での過程について投稿します。

因みに筆者は最近RoRアプリを作り始めた、思いっっきり初心者です。
どうぞ暖かい目で見守りください。

なお、Rails5での記事も投稿していますので興味のある方は こちら からご覧ください。

前提条件

• OS: MacOS
• Rubyバージョン: 2.7.1
• Railsバージョン: 6.0.3
• データベース: MySQL
• Rubyバージョン管理: rbenv
• IDE: VisualStudioCode

上記の環境でアプリを作っていきます！

Railsで新規アプリを作る

ターミナル上で
rbenv local 2.7.1
を実行後、
rails _6.0.3_ new app_name -d mysql -B
を実行します。

何を行っているのか

• rbenv rbenvコマンド実行の宣言
• local 2.7.1 このプロジェクトで使用するRubyのバージョン指定（今回はver.2.7.1）
• rails railsコマンド実行の宣言
• _6.0.3_ rubyのバージョン指定（今回はver.6.0.3）
• new 新しいアプリの作成コマンド
• app_name 作りたいアプリの名前の定義
• -d mysql 使いたいデータベースの指定（今回はmysql）
  
• -B bundle installをスキップする指示

rbenvの使い方と仕組みについては、以下の記事がわかりやすいので参照してみてください。
rbenvの使い方と仕組みについて - Qiita

アプリ内のファイル

上記のようにターミナル上でrails newをすると、たくさんのフォルダやファイルが作られます。(Rails5と同様の内容は省略します。)

Rails6から追加されたファイル

Babel.config.js

node_modules

yarn.lock

Yarnとは、Facebook、Googleなどが共同開発したNode.js(JavaScript)のパッケージマネージャです。
↑
知らなかった、めっちゃすごいな（語彙力皆無）

Yarn自体もNodeモジュールのパッケージです。

Node.jsには、もともと、npm(Node Package Manager)というパッケージマネージャがありますが、npmと比較してYarnは、

• Nodeモジュールのインストールがとても早い
• 誰が作っても同じバージョンになる機能がある(バージョンロック機能)
• セキュリティが強化されている
• コマンドラインの出力がシンプルでみやすい

のような特徴があります。

RailsにはBundlerというGemのパッケージマネージャがありますが、そのJavaScript版のようなものです。

javascript/webpack

• javascript

javascriptフォルダは、rails5以前ではapp/assets配下に置かれていました。rails6ではapp配下となっています。

• webpack

webpackは指定されたファイルを起点として、そこからimport文を頼りに芋づる式にファイルを繋げてゆき、一つにまとめたJavaScriptファイルを出力します。

このまとめる処理はバンドル(bundle)と呼ばれています。
そしてバンドルを行うツールはバンドラーと呼ばれています。

ポイントは、“基本機能はあくまで一つのJavaScriptファイルにまとめる”というところのようです。

gemのインストール

Gemfile内のrailsの記述を、

Gemfile

~
gem 'rails', '6.0.3'
~

のように使いたいバージョン（今回はver.6.0.3）で固定します。

先ほど-Bコマンドでgemのインストールをスキップしたので、ターミナル上で
bundle install
を実行します。

サーバーの立ち上げ

実際にサーバーを立ち上げてみましょう！ターミナル上で
rails s
を実行します。

何を行っているのか

• rails server rails newコマンド で作ったRailsアプリケーションを、local環境でサーバーに繋ぐ指示

• rails server は、rails s でもOK

ターミナル上で以下のようなログが流れればサーバーとの接続が完了です！

Use Ctrl-C to stop

ブラウザ上で確認してみましょう！
localhost:3000 にアクセスします！

サーバーへ接続できました！

終わりに

最後までご覧いただきありがとうございました。
調べていく中でRubyはスクリプト言語、Javascriptはインタープリタ言語であることも知れました。
プログラミング言語の歴史を探っていくと、様々な言語やフレームワークは人類の叡智の集積なんだなあと感慨深く思ってしまいます。

また、今後は色々なgemによる機能追加方法なども記事にしたいなあと考えています。

この記事に関して不明な点等ありましたら、お知らせくださると幸いです。

最近マスクニキビができて嫌な気持ちになっているので、スキンケアも大事だなあと思っております。

それではまた！

参考にしたWebサイト

Rails環境でJS , CSSをwebpackで完全に管理する
webpackとBabelの基本を理解する
Samurai blog