はじめに
Rails7がリリースして随分たちまが、Rails6とはだいぶ変更点があり、改めて把握しておく必要もありそうです。
今回は、簡単かつ良く出てくる実装を取り上げつつ、簡単なTODOアプリを作っていきます。
機能的には、認証機能や一対多のリレーションについて学ぶことができます。
今回は
プロジェクトの作成として
- asdf
- railsコマンド
について学びます。
では、はじめていきましょう。
1. asdfでRuby等の言語バージョンを管理する
asdfとは
言語やライブラリのバージョン管理を行ってくれるツールの一つです。
書く言語やライブラリごとの、プラグインを追加することによって、機能が追加されます。
ここでは、ざっくりとMacでの導入方法を紹介しますが、基本的には各OSはパッケージマネージャー毎のコマンドは用意されています。
※すでに rbenv 等を使っている場合
すでに rbenv 等でバージョン管理を行っている方は、そのままでも構いませんが、
asdf の導入にあたっては、先に各ツールを削除する必要があります。
例えば rbenv であれば
こちらに uninstall に関しての記載があるようです。
初めて ruby の環境を作る方は上記内容は無視して、次に進んでください。
Macへの導入方法
公式サイトより、asdfの導入をします。
まずは、上記リンクにアクセスし、
赤枠のボタンを押しましょう。すると、
このように各言語ごとの導入方法が細かく書いてありますので、Mac用の設定を見ていきます。
curl と git をインストール
% brew install coreutils curl git
asdf をインストール
% brew install asdf
パスを通す
% echo -e "\n. \"$(brew --prefix asdf)/libexec/asdf.sh\"" >> ~/.zshrc
シェルの再起動
source .zshrc
現在Macでは bash ではなく zsh が使われている為、公式のコマンドを一部改変し、このようなパスを指定する流れとなります。
最後にバージョンの確認が出来るか確認しておきましょう。
% asdf version
v0.12.0
このようにバージョン番号が帰ってくればOKです。
ruby
次に、ruby をインストールします。
asdfではまずプラグインをインストールしますので、
こちらのリンクから、
% asdf plugin add ruby https://github.com/asdf-vm/asdf-ruby.git
プラグインを導入しておきます。
ruby のインストールには、 ruby-build というツールが必要となりますので、
こちらのリンクより、今回インストールする ruby3.1以降に必要な設定を行います。
% brew install openssl@3 readline libyaml gmp
これでrubyがインストール出来るはずです。
% asdf list-all ruby
で、インストール可能なバージョンの確認ができます。
インストールは、
% asdf install ruby 3.2.2
バージョン指定して行い、使用バージョンは、
環境全体の設定の global を使って
% asdf global ruby 3.2.2
とりあえず、このように指定しておきましょう。
nodejs
続けて nodejs です。
こちらのリンクから
% brew install gpg gawk
% asdf plugin add nodejs https://github.com/asdf-vm/asdf-nodejs.git
必要ツールとプラグインを導入します。
また、使用可能なバージョンの確認もしておきます。
% asdf list-all nodejs
ただし、今回は最終バージョンである、 latest を使います。
% asdf install nodejs latest
% asdf global nodejs latest
latest を使えば新しいものを使えますが、依存関係のエラーを起こす場合もありますので、プロジェクトによっては適宜バージョンを明示的に指定する必要があります。
yarn
最後に yarn もasdfで管理しておきましょう。
% asdf plugin-add yarn
% asdf install yarn latest
% asdf global yarn latest
これで準備は完了です。
2. プロジェクトを作成し、サーバーを起動する
asdfのローカル設定
では、プロジェクトを作っていきましょう。
任意のディレクトリからで良いですが、ここでは
Desktop > my_work
に作成していきましょう。
% cd ~/Desktop
Desktop % mkdir my_work
Desktop % cd my_work
これでカレントディレクトリを my_work としました。
次に、このディレクトリ以下で使う各言語バージョンを asdf の local 設定として行っておきます。
my_work % asdf local ruby 3.2.2
my_work % asdf local nodejs latest
my_work % asdf local yarn latest
Railsのインストール
rails は gem を使ってインストールしていきます。
gem は ruby のライブラリを導入するためのマネージャーの事を指します。
まずは bundler をいう gem をインストールします。
my_work % gem install bundler
bundler は導入する gem の管理を一元化するためのライブラリです。
結果が以下のようになればOKです。
my_work % gem install bundler
Fetching bundler-2.4.21.gem
Successfully installed bundler-2.4.21
Parsing documentation for bundler-2.4.21
Installing ri documentation for bundler-2.4.21
Done installing documentation for bundler after 0 seconds
1 gem installed
そして、いよいよ Rails です
my_work % gem install -v 7.1.1 rails
今回は 7.1.1 を指定していますが、 -v 7.1.1 rails この部分はオプションとなりますので、なければ最新版が自動で入ります。
.
.
(略)
Done installing documentation for activesupport, actionview, actionpack, railties, activemodel, activerecord, activejob, activestorage, actiontext, actionmailer, actionmailbox, actioncable, rails after 4 seconds
13 gems installed
これでプロジェクトを作成可能となりました。
3. プロジェクトの作成
rails new
早速コマンドを打ってみましょう。
my_work % rails _7.1.1_ new todo_app -c bootstrap
以下のような結果になればOKです。
my_work % rails _7.1.1_ new todo_app -c bootstrap
create
create README.md
create Rakefile
create .node-version
create .ruby-version
create config.ru
.
.
（略）
.
.
Add watch:css script
run npm pkg set scripts.watch:css="nodemon --watch ./app/assets/stylesheets/ --ext scss --exec \"yarn build:css\"" from "."
gsub Procfile.dev
run bundle install
Bundle complete! 16 Gemfile dependencies, 85 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
run bundle lock --add-platform=x86_64-linux
Writing lockfile to /Users/kimuratomoaki/Desktop/my_work2/todo_app/Gemfile.lock
run bundle lock --add-platform=aarch64-linux
Writing lockfile to /Users/kimuratomoaki/Desktop/my_work2/todo_app/Gemfile.lock
my_work %
ここの _7.1.1_ もオプションなので、なければインストールされているRailsの最新版が使われます。
【＊注意】 Rails 7.0.x と Rails ７．１．ｘ とで 挙動が変わります。
CSSフレームワークの選択オプションで、 -c tailwind の場合は importmap が自動で採用されていました。が、
-c bootstrap の場合、Rails 7.0.x だと esbuild を採用しており、 7.1.x からは importmap になっていました。
今回は 7.1.1 を使っていますので、 7.0.x を使ってしまうと以降の一部の実装（Bootstrapの適用）が参考にならなくなります。 ご注意下さい。
その他のオプションとして、
| オプション | 項目 | オプションの種類 |
|---|---|---|
| -c | 使用するCSS | tailwind bootstrap 等 |
| -d | データーベース | mysql postgresql sqlite3 等 |
| --skip | 項目を含めない | --skip-test --skip-javascript --skip-bundle 等 |
など、沢山用意されています。
興味があれば、 rails new -h で参照することができますので、調べてみてください。
続いて、プロジェクトに移動します。
my_work % cd todo_app
todo_app %
プロジェクトフォルダからアプリを起動します。
todo_app % rails s
以下のようにサーバーが動けば成功です。
todo_app % rails s
=> Booting Puma
=> Rails 7.1.1 application starting in development
=> Run `bin/rails server --help` for more startup options
Puma starting in single mode...
* Puma version: 6.4.0 (ruby 3.2.2-p53) ("The Eagle of Durango")
* Min threads: 5
* Max threads: 5
* Environment: development
* PID: 57685
* Listening on http://127.0.0.1:3000
* Listening on http://[::1]:3000
Use Ctrl-C to stop
では、プレビューも確認しておきましょう。
chrome を開いて、urlバーに
localhost:3000
と打ってみましょう
Railsのロゴが出てくればOKです。
これでプロジェクトの作成ができました。
シャットダウン
プレビュー中はrailsサーバーを動かしますので、使わない時はシャットダウンしておきましょう。
ctrl + c でサーバーを止める事ができます。
^C- Gracefully stopping, waiting for requests to finish
=== puma shutdown: 2023-10-26 10:20:48 +0900 ===
- Goodbye!
Exiting
todo_app %
4. gitで作業を管理する
git
ここまでを保存しておきましょう。
todo_app % git init
todo_app % git add .
todo_app % git commit -m "プロジェクト作成"
GitHub
Githubの設定ができているのであれば、同名のリポジトリを作成し、pushしておきましょう。
おわりに
本チャプターはここまでとなります。
次回は
- Scaffold
- MVC
- ルーティング
を学びます。