1
0

5章:機能管理を行うWEBアプリケーション成果物(途中経過)

Posted at

個人の学習用として機能管理を行うWEBアプリを作成しております。

作成経過の目次
1章:学習用のWebアプリを作成しよう(技術選定)
2章:GitHub,GitLab,Visual Studio Codeでリポジトリの作成・連携を行う
3章:画面遷移図・テーブル設計を作成する
4章:基本設計仕様書を作成する

本記事で伝えたいこと

自身のアウトプット用と、これから開発をする方に少しでも役立つ情報が
あればいいなと思い作成いたしました。

作成経緯

Javaの学習をする際、Streamやぬるぽ等、特定の処理について
実装をして学びたい機会があります。
実装を行う際、毎回環境構築から始まり、コード管理をGithubで行っても
再度それを見ることがない(いちいち探したりするのが面倒くさい)ので
上手く管理ができていませんでした。

そんな中、実装した機能についてはまとめて画面上で管理できるようにすれば、
現状を改善できるかもしれないと思い、本アプリの作成に取り掛かりました。

機能概要

・初期表示時、保存してあるシステムの一覧を表示します
・機能を選択→実行をすると保存してある機能が実行されます
・ホーム画面から外部リンクへ遷移ができます
image.png

機能説明

下記がホーム画面になります。

image.png

機能としてはざっくり2点です。
1.Feature List
 自身で作成した処理をまとめる箇所です。
2.External Links
 外部リンクです。よく使っているサイトをホーム画面から飛べるようにしてあります。

Feature Listについて
image.png

Feature Listにある機能名のボタンを押下すると、上記モーダル画面が開きます。
Runボタンを押下すると機能が実行。Cancelボタンを押下するとホーム画面へ戻ります。

作成にあたって意識したこと

・デザインはかなりシンプルでちょっとかっこいい感じになるようにしました。
・レスポンシブデザインにすることで、画面サイズを変えても
 操作しやすいようにしました。
・ソースコードもシンプルに、スパゲティ回避できるようにしました。

反省点

・実装しようと思っていた機能の実装をまだ完走できていない
・リファクタリング、テスト、DevOpsを行っていない

言い訳:AWSの勉強をしたくなったので、一時離脱します。個人開発だから許されるね。

さいごに

一旦本アプリの開発は終わりにします。今学びたいAWSが一区切りできたら再開しようと思います。
本アプリはGithubにあげているので、もし機会があれば公開してみようかなと考え中…。
以上です。ありがとうございました。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0