初アプリ開発#01 アプリ概要、設計を考える。
ついにオリジナルアプリ開発
こんにちは、もりのです。
4月からRailsの学習を始め、やっとオリジナルアプリ開発にまでこぎつけました。
学習初期の段階から「最も力がつくのは、実際に自分で作ることだ!」と、ネットで見て「早く基礎学習を終わらせ、オリジナルアプリ開発に着手するぞ!!」と意気込んでいましたが、Railsチュートリアルにボコボコにされ泣いていたら4ヶ月もたってしまいました。。。
何はともあれ、初のオリジナルアプリ開発に着手しましたので、今後はブログで進捗状況を残しながら開発して行きたいと思います。
まずはアプリの設計からです。
UIのモックも作成してみたので、そちらも参考にしながらアプリの概要や開発環境などを考えてみました。
目次
- 開発環境
- アプリ概要
- 基本機能
- 必要ページ
- 導入gem
- DB設計
開発環境
- Ruby 2.5.0
- Ruby on Rails 5.2.0
- テキストエディタ: Atom
- ターミナル: Macにデフォルトでインストールされているもの
アプリ概要
自分が調べた単語名と、その意味を登録することができるアプリ
学術書などを読んでいるときに多くの未知単語が出てくるので、それらを洗い出してまとめておき、後からまとめて意味を登録しやすくしたメモアプリです。
基本機能
- ユーザー登録機能(ログイン/ログアウト)
- TwitterAPIでのユーザー登録
- 単語登録機能(編集/削除)
- 意味登録機能(編集/削除)
- 単語検索機能
- ページネーション機能
必要ページ
- サービスTopページ(ログイン前のページ)
- 新規登録ページ
- ログインページ
- 単語新規登録/意味未登録単語一覧ページ(ログイン後のTopページ)
- 単語編集ページ
- 単語一覧ページ
- 単語詳細ページ
必要とするページは上記の計7ページです。
各ページのUI設計を[Moqups](https://moqups.com/)という無料で使えるUI設計ツールを利用して作成したので、画像を記事の最後に載せておきます。興味がある方は見て下さい。
導入gem
- devise(ユーザー認証)
- kaminari(ページネーション機能)
- ransack(検索機能)
- bootstrap(デザイン)
DB設計
users
- id
- name
- password
words - name
- content
- user_id
以上が今回作るアプリの設計になります。
次回からはアプリの進捗状況を少しずつ書いていこうと思います。
各ページのモック
サービスTopページ(ログイン前のページ)
新規登録ページ
ログインページ
単語新規登録/意味未登録単語一覧ページ(ログイン後のTopページ)
単語編集ページ
単語一覧ページ
単語詳細ページ