【Laravel×Vue】メモアプリ制作の記録①~設計~

はじめに

1~2週間ほど前にLaravel×Vueのアプリ制作を開始しましたが・・・

DB連携のための非同期処理なり壁にぶち当たり、制作が頓挫しました。

その後、しばらく非同期処理やアプリの全体像を掴むため設計に関して学んでいました。

以前より少しはLaravel×Vueのアプリ制作のイメージが湧いたので再度ポートフォリオ制作に挑戦していこうと思います。

作るものはド定番のToDoアプリです。

この記事はその記録です。

今回試したいこと

・アプリ設計をする

環境に関して

Laravel 6.8

PHP 7.3

Windows/XAMPP/MySQL

参考教材に関して

入門Laravelチュートリアル (1) イントロダクションと環境構築

Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう

アプリ設計をする

教材を参考に見よう見まねで設計。CRUDをきちんと実装します。

まずは全体像です。

※エクセルで作成

機能一覧

◆認証機能

・会員登録/ログイン/ログアウト

・ユーザーごとに扱えるのは自分のフォルダおよびタスクのみ

・パスワードを忘れた場合には再登録することができる。

◆FolderのCRUD(会員のみ)

・一覧を表示可能

・作成、編集、削除可能

◆TodoのCRUD(会員のみ)

・一覧を表示可能(フォルダを分割して管理)

・作成、編集、削除可能

・タイトルと状態(未着手、着手中、完了)を持つ。

データベース設計(ER図/テーブル定義)

※Cacooの無料お試し期間が終わってしまったのでExcelで作りました。

URL設計

※これができない。。。勉強不足。改めて追記します。

おわりに

URL設計もしたかったのですが、やっぱり全体像がまだ掴めない。

ユーザー>フォルダ>タスクとモデルが3つ以上あるとリレーションを踏まえて、LaravelかVueのどちらで実装すべきか途端にイメージできなくなりました。

悩んでいても手が止まる一方だったので。。。作りながら掴んでいきます。

関連記事

【Laravel×Vue】メモアプリ制作の記録①~設計~
【Laravel×Vue】メモアプリ制作の記録②~トップページの作成~
【Laravel×Vue】メモアプリ制作の記録③~フォルダ/タスク機能の実装~
【Laravel×Vue】メモアプリ制作の記録④~テーブルの関連付け~

コメントを残す