勉強記録ウェブアプリ作成の軌跡 0:仕様・要件定義

概要

「【Rails×React】UberEats風アプリを作りながら、SPA開発を学ぼう」を使って学んでいく上で自分で勉強記録アプリを作りたいと思ったので、完成するかは置いといて、とりあえず学んだことを自分が作りたいものに置き換えて考えていく。

内容

今回はどういったものを作りたいか、そして作成したいウェブアプリの仕様や要件等を決めていく。

何を作りたいのか

勉強記録アプリ

ざっくり言うと、資格など勉強したことを記事のような形でまとめていき、のちに復習できるよう重要な点については見え隠れすることができるウェブアプリを作る。

環境

• サーバーサイド
  • Ruby on Rails
• フロントエンド
  • slim
  • css
  • JavaScript(React)

必要な実装

• メインページ
  • 他の画面に遷移するための動線
  • どういったページなのか
• ユーザページ
  • ユーザが作成した記事の一覧表示
    • 各記事に前回解いた時にどれぐらいの正解率だったか
  • 記事の検索
• 復習ページ
  • 記事を表示
  • 穴埋め
  • そのページ内でどれだけ会ってたかどうか
• 記事作成ページ
  • htmlで記事を作成する⁇
  • もしくはMarkdownで作成⁇
  • いったんhtml形式の記事を作成
• テスト
• ユーザの登録・ログイン処理

特に実装しないこと

• システム管理者用画面
  • もしちゃんと完成すれば考える
• 本番デプロイ
  • もしちゃんと完成すれば考える
• 他のユーザとの共有機能
  • いったん自分の記事のみしか参照できないようにする
  • 本番デプロイ等した際はqiitaのようないろんな人と記事を共有できるようにしたい

実装の順番

今回は参考にしている教材がありそちらに則り進めていくため、サーバーサイドを作成したのち、フロントエンドの実装に移っていきたいと思う。
このような方法を取る理由としては、サーバーサイドとフロントエンドを切り替える手間を省くことが理由としてあるらしい。
自分としては、1ページごとにサーバーサイド・フロントエンドを同時に作成していきたいが、今回はやめておく。

参考記事

• 【Rails×React】UberEats風アプリを作りながら、SPA開発を学ぼう
  • https://www.techpit.jp/courses/138