はじめに

はじめまして。
今回、PHPの基礎のアウトプットを兼ねてポートフォリオを作成しましたので、説明します。

目的

PHP言語を用いてフルスクラッチ開発をすることで、下記事項が理解できているかを確認する

・セッション
・GET送信、POST送信
・条件分岐、繰り返し処理
・DB関連(DB接続、SQL実行)
・DBデータの編集、画面への出力

スペック

■言語
PHP, HTML, CSS, JavaScript(jQuery)

■DBMS
MySQL

■フレームワーク
なし

■サーバー
XSERVER

ポートフォリオ

URL：http://chiritsumo.nyankormotti.com

ポートフォリオの概要

勉強時間、実施内容を記録するWEBサービス

ポートフォリオの機能

■ユーザー情報関連
・ユーザー登録
・ログイン・ログアウト
・ユーザープロフィール編集
・パスワード変更
・パスワードリマインダー
・退会

■メイン機能
・マイページ(実績一覧)
・実績登録
・実績編集
・実績削除
・実績詳細
・カテゴリー編集
・実績検索

■その他
・お問い合わせ

何ができるか

■実績を投稿できる
　(勉強した日にち、勉強時間、内容、内容の画像を保存できる。POST送信にて対応)

■実績詳細にて保存した画像を拡大して閲覧できる(lightboxを使用)

■実績をカテゴリーで検索、また実績日を範囲指定して検索できる。
実績登録した日にちの昇順、降順でソートを実施できる。
ページネーション後も検索情報を保持している。
(GET送信にて対応)
　※多くのデータ数が必要なため、ユーザーを変更しています。

■その他
・パスワードリマインダーにて、登録されたメールアドレス宛に認証キー、新しいパスワードを送信する。

作成方法

1.機能の洗い出し

2.画面モックの作成

3.テーブル設計、DB作成

4.各画面、機能を実装
ログイン、ユーザー登録機能などセッション周りから作成。
→パスワード変更など非機能要件
→POST・GET送信関連などのメイン機能を実装
→細部の調整

5.テスト
・各機能の処理が正常終了すること。
・商品一覧表示機能に関しては、境界値のデータを作成し、実施。
・URL直打ちした際にセッションが保持されているか確認。　など

工夫したところ

■検索条件の保持
実績詳細画面からマイページへ遷移する際や、ページングにてページを移動する際に、検索条件を保持するために、GET送信を用いています。
実績詳細画面から戻る際は、実績テーブルのキーであるIDのみGET送信から削除して遷移しています。(遷移時のURLにて「p_id」を削除しています)

■お問い合わせ機能
セッション情報の有無(ログイン前後)にて、お問い合わせ画面のメールアドレス入力フォームの表示・非表示を制御しています。
　（ログイン後はセッションIDよりDBからメールアドレスを取得し、メールを送信する仕様にしています。）

■マイページ画面の余白
マイページ画面の余白を確保するために、検索フォームをモーダルで出力するようにしています。
また、ヘッダーのメニューをドロップダウンにするようにして、空間を確保し、ゆとりを持たせています。
(実績一覧の表示にはcssのoverflow:scrollにてスクロールして表示しています。)

ポートフォリオの課題

・カテゴリー名変更機能の追加(登録、削除機能のみ)
・FWによるMVCモデルの適用(保守性が低い)
・SASSを用いたCSS実装(保守性が低い)
・レスポンシブ対応(1000px以下だと崩れる)

現在の学習内容(2019.05.12現在)

・Laravel
・JavaScriptの基礎
・React、Vue.js（主にVue.js）
・SASS
・CSS設計(FLOCSS)

→Laravelでポートフォリオ作成予定