すずかのプログラミング勉強記

元教員からエンジニアを目指す、プログラミング勉強記録です。

「追いかけるメソッド」は定義できるが「猫クラス」はエラーになる【Ruby】

はじめに

輪読会で「現場で使える Ruby on Rails 5速習実践ガイド」を読んでいると、Rubyの文法説明の例で「猫クラス」・「追いかけるメソッド」が出てきました。

実際に irbで「猫クラス」を作ったところ、class/module name must be CONSTANT (SyntaxError)というエラーが出て、定義できませんでした。

irb(main):* class 猫
irb(main):> end
/Users/suzuka/.rbenv/versions/3.3.0/lib/ruby/gems/3.3.0/gems/irb-1.11.2/lib/irb/workspace.rb:117:in `eval': (irb):1: class/module name must be CONSTANT (SyntaxError)

同じ日本語でも、「追いかけるメソッド」は定義できたため、「猫クラス」を定義できないのを不思議に思いました。

irb(main):* def 追いかける
irb(main):> end
=> :追いかける

この記事では、「猫クラス」が定義できない理由について、調べたことをまとめます。

初心者が書いた記事のため、間違いなどあれば指摘していただけると嬉しいです。


実行環境


結論

クラス名はアルファベット大文字始まりでなくてはいけないようです。

「猫クラス」はエラーになりますが、「A猫クラス」は定義できました。

irb(main):* class A猫
irb(main):> end
=> nil

メソッド名には「アルファベット大文字始まり」の決まりがないため、日本語はもちろん、絵文字や記号でも定義できました。

irb(main):* def 猫
irb(main):> end
=> :猫
irb(main):* def 🐈
irb(main):> end
=> :🐈
irb(main):* def -
irb(main):> end
=> :-


クラス名が大文字始まりの理由

では、なぜクラス名は大文字始まりでなくてはいけないのでしょうか?

「猫クラス」を定義した時の、エラー文を見てみましょう。

class/module name must be CONSTANT (SyntaxError)
訳:クラス/モジュール名は定数である必要があります (構文エラー)

一見クラス定義には関係なさそうな、「定数」という言葉が出てきました。

定数は大文字で始める

Ruby の変数・定数は、最初の一文字によってローカル変数・インスタンス変数・クラス変数・グローバル変数・定数のどれかに区別されます。

その中で、アルファベット大文字 (A-Z) で始まるものが定数です。

クラス定義では定数への代入が行われる

では、定数とクラスの定義はどんな関係があるのでしょうか?
公式ドキュメントに説明がありました。

クラス定義式はクラスオブジェクトの生成を行うと同時に、名前がクラス名である定数にクラスオブジェクトを代入する動作をします。クラス名を参照することは文法上は定数を参照していることになります。 変数と定数 (Ruby 3.3 リファレンスマニュアル)

少し説明が難しいので、「Catクラス」が定義された場合を例に説明します。

class Cat
end

このコードが実行された時、以下の 2 つの処理がされています。

  • 新しくクラスオブジェクトを作る。
    クラスもオブジェクトの一つで、Classクラスのインスタンスです。
  • クラスオブジェクトを定数「Cat」に代入する。

下のようなコードを思い浮かべると、オブジェクトの作成と代入のイメージしやすいかもしれません。(この書き方でもクラスを定義できます)

Cat = Class.new

つまり、クラス定義ではクラス名と同名の定数への代入が行われており、定数はアルファベット大文字で始まる必要があります。

まとめ

  • 「猫クラス」を定義するとエラーになる理由は、Rubyクラス名はアルファベット大文字始まりである必要があるから。
  • クラス名がアルファベット大文字始まりでないといけない理由は、クラス定義の際に内部で定数への代入が行われているから。


おまけ:「猫クラス」を作るには?

どうしても「猫クラス」を作りたかったので、方法を調べました。

1. gemを検討する

ruby-japanizeという、Rubyを日本語で書けるようにする素敵なgemがありました。

github.com

私の環境では Rubyのバージョンを切り替えてもエラーが出てしまい、動きませんでした。 下のようなコードが書けるみたいなので使ってみたかったです 🥲

  組(数値) {
  定義(:足す) {|他の数|
    自分.+(他の数)
    }
  }

  ある数 = 5.足す 6


2. 一度変数に代入する

「猫」という変数にクラスオブジェクトを代入するようにしたところ、猫.newができるようになりました。

猫 = Class.new do
  def 鳴く
    puts 'にゃー'
  end
end

タマ = 猫.new
タマ.鳴く
# => にゃー

ただし、名前なしのクラスオブジェクトを「猫」という変数に代入しているだけなので、クラス名を調べると「nil」になっています。

"文字列".class.name
# => "String"

タマ.class.name
# => nil

真の猫クラスを定義できたわけではなく、見た目上猫.newができているだけです😅

できる限り日本語にした

偽物とはいえ、せっかく猫.newができるようになったので、できる限り日本語のコードを書いてみました。

  • 準備:エイリアスの設定と、猫クラスの中に属性・メソッドを追加
alias 表示する puts

猫 = Class.new do
  attr_reader :名前

  def initialize(名前)
    @名前 = 名前
  end

  class << self
    alias 作る new
  end

  def 鳴く
    表示する 'にゃー'
  end
end
  • コードを日本語で動かす
ある猫 = 猫.作る('タマ')
ある猫.鳴く
表示する ある猫.名前
# => にゃー
# => タマ

日本語化はとても難しくて、初心者には短いコードで限界でした。

どうしても日本語でコードを書きたい時は、日本語プログラミング言語の「なでしこ」を使うのがいいと思いました。 nadesi.com

参考文献

フィヨルドブートキャンプでプログラミングの勉強をする【10ヶ月目】

フィヨルドブートキャンプ(以下FBC)で勉強して、10ヶ月目が終わりました。

1月からチーム開発に参加していますが、おかげさまでどうにか生き残っています。 今月も振り返りを書いていきます✨


1月の過ごし方

年末年始はアクティブに過ごしたので、その後は家に引きこもっていることが多かったです。
勉強中は寒さに耐えられず、作業机とこたつにいる時間が半々でした😅

あまり引きこもると体に悪いと思ったので、1月下旬に四谷にお出かけしました。 赤坂離宮の写真 初めて赤坂離宮に行ったのですが、噴水と建物が非常に綺麗で、貴族になった気持ちでした✨

勉強の状況

1/4~2/3で修了したプラクティスは5つでした。

1ヶ月間で修了したプラクティス一覧

アジャイル開発 /スクラム を理解する

開発に参加するための準備をする

Contextを使ってグローバルなstateを管理する

Webセキュリティ

ReactでSPAを作る

修了したプラクティス

残すところはあと「チーム開発」「自作サービス」のみです。いよいよ終盤に差し掛かりました。(噂によると、この後も長いらしいですが😅)


勉強時間

学習時間は10ヶ月間(307日)累計で1907時間でした。 学習時間

今月だけの勉強時間で見ると、約180時間で、年末でサボり気味だった12月とほぼ同じです。

年末年始休みで体力が回復したため、一月上旬は勉強時間が多めでした。 ただ下旬は、後述しますが、チーム開発の待ち時間を有効活用できなかったせいで、勉強時間が減ってしまいました😅


できるようになったこと

  • Reactでグローバルなstateを扱えるようになった
    Reactのメモアプリにログイン機能を追加し、Contextとカスタムフックを使って、ログイン状態を複数のコンポーネントで参照するようにしました。
    カスタムフックの使い方はドキュメントを読んでもなかなか理解できず、試行錯誤しましたが、実装できた時には簡潔に書けて感動しました。
  • Railsのセキュリティ対策について、基礎的な知識をつけられた
    Rails セキュリティガイドに一通り目を通し、セキュリティ対策が甘いブログを修正する課題に取り組みました。
    課題に加えてSQLインジェクションのまとめ記事を書いたことで、より理解を深められたと思います。
    RailsのSQLインジェクションを実験したまとめ - すずかのプログラミング勉強記

  • アジャイル開発」「スクラム」について自分の言葉で説明できるようになった
    本を二冊読み、理解した内容をレポートにまとめました。
    コピペではなく自分の言葉でまとめるため非常に時間がかかりましたが、図解することで理解が深まり、実際の現場へのイメージもわきました。

    作成した図 ⚠️FBC生はネタバレ注意

  • チーム開発でGood First Issueが初マージされた
    1/24の開発ミーティングからチーム開発に入り、2つのIssueがマージされました。
    初めて取り組んだIssueは「不要なボーダーを一つ消す」というものでしたが、普段使っているBootcampアプリで実際にボーダーが消えた時には感動しました✨

苦労したこと

  • GitHubやCircleCIの操作
    今までもGitHubは使っていましたが、リモートリポジトリとローカルの差を意識したり、レビュアー側で操作したりするのが初めてでした。
    ミスをしてプルリクエストをCloseすることはありましたが、手順のドキュメントや先輩方の日報がかなり丁寧なので、自信のない操作をその都度確認して乗り切りました。
  • コミュニケーションの取り方
    チーム開発では、開発ミーティングをはじめレビューや質問などで、コミュニケーションをとる機会が沢山あります。前職では対面で話すのが殆どだったので、オンラインのコミュニケーションの正解が分からず戸惑いました。
    特に現在取り組んでいるIssueは、Good First Issueより仕様が定まっていなかったり、技術的にわからないことがあったりして、どのタイミングで相談・質問するのか悩みました。
    でも、初歩的な質問をしても真剣に答えていただけるので、自分の中で質問へのハードルがかなり下がりました。
  • 待ち時間の活用
    チーム開発に入って最初の週は、どこで待ち時間が発生するのか分からず、CIの通過や質問の回答・新しいIssueの割り振りを待っているだけの時間が発生してしまいました。
    手が止まっている時間を最小化するため、今月は計画的にIssueを割り振ってもらおうと思います。

イベント参加など

  • Urawa.rb #1を主催
    沢山の方に拡散してもらったおかげで、満席の状態での開催でした。第一回目なので夫婦ともに緊張していましたが、参加者の皆さんが素敵な方々だったおかげで、楽しい時間になりました✨Urawa.rb #1の様子 | Notion
    あと数回開催したら、立ち上げまでの経緯を含めアウトプットしたいと思っています。
  • Omotesando.rbに参加
    1月が初参加で、LT会と懇親会に参加しました。自分には難しいLTもありましたが、それも含めて非常に勉強になり、特にテストカバレッジやN+1問題などは自作サービス・チーム開発に役に立ちそうです。
    懇親会では現役のエンジニアさんと沢山お話ができ、お仕事の話を伺ったり、就活のアドバイスを頂くことができました。
    居心地が良かったので、2/1の回にも参加し、こちらも有意義な時間になりました。

今の気持ち

FBCの卒業生の皆さんは、「チーム開発が一番楽しかった」と言っている方が多かったので、自分がチーム開発を楽しめるのか心配でした。今はまだ必死ですが、必死の中に楽しさを感じる瞬間が出てくるようになりました✨

これから難しいIssueやレビューが割り振られるようになると、当然辛くなる時期もあると思いますが、乗り越えられそうな気がしています!

今後もよろしくお願いします🙇‍♀️

2月の目標

  • チーム開発に全力で取り組む。
  • 自作サービスのペーパープロトタイプを作る。

RailsのSQLインジェクションを実験したまとめ

はじめに

Railsの勉強中、SQLインジェクションについての理解が浅く、つい危険なコードを書いてしまうことがありました。

この記事ではサンプルアプリを作って実際にSQLインジェクションを起こし、クエリを確認した結果をまとめます。 初心者が勉強のために書いた記事のため、間違いがあれば指摘していただけると助かります。


結論

Active Recordの検索メソッドwhereを使う時、条件文字列の中に変数を直接置くのは、SQLインジェクションの危険があるため、やってはいけない。

プレースホルダ を使うなど、自動的にエスケープされる書き方にする。

Project.where("name = '#{params[:name]}'") # NG
Project.where("name = ?", params[:name])   # OK


実行環境


サンプルアプリの準備

scaffoldを使い、必要最低限の実験用アプリを作りました。

scaffoldした時点のサンプルアプリ

コード:GitHub - SuzukaHori/Sample-app-for-experimentation

データベースは、memosテーブルにuser・content・draftのカラムがあります。 draftがtrueの場合はStatusに「下書き」、falseの場合は「公開」と表示されています。

データが3件入っており、長男と三男のメモは公開状態(水色)、次男のメモは下書き(ピンク)です。後ほど下書きメモは表示されないようにします。

このアプリに検索フォームを作り、SQLインジェクションを発生させ、発行されるクエリを確認していきます。


検証

1. 初めの状態を確認する

scaffoldした時点での、コントローラーのindexアクションのコードを抜粋します。

def index
  @memos = Memo.all
end

発行されるクエリは下の通りです。

SELECT "memos".* FROM "memos"
/* 訳: テーブルmemosからすべての列を選択する。*/


2. 下書きのメモを見えないようにする

このままだと下書きのメモまで見えてしまうので、draftカラムがfalseのメモだけが表示されるようにします。

コントローラーのindexアクションを以下のように書き換えます。

@memos = Memo.where(draft: false)

発行されるクエリは下の通りです。

SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0
/* 訳: テーブルmemosからdraftカラムがfalseのものを選択する。*/

0はfalseを示すので、下書き状態のメモだけが選択されます。

次男の下書きのメモは表示されなくなりました


3. 検索フォームで絞り込めるようにする

今回は検索フォームでSQLインジェクションを発生させるので、index.html.erbにコードを追加し、フォームを作りました。

コード

  <%= form_with url: memos_path, method: :get do |form| %>
      <%= search_field_tag :term, params[:term]%>
      <%= submit_tag 'Search', name: nil %>
  <% end %>

このフォームでメモを検索できるようにするため、コントローラーに絞り込みの条件を追加します。(脆弱性があるコードです)

@memos = Memo.where(draft: false).where("content LIKE '%#{params[:term]}%'") 

追加したwhere("content LIKE '%#{params[:term]}%'")の意味を確認しましょう。

手書きの説明

LIKEは検索、%は0文字以上の任意の文字列を示します。 #{}は式展開で、検索された文字を示すparams[:term]の値を取り出します。
つまりwhere("content LIKE '%#{params[:term]}%'")は、「contentが検索文字列を含むメモの絞り込み」を表しています。


検索文字列に「良い」を入れて、発行されるクエリを見てみましょう。

SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0 AND (content LIKE '%良い%') 
/* 訳: テーブルmemosから、draftカラムがfalseでありかつcontentカラムが「良い」を含むものを選択する。*/

ANDは「かつ」という意味なので、「下書きではない、かつ内容に良いを含むもの」を検索します。

実際に作ったフォームで「良い」を検索してみます。

長男の「良い日のメモ」だけを検索できました


SQLインジェクションを発生させてみる

さて、上で作った検索フォームはSQLインジェクション脆弱性があります。

検索フォームに') OR 1 = 1 --を入れて、実際にやってみましょう。

SQLインジェクションが発生し、次男の下書きメモも表示されてしまいました😱


クエリを確認します。

SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0 AND (content LIKE '%') OR 1 = 1 --%')
/* 訳: テーブルmemosから、draftカラムがfalseでありかつcontentカラムが任意の文字列を含むもの、または`1 = 1`の条件を満たすものを選択する。*/

結論から書くと、OR 1 = 1SQLの一部として解釈されることによって「すべてのデータを選択せよ」という意味になっています。

WHERE以降を分解します。

手書きの解説

AND (content LIKE '%')の部分では、%は任意の0文字以上を示すため、ここでは何も絞り込みません。

問題はOR 1 = 1です。ORは「または」という意味、1 = 1は常にtrueになりますので、すべてのデータがこの条件を満たします。さらに、--は行末までに記述された文字列をコメントとするため、不要な記号%')があることによる構文エラーも出ません。


4. プレースホルダを使って書き直す

このままではいけないので、SQLインジェクション対策をしましょう。

条件文字列の中には変数でなく?を置き、第二引数で変数を指定します。

@memos = Memo.where(draft: false).where("content LIKE ?", "%#{params[:term]}%")

ここで発行されるクエリは以下のとおりです。

SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0 AND (content LIKE '%'') OR 1 = 1 --%')
/* 訳: テーブルmemosから、draftカラムがfalseでありかつcontentカラムが「') OR 1 = 1 --」を含むものを選択する。*/

SQLインジェクション対策前後で比べてみましょう。

対策前:
SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0 AND (content LIKE '%') OR 1 = 1 --%') 
 
対策後:
SELECT "memos".* FROM "memos" WHERE "memos"."draft" = 0 AND (content LIKE '%'') OR 1 = 1 --%') 

違いがわかるでしょうか?

一つ目の%の後のシングルクォーテーションが2つに変わりました。 これは、Rails内部でシングルクォーテーションをエスケープしていることに起因しています。

Ruby on Railsには、特殊なSQL文字をフィルタするしくみが組み込まれており、「'」「"」「NULL」「改行」をエスケープします。Rails セキュリティガイド - Railsガイド


対策後のクエリのWHERE以降を分解してみましょう。

手書きの説明

SQLでシングルクォーテーションを2つ記述すると、最初の'が次の'エスケープします。
つまり対策後のコードでは、AND (content LIKE '%'') OR 1 = 1 --%')の2つ目のシングルクォーテーションが3つ目をエスケープしています。そのため、'%') OR 1 = 1 --%'全体が文字列とされ、SQLインジェクションが起こりません。


対策後のフォームで') OR 1 = 1 --を検索してみます。

SQLインジェクションは発生していません

単純に「') OR 1 = 1 --」という文字列を含むメモを検索するため、何も表示されなくなりました。


まとめ


感想

今回はサンプルアプリで実際にSQLインジェクションを発生させてみて、想像以上に簡単にデータが取り出せてしまうことに驚きました。

メソッドを正しく使えばRailsが自動で対策してくれることがわかったので、特にユーザが入力した文字列を使うときは、公式のドキュメントを読み込む癖をつけたいです。

また、データを処理するコードを書いた際に発行されているクエリを確認する重要性も再認識できました。to_sqlメソッドの使い方も覚えたので、今後は活用していきます。


参考文献

自作のnpmパッケージを公開しました

FJORD BOOT CAMPでは「自作のnpmをパッケージサイトへ公開する」という課題があります。

私は学校コード検索 APIを使用して、コマンドラインツール「gakkou-search」を作ったので、成果物について書きたいと思います。

ソースコードGitHub - SuzukaHori/gakkou_search www.npmjs.com

できること

校種・都道府県・設置区分・キーワードを指定して、日本の学校を検索します。 Image from Gyazo

特定の学校の選択すると詳細を表示します。「地図を開く」を選択するとブラウザが立ち上がり、Googleマップが表示されます。 Image from Gyazo

作った理由

Web APIを使ってみたかった

今までWeb APIを触ったことが無かったため、今回は使うと決めていました。 色々と検索して学校コード検索APIを見つけ、単純に学校を検索するのが面白かったこと・リリースされたばかりであることなどからこのAPIを使ってみたいと思いました。

学校データの活用に興味があった

教員時代、他校の住所・電話番号・地図などの学校情報を検索する機会が結構ありました。 似たような学校名が多いため、検索しても一発で出てこないことがあります。

例:「川越高校」の検索結果
埼玉県立川越高等学校三重県立川越高等学校川越市立川越高等学校・埼玉県立川越総合高等学校・埼玉県立川越女子高等学校・・・・などまだまだある。

いつか学校のデータがわかりやすく管理されて、先生たちの仕事が楽になったらいいなという気持ちで作りました。

起動方法

  • 「学校コード検索 API」への登録・トークンの生成
    学校コード検索 APIのウェブサイトにアクセスし、アカウントを作成します。 ログイン後、「トークンの一覧」ページから「トークンの生成」を行ってください。

  • API トークンを環境変数に設定
    export GAKKOU_SEARCH_API_TOKEN='あなたのAPIトークン'を実行し、トークンを設定します。

  • インストール・起動
    npx gakkou-searchを実行します。

工夫したこと

地図を開けるようにした

学校情報の詳細画面で「地図を開く」を選択すると、Googleマップが開きます。 地図を開く画面のスクリーンショット

実装は以下の方法で行いました。

  • 住所データからGoogleマップのURLを作る
    Googleマップの検索のURLhttps://www.google.com/maps/search/の後ろに住所を指定すると、学校の地図が表示できました。 URLの生成にあたっては、url-joinencodeURIを使用しました。
  • ターミナルからWebブラウザを開く
    child_processを利用してシェルコマンドのopenを実行し、Webブラウザで地図のURLを開くようにしました。

情報を取捨選択した

元のAPIでは、取得できる情報や指定できる検索条件がもっと多いのですが、シンプルに検索するため使用頻度が低いと思われるものを省略しました。(検索条件の「郵便番号」や詳細情報の「本校 or 分校」など)

悩んだのは「校種」で、「義務教育学校」や「専修学校」は一般の人には馴染みが薄いかもしれないため、当初省略することを考えました。しかし「世の中には色々な学校がある」のを知ってもらうのもいいと思い直し、13種類から選択できるままにしました。

学校種リスト

  ["0", "指定しない"],
  ["A1", "幼稚園"],
  ["A2", "幼保連携型こども園"],
  ["B1", "小学校"],
  ["C1", "中学校"],
  ["C2", "義務教育学校"],
  ["D1", "高等学校"],
  ["D2", "中等教育学校"],
  ["E1", "特別支援学校"],
  ["F1", "大学"],
  ["F2", "短期大学"],
  ["G1", "高等専門学校"],
  ["H1", "専修学校"],
  ["H2", "各種学校"],

例外処理

原因不明で何度やってもエラーになることを絶対に避けたいと思いました。最低限困らない例外処理として、「APIトークンの未設定」「APIトークンの間違い」「通信の失敗」などは日本語でメッセージが出るようにしました。

苦労したこと

どのAPIを使って何を作るか決めること

学校検索APIの他にも沢山のWeb APIを触り、うち2つでは実験的なnpmを作ってみました。しかし、使ってみると想像通りに動いてくれるものは思ったより少なかったです。
APIを使う場合は、作りたいものに対する十分な機能を持っているかを下調べする重要性を感じました。

何の機能を作って何を作らないのか決めること

当初の予定では、詳細検索と簡易検索の2つを作ったり、電話番号を取得できたりようにする予定でした。加えて、APIトークンの設定は面倒なので、本当はログイン不要のAPIを探したかったです😅
ただ、かけられる時間と天秤にかけて、やりたいことが実現できる最低限の機能に絞りました。

Enquirerの仕様を把握すること

対話型のCLIを作れるライブラリです。今回は単一選択や自動補完・ユーザの入力を受け付けるものなど、複数の質問形式を使用しました。
基本的に使いやすかったのですが、質問文が大量に出るなどバグ出てしまい、英語のREADMEや関連するIssueを調べるのが大変でした。

感想

何を作るか決めるところから取り組むのは初めてでしたが、非常に楽しかったです!

やりたいことの全てが実現できたわけではありませんが、初めて自分の力でプログラムを作り、それを公開して見てもらった時の喜びはひとしおでした✨

自作サービスで何を作るか悩み中ですが、作りたいものが決まれば楽しく開発できる気がしています。引き続き頑張ります。

フィヨルドブートキャンプでプログラミングの勉強をする【9ヶ月目】

2023年が終わりました。昨年お世話になった皆さま・ブログを見てくださった皆さま、ありがとうございました🙏

フィヨルドブートキャンプ(以下FBC)で勉強して9ヶ月目が終わったので、2024年最初の振り返りを書きます!


12月の過ごし方

12月はクリスマスをお祝いして、年末年始をゆっくり過ごし、充実した日々を過ごしました。

年明けには一泊二日で帰省しました。実家で飼っている猫ともたくさん遊べて、一年分の癒しを補充できました💓

猫の写真


勉強の状況

12/4~1/3で修了したプラクティスは4つでした。

1ヶ月間で修了したプラクティス一覧

SWRを使ってAPIをコールする

Reactを学ぶ

npm パッケージの作成

クラス(JavaScript)

後述しますが、「Reactを学ぶ」というプラクティスで約2週間止まっていました。


修了したプラクティス

「年内にチーム開発に入る」という計画は達成できませんでしたが、今月半ばには到達できそうです。


勉強時間

学習時間は9ヶ月間累計(276日)で1725時間でした。

学習時間

今月だけの勉強時間で見ると、約180時間で、先月より20時間減りました。

年末年始はたくさん遊んだので、勉強時間がいつもの半分以下になったのが原因です😅
後悔はしていませんが、1月はもっと頑張りたいです。


できるようになったこと

  • 自作のnpmをリリースできた
    「gakkou-search」というコマンドラインアプリを作り、npmのパッケージサイトにリリースしました。
    今までやってきた課題は「指定のものを要件通り作る」ことが多く、作るものから考えるのは初めてでした。考えたものを形にするのが面白くて、今までで一番楽しかったです✨(成果物についての記事を今月中に書く予定です)
  • Reactで簡単なアプリを作れるようになった
    Create React Appを使って、SPAのメモアプリを作りました。
    コンポーネントの分割の仕方やイベントハンドラの書き方・レンダリングなどに悉く引っかかり、非常に時間がかかりました。提出までも大変でしたが、まだレビュー中なので、引き続き理解しきれていないところを復習します!


苦労したこと

「React公式ドキュメント『Reactを学ぶ』を全て読む」という課題が大変でした。

最初に見た時は、序盤でわからなくなったため一度中断して、自宅にあった「React.js & Next.js超入門」という入門書を読みました。JSX・コンポーネント・ステートの基礎的な内容を理解してから「Reactを学ぶ」に再挑戦したのですが、それでも私にとっては難しかったです😅

しんどかったので、「分報」(個人が思っていることを書ける日記のようなもの)に愚痴を書いていました。皆さんに「わかる」リアクションを貰えて、気持ちが楽になりました。 分報の画面 分報の画面

加えて先に進んでいる受講生・卒業生の方々に、「ここは理解しておいた方がいい」「ここは最初自分も理解できなかった」というアドバイスをいただき、大変助かりました🙏

一章読むのに何時間もかかってしまいましたが、どうにか読み終えることができました。

イベント参加など

  • 「角谷トーク」に現地参加
    FBC顧問の角谷信太郎さんによるトークイベントに参加しました。
    お話は難しかったけれど、「パソコンカタカタより広い範囲がエンジニアの仕事になってる」「人間同士の会話をしているチームはうまくいく」など、刺さるキーワードがたくさんありました。「ソフトウェア開発ではエンジニアの役割が重要」ということを何度もおっしゃっていて、自分がエンジニアを目指しているのは間違っていなかったんだなと感じました。
    懇親会では、角谷さんやFBCのメンター・受講生の皆さんと交流できました😆

  • 「Urawa.rb」の告知
    以前から夫と話していた、地域.rbの実現に向けて動き始めました。FBCのメンター&アドバイザーの方々に、相談にのっていただきました。
    Xで沢山リポスト・いいねをしてもらったお陰で半日で定員になり、大変感謝しています。(参加登録できなかった皆さまごめんなさい🙇‍♀️)
    継続して活動できるよう、夫婦で頑張っていきたいです。

  • 「現場で使える Ruby on Rails 5速習実践ガイド」の輪読会に参加
    「皆についていけなのでは?」という不安があり、今までコードを書く輪読会に参加できていませんでしたが、この輪読会に第一回目から参加しています。皆さんとても優しく教えてくださり、初のドライバーや進行役を務めることができました。

今の気持ち

12月中旬は進捗が芳しくなく意欲低下気味でしたが、おかげさまで持ち直しました✨

Reactを頑張ったおかげで、年末年始には夫とペアプロをし、ちょっとしたWebアプリを作り始めることができました。 Image from Gyazo 今はやる気に満ち溢れているので、このモチベーションのままチーム開発まで駆け抜けたいです💪

1月の目標

  • ReactとWebセキュリティのプラクティスを修了する。
  • チーム開発で生き残る。
  • 「ピープルウエア」を読み終える。

2024年の目標

  • FBCを卒業して就職する。
  • Urawa.rbをとりあえず1年続ける。
  • 健康的な料理のレパートリーを増やす。
  • 1日2回のヨガを継続する。
  • 英会話のラジオを聞くことを習慣化する。

Rails Girls Tokyo 15thに参加したその後

これは「Rails Girls Japan Advent Calendar 2023」の23日目の記事です🎄

昨日はmaimux2xさんの 「Rails Girls ガイドの更新作業を頑張ったので振り返ります!」でした。

はじめに

今年は4月にRails Girls Tokyo 15thに参加して以来、Rails Girlsに色々とお世話になった年でした。参加後のできごとや心境の変化を、時系列に沿って振り返ります。

お世話になった皆様や、Rails Girlsについて知りたい方・参加を迷っている方に読んでいただけたら嬉しいです。


2023年〜4月:Rails Girlsに参加するまで(学校で働く&FBC入会)

3月末までは公立高校の教員をしており、プログラミングとは無縁の生活をしていました🏫

退職直前にProgateで遊び始め、HTMLとCSSがちょっとわかるようになりましたが、「ターミナル」や「Git」などの存在はもちろん知りませんでした。

プログラミングをもっと勉強してみたいと思い、Rails Girlsの4日前(4/3)にFJORD BOOT CAMP(以下FBC)に入会しました。


4月7〜8日:Rails Girls Tokyo 15thに参加

知り合いはゼロ人で、業界やRubyのことをほとんど知らず、Mac(買ったばかり)の操作すらおぼつかない状態で参加しました。

そんな状態でも楽しい時間を過ごすことができ、勉強を続けるモチベーションをいただきました。

FBCの日報に感想を書いていたので、一部を抜粋します。

  • プログラミングは誰かと一緒にやると、とても楽しいです。
  • コーチの方々が非常に優しく、説明が上手でした。エンジニアさんたちは、プログラミングが大好きでイキイキと働いている、素敵な人たちでした。
  • 現役エンジニア・デザイナー・人事・技術広報の方など様々な立場のコーチ・参加者の皆さんがいました。
  • プログラミングと全く無縁の生活を送っていた私にも、あたたかい応援の言葉をたくさんいただきました。初心者を積極的に受け入れ、多様性を尊重するRubyコミュニティの良さを感じました。
  • FBCのメンター・卒業生の方にも、対面でお会いできてモチベーションが100倍になりました。

この時のLTで、Rails Girls JapanのRubyKaigi 参加支援募集の話を聞き、RubyKaigiの存在を知ります。


5月11~13日:Rails Girlsの支援でRubyKaigi 2023に参加

Rails Girls Japanの参加支援を使って参加しました。何も分からない自分が本当に参加してもいいの?ぼっちになって寂しい思いはしたくない・・・という不安がありましたが、参加して良かったと心から思っています。

宿泊費・交通費・チケット代の経済的な支援に加え、関係者の皆さんとのランチ会など、交流の支援もしていただきました。

詳しい感想はこちら:
プログラミング歴1ヶ月でRubyKaigiに参加しました - すずかのプログラミング勉強記
Rails Girls - RubyKaigi 2023 参加支援についてのご報告

プログラミングを楽しみながら働いているエンジニアさんたちが輝いて見え、この辺りから本気で就職を目指すことを考えるようになります。


7月8日:Rails Girls Tokyo, More!に参加

Rails Girls卒業生向けのアフターフォロー勉強会です。

少人数で穏やかな雰囲気でした。とても親切にしていただいたので、もっと前から参加すれば良かったと後悔しています😅


8月19日:Rails Girls Tokyo, More!に参加(2回目)

RubyKaigiのfollow upイベントを眺めながら、もくもくしました。

後半はつきっきりでVSCodeのPrettierの設定を手伝ってもらい、夏休みのお土産もいただけて嬉しかったです!


11月10日:RubyWorld Conference 2023の配信を見る

江森さんの基調講演「Rubyコミュニティで過ごした10年」を聞きました。

Rubyコミュニティの良さや10年間の発展、Rails Girlsの根底にある考え方などを発表されていて、感銘を受けました。 RubyWorld Conference 2023 日本語チャンネル 2日目 - YouTube

Rails Girls Tokyoで、私の「知り合いのいない世界へ一歩踏み出す勇気」をサポートしてもらっていたことに気づき、改めて感謝の気持ちが湧きました。私もいつかコミュニティに貢献できたらいいなと思いました。


12月23日:Advent Calendarの記事を書いている ←今

プログラミングの勉強歴は約8ヶ月になり、LinuxRubyRuby on RailsJavaScript・Reactなどを学習しました。FBCのカリキュラムも後半に差し掛かり、卒業が少しずつ見えてきました。

4月当初は「文系未経験の自分にプログラミングなんてできるの?」と自信がありませんでしたが、今はスキルを身につけて就職し、幸せなエンジニアになることを目標としています!

終わりに

私がプログラミング始めたての段階を乗り越えられたのは、Rails Girls Tokyoで「プログラミングってなんか面白そう」と感じたおかげだと思います。

もし参加しなかったら、数週間で「プログラミングって難しくてつまらない」と挫折していたかもしれないです😅

貴重な機会を頂けたことや、その後も様々な面で支援していただいたことに、心から感謝しています。

FBC卒業→就職→一人前のエンジニアになるまで、まだまだ長い道のりですが、今後もよろしくお願いします🙏

フィヨルドブートキャンプでプログラミングの勉強をする【8ヶ月目】

4月からFJORD BOOT CAMP(フィヨルドブートキャンプ)で勉強して、あっという間に8ヶ月目が終了しました。今月も振り返りを書きます!

11月の過ごし方

前半は暖かくて過ごしやすかったので、お出かけをしたりバドミントンで遊んだりなど、なるべく外に出るようにしました。

特に、豊洲のWILDMAGICというインスタ映え全開の施設で、友人とバーベキューをしたのが楽しかったです❣️ バーベキュー会場の写真

後半になるとかなり冷え込むようになり、コタツにひきこもりがちなってしまいました😅

勉強の状況

11/4~12/3で、修了したプラクティスは3つだけでした😭😭😭

かなりの時間がかかった2つの課題(JavaScriptのクラス、自作npm)をまだ修了できていないのが原因だと思います。

1ヶ月間で修了したプラクティス一覧

Reactチュートリアル

非同期処理(JavaScript)

JavaScript入門


今月は、非同期処理・クラス・自作npmというJavaScriptの3つの課題にそれぞれ1週間強の時間をかけ、月末になってようやくReactに着手することができました。

勉強時間

学習時間は8ヶ月間累計(245日)で1547時間でした。

学習時間

今月だけの勉強時間で見ると、約200時間で、いつもとほぼ同じです。 課題の進捗はあまりないものの、勉強の習慣は継続できました。

できるようになったこと

  • 非同期処理の基本的な書き方を理解できた
    データベースを操作するプログラムを、callbackを使う・Promiseを使う・async/awaitを使うという3つの方法で作りました。Promiseがどんなものか分かっていなかったために、思ったような順番で動いてくれず、試行錯誤しました。
    メンターさんに熱心に教えていただいたお陰で、基本的な構文を理解でき、その後非同期処理を使う際にはあまり苦労せず書けるようになりました。

  • JavaScriptのクラス構文を使って、簡単なプログラムを作れるようになった
    クラス構文を使って、コマンドラインのメモアプリを作る課題に取り組みました。
    メモアプリの画面 オブジェクト指向への理解が十分でなかったこともあり、「何のクラスを作っていいのかわからない」状態で固まってしまいました。加えて作るクラスが決まった後も、コンストラクタやプライベートメソットの書き方・thisの使い方など、Rubyと違う部分にことごとく引っかかりました。
    メンターさんの助けもあり、必須でないプラスアルファの要件(選んだメモをエディタで開いて編集できる機能を作る)にも取り組んで、動作する状態にすることができました。

  • 自作のnpm(試作品)が動作するようになった
    FBCには「自分で作りたいnpmを作る」という課題があります。今までは要件に沿ったプログラムを作る経験しかしていなかったので、何を作るか決めるのに苦労しました。複数のAPIを触りながら考えた結果、私は「学校検索npm」を作ることにしました。
    まだ作業が残っているため提出していませんが、来月の振り返りブログでは、完成したnpmのことを書けると思います!

苦労していること

  • プロトタイプベースのオブジェクト指向への理解が浅い
    プロトタイプベース | TypeScript入門『サバイバルTypeScript』などで勉強し、「オブジェクトを素にして新しいオブジェクトを作る」「クラス構文はシンタックスシュガーのようなもの」ということはなんとなく理解できました。でも、「プロトタイプベースとはどんなもので、クラスベースとどう違うのか」を自分の言葉で説明できるほど理解できてはいません💦
    まだしばらくJavaScriptを勉強するので、徐々に理解していきたいです。

  • Reactの全体像がわからない
    フロントエンドのライブラリやフレームワークに触れるのが初めてなので、Reactの全てが新鮮です。見た目が変わっていくのが面白く、ワクワクします✨
    ただ、皆さんが分かりやすいと言っていたチュートリアルも私にとっては難しく、どこがどうなっているのか分からなくなってしまいました💦 もう少し基礎の基礎から勉強したいと思ったため、React.js&Next.js超入門を読み始めました。早く何か作れるようになりたいです!!

参加したイベント

今の気持ち

今月は思ったようにプラクティスを修了することができず、停滞気味でした。
「年内にチーム開発に入れたらいいな〜」と思っていたのですが、相当頑張らないと難しそうです💦

ただ目に見える進捗は少なくても、一ヶ月前の自分より確実に成長できているとは思います。特に自作npmの試作品を家族に見せびらかした時に、褒めてもらえたのが嬉しかったです。

進捗も大事ですが、焦らず一歩ずつ頑張りたいと思います!

12月の目標

  • ブログを3つ書く。
  • Reactのプラクティスの課題を全て提出する。
  • Webセキュリティの課題を提出する。