Ruby on RailsでWebアプリ「Norutoki」を開発・公開しました
AQUA VISIONでは、これまでホームページ制作やECサイトの構築を中心に取り組んできましたが、新たにRuby on Railsを活用したWebアプリケーションの開発にも取り組んでいます。
このたび、その開発実績として、よく利用するバスの時刻を手軽に確認できるWebアプリ「Norutoki（ノルトキ）」のMVP版を公開しました。
今回は、Norutokiの機能や開発に使用した技術、そしてこれらの技術を活用して実現できるWebシステムについてご紹介します。
Norutoki（ノルトキ）とは？
「いつもの移動を、検索しない。」
Norutokiは、普段よく利用するバスのルートや時刻表を登録しておくことで、次の出発時刻を素早く確認できるWebアプリケーションです。
バスを利用する際、毎回時刻表を検索したり、曜日に合ったダイヤを探したりすることがあります。
Norutokiでは、よく利用するルートをあらかじめ登録しておくことで、必要な時刻情報を簡単に確認できるようにしました。
公開アプリ：Norutoki（ノルトキ）はこちら
※現在はMVP（必要最小限の機能を備えた初期公開版）として公開しています。
Norutokiの主な機能
1. ユーザー登録・ログイン機能
ユーザーごとにアカウントを作成し、ログインしてサービスを利用できます。
登録したルートや時刻表はユーザーごとに管理され、自分専用の情報として利用できます。
2. よく利用するルートの登録・管理
普段利用するバスのルートを登録し、一覧から確認できます。
行き・帰りなどのルートを管理でき、登録内容の編集や削除にも対応しています。
3. 時刻表の登録・編集
平日・土曜・日曜祝日の時刻表をそれぞれ登録できます。
登録した時刻表は、必要に応じて追加・編集・削除が可能です。
時刻表の登録画面では、曜日区分を選択し、出発時刻やメモを入力できます。
複数の出発時刻を追加したり、不要になった時刻を削除したりすることも可能です。
4. 次の出発時刻を表示
現在時刻をもとに、登録した時刻表から次に利用できる便を表示します。
出発までの残り時間も確認できるため、毎回時刻表を見比べる手間を減らせます。
また、当日の便が終了している場合などには、次回の運行日を検索して表示する仕組みも実装しています。
5. 曜日・祝日を考慮した時刻表の判定
平日・土曜・日曜祝日の区分に加え、日本の祝日も考慮して、利用する時刻表を判定します。
単に登録情報を表示するだけでなく、日付や条件に応じて必要なデータを取得する処理を実装しています。
6. スマートフォンにも対応
Norutokiは、パソコンだけでなく、スマートフォンからも利用できるWebアプリケーションです。
スマートフォンの画面サイズに合わせた表示に対応しており、外出先でも登録したルートや次の出発時刻を手軽に確認できます。
専用アプリをインストールする必要がなく、ブラウザからアクセスして利用できるのも特徴です。
開発に使用した技術
Norutokiでは、主に以下の技術を使用しています。
- Ruby on Rails：Webアプリケーションの開発
- PostgreSQL：ユーザー情報やルート、時刻表などのデータ管理
- HTML / CSS / JavaScript：画面の構築や操作機能
- Hotwire（Turbo）：Railsと連携した画面処理
- Render：Webアプリケーションの公開
- GitHub / GitHub Actions：ソースコード管理・自動テスト
また、Minitestによる動作確認や、RuboCopなどを活用したコード品質の確認にも取り組みました。
Webアプリケーション開発でできること
Norutokiで使用したRuby on Railsは、バスの時刻表アプリだけでなく、さまざまなWebシステムの開発に活用できる技術です。
例えば、以下のような機能を持つWebアプリケーションを構築できます。
会員登録・ログイン機能
ユーザーごとにアカウントを発行し、ログインした人だけが利用できるページや機能を作成できます。
活用例
- 会員専用サイト
- スタッフ専用ページ
- 顧客専用マイページ
- 会員向けコンテンツの閲覧
データの登録・編集・管理機能
Web上の入力フォームから情報を登録し、データベースに保存・管理できます。
活用例
- 顧客情報の管理
- 案件の進捗管理
- 商品・在庫情報の管理
- スタッフの日報管理
掲示板・情報共有機能
ユーザーが情報を投稿したり、コメントを登録したりする仕組みを開発できます。
活用例
- 社内掲示板
- スタッフ間の申し送り
- 会員向けコミュニティ
- お知らせ・業務連絡の共有
検索・条件による表示機能
登録された情報から、条件に合うデータを検索・表示する仕組みを構築できます。
活用例
- 顧客名や案件名による検索
- 対応状況による絞り込み
- 日付・曜日によるスケジュール表示
- 担当者ごとの案件一覧
※上記にはNorutokiで実装した機能の応用例に加え、今後の開発対象となる機能も含まれます。
例えば、こんなお困りごとを解決できます
Webアプリケーションは、大規模なサービスだけでなく、小規模な事業者の業務効率化にも活用できます。
「顧客情報や案件の進捗がバラバラになっている」
Excelやメール、LINEなどで顧客情報や案件を管理していると、必要な情報を探すのに時間がかかったり、対応状況が分かりにくくなったりすることがあります。
顧客情報・案件内容・進捗・対応履歴を一つの画面で管理できる仕組みにすることで、情報を確認しやすくできます。
「スタッフ間の情報共有がうまくいかない」
業務連絡がLINEなどに埋もれてしまい、重要なお知らせを見落とすことがあります。
スタッフ専用の掲示板や情報共有ページを設けることで、必要な情報をまとめて確認できるようになります。
「毎回同じ情報を入力・転記している」
問い合わせ内容を別の管理表に入力し直したり、作業報告を集計したりする業務には、手間がかかります。
入力フォームとデータベースを連携させることで、情報の登録・管理を効率化できる場合があります。
「お客様ごとに異なる情報を表示したい」
お客様専用のページを用意し、契約情報や案件の進捗、資料などを個別に確認できる仕組みも考えられます。
ログイン機能とデータ管理を組み合わせることで、利用者ごとに表示内容を切り替えるWebサービスの開発が可能です。
「外出先や現場からも情報を確認・入力したい」
事務所のパソコンでしか情報を確認できないと、外出中や現場で必要な情報を確認するために、電話やLINEで問い合わせる手間が発生することがあります。
スマートフォンに対応したWebシステムであれば、インターネット環境がある場所から、必要な情報を確認したり、その場でデータを登録・更新したりできます。
例えば、営業担当者が訪問先で顧客情報を確認したり、現場スタッフが作業完了後にスマートフォンから報告を登録したりする仕組みも開発できます。
専用アプリのインストールが不要なため、普段使用しているスマートフォンのブラウザから利用できる点もメリットです。
WordPressとWebアプリケーションの違い
WordPressは、ホームページやブログ、お知らせの更新など、コンテンツを管理するWebサイトに適しています。
一方、Ruby on Railsなどを使ったWebアプリケーションは、ユーザーごとの情報管理や独自の業務処理など、目的に合わせた機能を柔軟に設計できます。
もちろん、WordPressのプラグインや既存サービスで十分に実現できる場合もあります。
AQUA VISIONでは、必要以上に複雑なシステムを開発するのではなく、用途やご予算に合わせて適切な方法を検討していきたいと考えています。
今後の取り組みについて
今回のNorutokiの開発を通じて、ユーザー認証、データベース設計、情報の登録・編集・削除、条件に応じたデータの取得、Webアプリケーションの公開まで、一連の開発に取り組みました。
今後は、これまでのホームページ制作・WordPress構築の経験に加え、Ruby on Railsを活用した小規模なWebアプリケーションや業務効率化ツールの開発にも取り組んでいきます。
パソコンだけでなく、スマートフォンからも利用できるWebシステムを通じて、外出先での情報確認や現場からの報告、顧客・案件情報の管理など、日々の業務をより便利にする仕組みをご提案していきたいと考えています。
- ホームページだけでは実現しにくい機能を追加したい
- ExcelやLINEで行っている業務をもっと効率化したい
- ログイン機能を備えた専用のWebシステムを作りたい
- スマートフォンからも利用できる業務管理ツールを導入したい
そのようなお悩みがございましたら、お気軽にご相談ください。
業務内容やご希望をお伺いしたうえで、実現方法を検討いたします。
Norutoki（ノルトキ）
公開URL：https://norutoki.onrender.com/
GitHub：https://github.com/yusukekawashita-code/norutoki
開発形態：個人開発（MVP版）
