1.構成
1-1.全体構成図

1-2.選定技術
用途 | 利用技術 |
---|---|
フロントエンド | Vue.js |
予定管理・予定情報提供 | node.js,MariaDB |
本システムにおいてはいち家庭内での予定管理を目的とし、「日付 対 予定」のみを管理すればよいユースケースでシステムを設計しました。ユーザ認証はせず、通常のカレンダーと同様にローカルネットワーク内のだれからも書きこみ・削除を行えます。
2.システム説明
2-1.画面サンプル
- カレンダー表示画面

所定の年月日に何の予定が入っているかを表示する画面。予定が入っている日程をクリックすると予定の詳細画面がポップアップとして立ち上がる。
- 予定登録画面


カレンダーコンテンツの予定詳細を表示する画面です。新規登録・予定の内容編集についてもこの画面から行います。
2-2.ページ概要
ページ | 概要 |
---|---|
カレンダー画面 | 予定のタイトルと時刻を表示する画面です。このページで |
予定管理ポップアップ | 予定の詳細を知りたい場合や、予定内容を更新・新規登録・削除したい場合に利用する画面です。 |
2-3.機能概要
機能 | 概要 |
---|---|
カレンダーコンテンツ新規作成 | フォームに記入した内容を基にカレンダーコンテンツを新規作成する機能です。 |
カレンダーコンテンツ更新 | 指定した予定IDのカレンダーコンテンツの内容を更新する機能です。 |
カレンダーコンテンツ取得 | 開始日-終了日のレンジでカレンダーの予定コンテンツを取得する機能です。 どちらか一方をAPI通信で指定した場合はその日程を基準に1年間を取得します。 |
カレンダーコンテンツ削除 | 指定した予定IDのカレンダーコンテンツの内容を削除する機能です。 |
操作状態通知 | フォームの送信結果についてはfetchの結果を基に画面上部にポップアップを表示し、通知されます。 |
3.ご依頼について
SHIMYURATECではシステム構築・サイトの開発・プログラミング・資料作成に至るまでご依頼を受け付けております。
もし個人サイトやランディングページを作りたいがまず何をすればよいのか分からない、システムを作りたいがプログラムやサーバ構築などの担当要員が確保できないなど、お悩みがありましたらご相談させてください。規模感や予算感などを加味し、どのようなことが可能かなど一緒に考えさせていただきますので、是非お気軽にお声がけください!
お問い合わせにつきましては下記お問い合わせフォームより受け付けております。
また、SNSアカウントも開設しておりますので、お気軽にフォローお願いいたします!