はじめに
はじめまして。
今回、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でポートフォリオ作成予定