日曜日に丸一日かけて作成した「割り勘、立て替えアプリ」の概要
はじめに
ChatGPTと相談しながら、Ruby on Rails製の「割り勘、立て替えアプリ」を作成した。
その概要について書いていこう。
トップページ

ターミナルで「rails s」を打ち込むことで、ブラウザで「localhost:3000」を打ち込むと、上記の画面にアクセスできる。

以下がRailsの対象テンプレートファイル。

新規登録画面
支払い登録をクリックすると、以下の画面に遷移する。

テンプレートファイルはこちら。


日曜日に即興で作ったので、CSSが直接指定されていたりするが、気にしないでいただきたい。
こういったスタイルの指定方法もある。
支払った人
現状、空である。

その理由は、usersテーブルが空だから。
<div style="margin-bottom: 1.5em;">
<%= form.label :payer_id, "支払った人", style: "display: block" %>
<%= form.collection_select :payer_id, User.all, :id, :name, { prompt: "選択してください" }, { id: "payer_select" } %>
</div>
友人の名前を使っていたから、プライバシー保護のために、ブログを書くときは消しておいた。
usersテーブルにデータを入れよう。以下の手順で。
seeds.rbに記入。

rails db:seed。確認すると、問題なく入っていた。

postgreを抜けて、rails sで開発環境を起動する。

先ほどの選択肢に、ユーザが追加されていることが確認できた。

新しい支払いを登録する
Aさんが支払って、Bさん、Cさんが返済するとしよう。
大阪で開催される「夏フェス」のチケット代が3人で30,000円と仮定する。

登録すると、トップページに遷移して、コンテンツが追加される。

Bさんというユーザ名なので、Bさんさんとなってしまった。
返済状況を更新する
返済状況を更新する画面は以下の通り。


Bさんの返済済みにチェックを入れて、「返済状況を更新」をクリックすると・・

トップページに遷移して、❌が☑️に変更されていることが確認できる。

支払いを編集する
編集ボタンをクリックすると、以下の画面に遷移する。

返済する人の「Bさん」「Cさん」のチェックが外れてしまっているので、追加して、支払額を50000円に変更しよう。

登録するをクリックすると・・
トップページに戻り、割り勘の金額が計算されたものが表示されている。

支払いを削除する
削除ボタンを押すと、夏フェスが消える。

コメントを残す