#概要
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の記述を、
~
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