のらブログ

sadanoraが思ったことを書きます

はじめてのRails　ローカル開発環境構築で初心者がつまづいたところ

この記事はフィヨルドブートキャンプ Advent Calendar 2021 Part 2 の8日目の記事です。

adventar.org

Part 1もあります。

フィヨルドブートキャンプ Part 1 Advent Calendar 2021 - Adventaradventar.org

はじめに

こんにちは、フィヨルドブートキャンプでプログラミングを学習しているsadanoraです。 フィヨルドブートキャンプには2020年8月から参加しています。1年4ヶ月かけて地道にプラクティスを進め、やっとこさRailsのプラクティスに突入しました。

Railsのプラクティスに突入して早速、環境構築でいくつかつまづいた点があったのでブログにまとめます。

Railsの環境構築でエラーが出て困っている方のお役に立てたら嬉しいです。

前提

試した環境はこちら

  • macOS Catalina 10.15.7
  • ruby 2.6.5(rbenv1.1.2)

つまづきその1

gem i railsしたのにrailsが入っていないと言われる

Railsをインストールしたはずなのに、railsが入っていないというエラーに遭遇しました。

$ gem i rails
$ rails -v
Rails is not currently installed on this system. To get the latest version, simply type:

    $ sudo gem install rails

You can then rerun your "rails" command.

解決方法

ターミナルの再起動で解決できました。

rubyとrailsコマンドをwhichしてみると、

ターミナルの再起動前

$ which ruby
/Users/foo/.rbenv/shims/ruby
$ which rails
/usr/foo/rails

ターミナルの再起動後

$ which ruby
/Users/foo/.rbenv/shims/ruby
$ which rails
/Users/foo/.rbenv/shims/rails
$ rails -v
Rails 6.1.4.1

という感じだったので、railsコマンドのパスが通ってないのが原因だったように思えます。*1 ターミナルの再起動ではなく$ source ~/.zshrcでもよさそうです。

つまずきその2

node.jsはLTS版を使わないと困るという学び。

rails gで作ったページがエラーになる

$ rails new testapp
$ rails g controller helloworld index
$ rails s

上記のようにRailsアプリを作りハロワのページを作成、rails sしてブラウザで http://localhost:3000/helloworld/index にアクセスしたもののエラーでページが表示されませんでした。

ターミナルに表示されたログは以下です。

Started GET "/helloworld/index" for ::1 at 2021-12-05 12:34:24 +0900
Processing by HelloworldController#index as HTML
  Rendering layout layouts/application.html.erb
  Rendering helloworld/index.html.erb within layouts/application
  Rendered helloworld/index.html.erb within layouts/application (Duration: 0.8ms | Allocations: 39)
[Webpacker] Compiling...
[Webpacker] Compilation failed:
node:internal/crypto/hash:67
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:67:19)
    at Object.createHash (node:crypto:130:10)
    at module.exports 
#--中略--
 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v17.1.0

  Rendered layout layouts/application.html.erb (Duration: 3890.1ms | Allocations: 5397)
Completed 500 Internal Server Error in 3903ms (Allocations: 5723)

ActionView::Template::Error (Webpacker can't find application.js in /xxx/my_web_apps/testapp/public/packs/manifest.json. Possible causes:
1. You want to set webpacker.yml value of compile to true for your environment
   unless you are using the `webpack -w` or the webpack-dev-server.
2. webpack has not yet re-run to reflect updates.
3. You have misconfigured Webpacker's config/webpacker.yml file.
4. Your webpack configuration is not creating a manifest.
Your manifest contains:
{
}
):
     7:     <%= csp_meta_tag %>
     8: 
     9:     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    10:     <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    11:   </head>
    12: 
    13:   <body>
    
app/views/layouts/application.html.erb:10

webpackerがコンパイルに失敗しており、理由としてunsupportedと書いてあるのが気になります。

さらに、rails newした際のログを改めてみてみました。

rails  webpacker:install
Warning: you are using an unstable release of Node.js (v17.1.0). If you encounter issues with Node.js, consider switching to an Active LTS release. More info: https://docs.npmjs.com/try-the-latest-stable-version-of-node

「安定版ではないnode.jsを使っています。問題がある場合はアクティブLTS版への切り替えを検討してください」的なことが書いてありました。 はい、まさに問題に直面していました。

解決方法

rails newで作ったディレクトリを一旦削除し、node.jsの安定版のバージョンをインストールしてrails newからやり直したところ、エラーを解消することができました。

自分はnode.jsはnodebrewを使ってインストールしているので、以下はnodebrewでの実行例です。

$ nodebrew install stable # 安定版のインストール
$ nodebrew use stable # 安定版を指定
use v16.13.1
$ rails new testapp
$ rails g controller helloworld index
$ rails s

特に困った点など

turbolinksが悪いのではと勘違いした

railsが出してくれるエラーではソースのturbolinksの読み込み部分をハイライトしていたので、最初turbolinksが問題なのかと勘違いしてしまいました。

対処の途中でturbolinksを無効化してエラーを解消できたりもしたのですが、「じゃあturbolinks使いたいときはどうするのか」等々モヤっとした感じで何か違う気がしていました。

ログからnode.jsのバージョンの問題だと気付けてよかったです。

まとめ

  • ナイスな点

    ログを読んで対処できた

  • 改善点

    次は最初にログをちゃんと読む

*1:rbenvを使っていて、rbenvのインストール時にパスを通している前提なので、rbenvを使っていないとかだと話は変わるはず

初めてのLT会Vol.8に参加しました

フィヨルドブートキャンプでプログラミングを学んでいるsadanoraです。

2021年8月7日にフィヨルドブートキャンプ内で開催された「初めてのLT会vol.8」でLT（ライトニングトーク）をしたのでブログをしたためました。

発表スライド

speakerdeck.com

初めてのLT会とは

フィヨルドブートキャンプでは、定期的にLT会が開催されています。

今回の登壇枠は6人、持ち時間は発表5分、質疑5分で合わせて1人10分程度でそれぞれのテーマについて発表します。

自信がなくても、失敗してもOK!! 入会したばかりの方、LT経験者の方も大歓迎

と、敷居を低めに設定してくれていて、チャレンジしやすいイベントです。

また、LT会は受講生が主体となって運営するイベントです。オーガナイザーも受講生が務めます。今回はid:ud_ikeさんがオーガナイズしてくださいました。

前回の「初めてのLT会Vol.7」をみて、自分も次回は挑戦してみたいなと思っていたので、登壇者募集の告知をみて勢いで申し込み、登壇させていただきました。

振り返り

テーマ決めが一番大事だと思った

テーマを仮決めしたのが本番の10日くらい前でした。 しかしその後テーマを変更しようと思い立ち、発表したテーマに決めたのは本番2、3日前。 そこから半日でスライドを作りリハーサルに参加しましたが、それでもスライドが気に入らないので本番前日にスライドを作り直すというギリギリの進行に。

なんでこうなった

仮決めしたテーマで話せないことがわかったからです。

なんとなく話の流れはイメージしていたのですが、テーマについて深掘りしていくと

  • テキストに起こすのにやたら時間がかかりしかもうまく言語化できてない。
  • 今の知識範囲だと自信を持っては語れなそう。もっと先のプラクティスで学ぶ内容まで踏み込まないと話せなそう。

という状態に陥りました。骨子はあってもその先を整理して言葉に落とし込めませんでした。

テーマを決める段階である程度細かくテキストに起こせるかやってみて、やたら時間がかかるとか書き起こせないのであれば、テーマが本当に適当か早めに見直した方が良さそうです。*1

ただ、ここでテーマの技術について深掘りしようとしたことで、「わかってないことがわかる」「わかってないことの解像度があがる」という学びがあり、LTの中でもそのことを話しました。

keynoteでのスライド作成

スライドはkeynoteで作成しました。

初めて使いましたが、使ってる内にそれなりに慣れ、LTをまたすることがあればパワポでスライド作りたいとは思わなそうなくらいには気に入りました。*2

使用したkeynoteテンプレート

大体いい感じになるKeynoteテンプレート「Azusa」

最初はデフォルトのテーマの中から選んで使っていたのですが、スライドが気に入らないのでリハーサルで相談したら、id:ud_ikeさんが大体いい感じになるKeynoteテンプレート「Azusa」を教えてくれました。 おかげさまで大体いい感じになったと思っています。

色の選び方

色は好きなように変えたらいいのですが、色の選び方がよくわかっていないので困ります。 そこでAdobeカラーに頼りました。

カラーのトレンド、カラーのトレンドからアイデアを引き出す| Adobe Color

カラーパレット、アーティスト向けのカラースキーム| Adobe Color

トレンドや探索をだーっと眺めて、ピンと来たカラーパレットに従えばOKなので楽です。

f:id:sadanora:20210809123744p:plain

使いたい色が決まっている場合は、その色が入ったカラーパレットを検索することもできます。

f:id:sadanora:20210809123604p:plain

f:id:sadanora:20210809123608p:plain

色々探し方や使い方があって、眺めているだけで楽しいです。

今回はそこまでカラフルなスライドにするつもりはなかったので、背景色、文字色のグレーっぽい黒、あと見出しなどに使う緑を適当なカラーパレットから拾いました。

注意したこととしては、目がチカチカするとか、スライドになったら読みにくそうな配色とかは避けました。

感想

今回、LTへの参加によって下調べや言語化だったりでアウトプットによる学習というのを体感できた気がします。

登壇者のid:naomichi-h さんが「気軽にアウトプットしよう」というテーマでとても素敵なLTをされていましたが、自分もこれからアウトプットのハードルをどんどん下げていきたいなと思います。このブログも書くのにだいぶ時間を使ってしまいましたが、アウトプットを繰り返さないことには質もスピードも上がらないので、気軽にアウトプットするサイクルをどんどん回していけると理想です。

最後に、一人ではなく登壇者の方々と本番に向かって走っていくのはとても楽しかったです。

LTみてくださった方々、メンターさん、オーガナイザーのid:ud_ikeさん、登壇者のみなさまありがとうございました。

*1:時間かけたらなんとかなるかなと、ゴリ押しで進めるようとしてこうなった

*2:keynoteから話はそれますが、LT後に@ima1zumiさんの記事BuriKaigi2021 で Emoji の話をしました - esm アジャイル事業部 開発者ブログを読んで、revealjsというものを知ったので、今度使ってみたい。

【Linux】シェル変数

  • シェル変数とはbash内部で使用される変数
  • 数値や文字列を保存して様々な値を設定することができる

変数の設定

書式

<変数名>=<値>
  • 値にスペースを含む場合は'または"で囲む
  • コマンド見做されエラーとなるため=の前後にスペースを入れない。

シェル変数var1に値を設定する例

$ var1='test variable'
  • 設定した変数は<$変数名>で参照できる シェル変数var1を参照する例
$ echo $var1
test variable

PS1 プロンプトの設定

シェル変数を利用してプロンプトを変えてみる

$ ps1='bash> '
bash

意味が定義されている記号をPS1に設定するとそれぞれの値に置き換わって表示される

プロンプトで利用できる記号一覧

記号 内容
\d 「曜日 月 日」という形式の日付
\h ホスト名のうち、最初の.までの部分
\H ホスト名
\n 改行
\t HH:MM:SS形式の現在時刻
\u ユーザー名
\w カレントディレクトリ
\W カレントディレクトリの末尾のディレクトリ名
\$ ルートユーザーは# それ以外のユーザーは$
\ \

PATH コマンド検索パス

  • よく扱うPATHも当然シェル変数

シェル変数PATHの内容

$ echo $PATH
/usr/local/bin:/usr/bin:/usr/local/sbin:/usr/sbin:/bin:/sbin

LANG ロケール

  • 言語や日付などはロケールを基準に切り替えられる

日本語のUTF-8環境の場合

$ echo $LANG
ja_JP.UTF-8

localeコマンドに-aオプションをつけると利用可能なロケール一覧を表示できる

$ locale -a
C
POSIX
aa_DJ
・
・
・

ロケールの変更 アメリカ英語環境への切替例

$ LANG=en_US.UTF-8

その他のシェル変数

コマンド履歴に関するシェル変数

シェル変数名 内容
HISTFILE コマンドライン履歴を保存するファイル名。デフォルト値は/.bash_history
HISTFILESIZE 履歴ファイルに保存するコマンドライン履歴の最大行数
HISTSIZE コマンドライン履歴を保存する最大行数

シェルの現在の状態を知るための変数

シェル変数名 内容
HOME ホームディレクトリ
SHELL ログインシェルのパス
PWD カレントディレクトリ

【Linux】bashのオプション

  • bashはシェル自信がもつ様々な機能を利用するためにオプションを指定することができる
  • オプションは「オン」または「オフ」の値をとり、機能のオンオフを切り替えられる
  • オプションの設定にはsetやshoptコマンドを使う
  • シェルスクリプトでしか意味を持たないオプションもある

setコマンド

  • -oでオン +oでオフ

書式

set -o/+o <オプション名>

ignoreeeofオプションをオンに設定する例

$ set -o ignoreeof
#↓ctrl+dを入力
$
シェルから脱出するには "logout"を使用してください。
$

ignoreeofはctrl+dでシェルを終了しないオプション。誤操作での終了を防げる。

setコマンドのオプション一例

オプション名 内容
ignoreeof ctrl+dでシェルを終了しない
noclobber 既に存在するファイルをリダイレクトで上書きしない
noglob パス名展開を無効にする。*などがシェルに解釈されずそのまま*となる

shoptコマンド

  • 指定したオプションを-sでオンに、-uでオフにする
  • shoptで指定するオプション名はsetで指定するオプション名とは異なる

書式

shopt -s/-u <オプション名>

shoptコマンドのオプション一例

オプション名 内容
autocd ディレクトリ名のコマンドを実行すると、それがcdコマンドの引き数に指定されたものとして実行される
dotglob *や?を使ったパス名展開の結果に、.で始まるファイルも含める
cdspell cdコマンド実行時、ディレクトリのちょっとしたミスタイプが自動修正される
globstar パス名展開で**というパターンを使うと、サブディレクトリまで含めたすべてのファイルにマッチする
histappend bashを終了するとき、履歴ファイルにコマンド履歴を追記し、上書きしない

【Linux】aliasコマンド

Linux 
$ ls -a

というような頻繁に使うオプションは毎回オプションを入力するのが面倒。

aliasコマンドを使うと次回から入力を省略できる。

$ alias ls='ls -a'

で次回からオプションを手入力しなくてもlsと入力するだけでオプション付きで実行してくれる。

コンソールからaliasコマンドを実行した場合はログアウトなどのタイミングでリセットされる。

~/.bashrcに記述を追加しておくと設定を保存しておける。

aliasの一覧

$ alias

で登録されているaliasの一覧を表示できる

aliasの確認

コマンドがaliasかどうかはtypeコマンドで確認できる。

以下はlsはalias、cpはそのままコマンドとして解釈されている例

$ type ls
ls は 'ls -a'のエイリアスです。
$ type cp
cp は /bin/cp です

aliasの削除

unaliasコマンドでaliasの削除ができる。

引数には削除したいalias名を指定する。

$ unalias ls

aliasを一時的に無効にする

aliasをではなく元のコマンドを実行したい場合、以下3つのいづれかの方法で可能。

  1. コマンドをフルパスで指定
  2. commandを使う
  3. \を先頭につける
# コマンドをフルパスで指定
$ /bin/ls

# commandを使う
$ command ls

# \を先頭につける
$ \ls