SPA開発 1. 今回作るアプリケーション #02
2019年10月12日に更新

今回作るRailsアプリの全体像と機能の整理

アプリケーションの概要

完成イメージなどの詳細はこちらの記事をご覧ください。
アプリの完成イメージ画像と作ろうと思った経緯

利用する人

税理士・会計事務所の職員です。

利用するタイミング

会計ソフトに入力した後に利用します。

利用する方法

会計ソフト上で集計された「貸借対照表」と「損益計算書」のCSVデータを、このアプリケーションに流し込みます。

アプリケーションの設計

今回利用するツールとバージョンの確認

  • OS … mac v10.14.5
  • バックエンド … Rails v6.0.0.rc1 apiモード
  • フロントエンド … Nuxt.js v2.8.0
  • バージョン管理ツール …Git (ソースコードの変更履歴を記録したり、追跡するためのツールです)
  • コードの保管場所 … Bitbucket (ソースコードのバックアップ、他開発者との共有を可能にするサービスです)
  • デプロイ先 … heroku (webアプリをインターネット上に簡単に公開することができるサービスです)

設計のイメージ

spaアプリ設計

まず左、ローカル開発環境

Rails上にNuxtプロジェクトを作成し、一つのRailsプロジェクトとして管理します。

NuxtがリクエストしたデータをRailsが返し、Nuxt上で表示します。

右、本番環境

Gitを使いherokuにRailsプロジェクトをアップします。

heroku上でwebアプリケーションが動きます。

ソースコードのバックアップ

Bitbucketには、Gitを使ってRailsプロジェクトをアップします。

アプリケーションの機能

ざっくりとアプリケーションの機能を整理をしておきます。

実装の優先度が高い順に並べています。

  1. ユーザーはメールアドレスとパスワードでログインできる
    JWT認証によりログイン機能を実装していきます。
  2. ユーザーは複数の会社を保有できる
  3. 会社は複数の会計年度を保有できる
  4. 会社単位で勘定科目の登録、更新、削除ができる
  5. 会計年度単位で数値の登録、更新、削除ができる
  6. 会計ソフトの出力フォーマットに合わせたCSV取り込みができる
  7. 貸借対照表、損益計算書を表示する
  8. 主要科目のグラフを自動で生成する
    vue-chart.jsを使います。
  9. 会社単位で、データを共有するユーザーを招待することができる
  10. データ共有中のユーザーは、会計数値の閲覧、編集が可能となる
  11. 会計数値には、コメントを導入することができる

7の貸借対照表、損益計算書を表示する実装が最大の難所となりそうです。

次回予告

今回はアプリケーションの設計と機能を整理しました。

次回はmacにRailsをインストールしていきます。

現在、カテゴリー「Rails apiとNuxt.jsでSPA開発」のデモアプリを構築中です。記事になるまでもう少々のお時間が必要です。ブログの更新が止まって申し訳ありません。デモアプリの進捗状況は こちらの記事 で随時お伝えしてまいります。
スポンサー広告
次の記事はこちらです
SPA開発
今日のTweet
スポンサー広告