概要
フリーランスでWEB制作をしている者です。
ちゃんとしたポートフォリオを作っていなかったのでスキルUPがてら作ることにしました。
モチベーション低下を避けるために、期間を定めて集中的に制作。
そのため言語の選択や設計は、これまでの経験で得た技術を使うことにする。
何をどうやっていつまでになど、プロジェクト管理は自分でおこなう。
謝辞
この制作を終わらせられたのは支えてくれた人がいるからでした。
もうすぐ８ヶ月になる娘がいます。
娘にとっては母親が必要な時期、制作期間中はいい子で大人しくしてくれた娘と、家事を手伝ってくれた夫に感謝しています。
そして、学習法やプログラムの基礎等を教えてくれた師匠と先輩に心から感謝を伝えたいです。
みなさま本当にありがとうございます。これからも宜しくお願いします。
制作物の選定(背景)
とにかく思いつくアイデアを書き出して、何を作るか考える。
実用的で有益に働くものがいい。
思いついたのは以下の２案
-
タスク管理アプリ
コーチング界で有名な『７つの習慣』の原理原則を使って、自分のタスクの優先度を管理するアプリ。人生を豊かに過ごせそう -
ネットショップアプリ
家業で茶葉を販売しているため、自社開発のECサイトを作る案。他社プラットフォームを通さないので手数料を節約できる。すぐ使えそう
１は設計が大変そうなので、機能がはっきりわかる２の案を採用。
７つの習慣：スティーブン・R・コヴィー博士が執筆した成功し続けるための原理・原則をまとめた書籍
環境選定・期間
制作期間は1ヶ月とし、バックエンドはWordPressで触ったことがあるPHPを選んだ。
データベースはレンタルサーバーに標準装備されていることが多い、MySQL。
デザインは凝り始めるとキリがないので最低限の見た目で良しとする。(期間的に断念)
目的
- PHPを用いたWebアプリケーション開発経験を積む
- フルスクラッチ開発によってWebアプリの基本的な構成、動作を知る
- 自己アピールとしてのポートフォリを作る
- 茶葉事業での代理店取引を円滑化する(2024年11月末現在まだ未完成)
スペック
言語
PHP 8.1.17
DBMS
MySQL 5.2.1
開発環境
MacOS Big Sur 11.6.8
Apache 5.2.1
本番環境
ConoHa WING
機能要件
制作期間的に全てを実装することはできなかったが、欲しい機能を書き出していく
商品管理機能
商品の詳細閲覧・追加・修正・削除ができる
スタッフ管理機能
ショップ管理ができるアカウントを追加・修正・削除ができる
商品一覧表示機能
登録された商品が一覧表示される(ショップのホームページ)
カート機能
お買い物カートの中身を閲覧・商品を追加・編集・削除ができる
商品注文機能
カート画面から注文完了までの情報のやりとり。自動返信メールが届く
会員登録機能
注文時に会員登録することができる。登録後はログインして注文することでお届け先の入力が省ける
簡単注文機能
会員登録した住所を使って、お届け先の入力を省略できます
代理店取引管理機能(未完成)
茶葉卸先との取引を会員ページで行える仕組み
時間の関係上、この記事を書いてる日には間に合わなかったが、今後実装予定
データベース設計
他社のECサイトを参考にしながら、どんな情報が必要なのかを洗い出しました。
テーブル同士をどの情報で紐づけるか考え、作りながら情報を足すこともありました。
| テーブル名 | 内容 |
|---|---|
| orders | 注文者の個人情報 |
| order_details | 注文内容詳細 |
| mst_product | 商品情報 |
| members | 会員アカウント情報 |
| mst_staff | 管理者アカウント情報 |
| contact_log | お問い合わせ内容の履歴 |
GUI設計
正直なところデータベースができた時点で、コーディングにはいり
細かい設計は作りながらきめていった。
画面推移の大まかな流れだけ把握して実装に入る。
そのため、ワイヤーフレームなし、画面推移図は省略。
コーディング
細かいコーディング内容については詳細設計として別記事で詳しく書いていこうと思います。
ざっくり書くと、
- データベース接続にはPDOを用いて、try~chatchで成功したかどうかを判断
- PDOにてSQL文を記載
- データベースへの入力や削除、更新部分はPOST、データベースからの出力はGETを用いた
- htmlspecialchars関数を用いたサニタイジングを実施、関数化して別ファイルへ
- バリデーションはフロント側(JS)で型を整え、バックに渡している
などなど
修正したい部分は山ほどあるが、完璧を目指すと時間が足りないので
精度は今後ゆっくり高めていくことにする。
とりあえずリリースを目指す。
ConoHa WINGへデプロイ
データベースを作成して、できたファイルをアップロード。
完成したものがこちらです。
ファビコンもOGPも設定していなくてごめんなさい。
お茶好きな方はよかったら買ってください(笑)
管理者画面はセキュリティ的に公開を控えておきます。
課題点
今後修正していく項目をあげておきます(自分のために)
-
パスワードの暗号化を強化する
パスワードはmd5()で暗号化しているので安全性が十分ではない。パスワードハッシュに書き換える -
データベース情報は別ファイルにすればよかった
デプロイするとき超めんどくさかった。次はrequire_onceで各画面に適用する -
受注時の自動送信メールがお客様宛に飛ばない
軽く調べたところConoHa側で設定が必要なんだそう。管理者宛(商品が売れたよ！)のメールは届いている。よって今注文してくださった方は手動で私からメール送ります(笑) -
データベースのネーミングをもっとわかりやすい名前にする
コーディングしていたら商品番号なのか注文番号なのか、わからなくなった。名前の重複を避ける。 -
代理店アカウント管理と受注システムを追加する
もっとスマートで綺麗なコードをかけるようになりたいものである。
完璧より動くことを優先。
良かった点
- フルスクラッチ開発に成功
- 育児・家事・仕事も両立しながら制作できた
- SESSIONやCookieの理解が深まった
- そこそこ自分らしいデザインに仕上がったと思う
次回は画面ごとの詳細設計を書きます。
ここまで読んでくださった皆様、ありがとうございました！