2022 ソフトウェア設計及び演習用の班Wiki
22::gr01::中間発表
6月3日までの進捗
-
タイトルページ
前回サーバーをレンタルしたが、思った以上に動作が重い（おそらく無料だったため）ことや、動作確認のためにいちいちphpファイルをアップロードする必要が生じる（大学の端末に仮想環境をつくるのが難しいため）など、開発の効率が悪いため、IndexedDBでデータを管理することにした。
IndexedDBはブラウザ上にデータを保存するためWebサーバーを必要とせず、ローカル環境で簡単に動作を確認できる。また、各ユーザーのブラウザにデータを保存するため、ログイン機能等が不要になったり、javascriptだけで操作が行える、簡単に扱えるライブラリがあるなど、今回の開発をする上で使用するメリットは大きいと感じた。
今回の用途に特化した形の、比較的簡単にデータベースへアクセスできる関数が出来上がってきたので、次回までには他の人にも容易にデータを扱えるような環境を整えられると思う。
下の画像は、データを格納したり、指定した条件のデータを取り出す機能を備えたサンプルページの画像。
・前回作ったカレンダーで無効な入力ができないようにした。
・任意の日付の所の色を変えるプログラムを考えた。
・JavaScriptでのタイマー作成
・タイマー.htmlにあたるページを作成（完成）
・タイマー終了.htmlにあたるページを作成（未完成）
・タイマー部分と終了画面のプロトタイピングをした。
・タイマー機能や画面遷移といった基本的な機能のシステムを作ることができた
中間発表
モジュールの説明
- title.html:タイトル画面の表示
- calender.html:カレンダー画面の表示
- input.html:予定入力画面の表示
- timer.html:タイマー画面の表示
- timer_finish.html:タイマー停止後の画面の表示
- debug.html:デバック用のファイル。予定などの情報の入出力の動作確認やページへの反映をチェックする
- main.css:全体のデザインを統一するためのcssファイル
- ScheduleDataManager.js:全体のデータ管理を行う。データ表示が必要なモジュールとのみ関係を持つ
- cal_prog.js:表示されたカレンダーに目的の操作を加える。予定の表示など。
- timer.js:表示されたタイマーに目的の操作を加える。開始終了など。
- timer_finish.js:表示されたタイマー終了画面に目的の操作を加える。ページの移動など。
最終更新日：2022/06/17 14:59:33
