YouTube "Route 87" | 35歳からオーストラリアのシドニーでシェフを目指す男の日常をお届け。

【職業訓練校】Web制作6ヶ月コースの授業内容やリアルな感想など1ヶ月毎のまとめ




Web制作学習5ヶ月目

5ヶ月目
  • Database(MySQL)
  • グループプロジェクト事前課題(sweets)
  • グループプロジェクト

Database(MySQL)

  1. データベースとは
  2. データベースの種類
  3. MariaDBの設定・起動・終了・記述法
  4. データベース領域
    1. 表示 SHOW DATABASES
    2. 作成 CREATE DATABASE
    3. 選択 USE
  5. テーブル
    1. 作成 CREATE TABLE
    2. 表示 SHOW TABLES
  6. フィールドの型と属性 SHOW COLUMNS
  7. レコード追加 INSERT INTO
  8. データ
    1. 取得 SELECT
    2. 変更 UPDATE
    3. 削除 DELETE
  9. スクリプトファイルの作成・実行
  10. 条件付き検索 WHERE
  11. 範囲 BETWEEN
  12. 条件組み合わせ AND/OR/NOT
  13. 部分一致 LIKE
  14. 正規表現検索 REGEXP
  15. 検索件数の制限 LIMIT
  16. 並べ替え ORDER BY
  17. 計算や集計
  18. テーブルの構成の変更 ALTER TABLE
  19. リレーション
  20. テーブルの結合
    1. 内部結合 JOIN
    2. 外部結合 LEFT JOIN / RIGHT JOIN
  21. 新規ユーザの追加 GRANT
  22. ユーザ情報
    1. 表示 SELECT * FROM mysql.user;
    2. 権限表示 SHOW GRANTS FOR ユーザ名@ホスト名;
    3. 削除 DROP USER
  23. データベース領域のバックアップ・復元
  24. テーブル削除 DROP TABLE
  25. データベース削除 DROP DATABASE
  26. 商品管理システム作成
    1. 商品一覧表示
    2. レコード登録
    3. 新規商品登録フォーム作成
    4. 新規商品の登録
    5. 編集用フォームへのリンクを作成
    6. 商品情報編集フォームを作成
    7. 編集したデータをデータベースに登録
    8. 削除ページへのリンクを作成
    9. 商品の削除
    10. 商品の検索
    11. データベースの接続処理を関数化
    12. CRUDシステム

データベースの言語はほぼ英語なので、理解自体はすんなりいきました。しかし、DBとPHPを連携させてwebシステムを構築するのは、少しずつ形になっていることを実感でき楽しいと思う反面、頭がついていけず混乱する場面もありました。

また、SQLインジェクション攻撃などの1つの攻撃でレコード全削除できることを知り、恐ろしいと感じると共にセキュリティ対策の重要性を学びました。

グループプロジェクト事前課題(sweets)

グループプロジェクトに本格的に入る前に、各グループに同じ課題が課されませした。DBにスイーツに関する商品テーブルと店マスタテーブルの2つのテーブルを作り、ブラウザ上で検索をかけたときにDBから情報を引っ張って表示するというシンプルで簡単なシステムを作る課題でした。

2月の5連休の前日に事前課題が課されたのですが、講義を聞いてわかったつもりでいたのに全く課題に歯が立たない状態だったので、連休中に復習がてら課題を終わらせました。

商品テーブルと店マスタイメージ
入力画面イメージ
名前一覧と詳細へのリンク画面イメージ
名前一覧と詳細へのリンク画面イメージ
名前一覧と詳細へのリンク画面イメージ
商品詳細画面イメージ

グループプロジェクト

今回で最後のグループプロジェクトは、1チーム4人ないし5人のチームを講師の方が受講生の実力差を考慮して6チーム作りました。お題は①映画②レシピ③レストランと3つあり、詳しいことは伏せられていました。個人的にはどれでも良かったのですが、全6チームの第1希望の入札が映画で少し驚きました。

私のチームは運良く?第一希望の映画に決まりました。事前課題が終わった班から講師の人たちと打ち合わせしてプロジェクトを進めていく感じだったので、私の班はすぐに打ち合わせすることができました。

今回のプロジェクトも当初は10日間という短い時間しかなかったので、できるだけプロジェクトに時間を充てたいというのと、時間に余裕を持ちたいという思いがあったので、連休中にsweets課題を終わらせました。最終的にはこれが功を奏し、実装しようとしていたシステムは全て実装できました。

グループプロジェクトフロー

仮想のランキングサイト作成依頼

制作依頼の簡単な概要は上記のような感じでした。

打ち合わせのフロー

1回目:依頼内容をもとに企画提案

アップロードデータ

  • ターゲットとゴール、企画内容をまとめた資料

2回目:サイト構成とトップページ構成の提案と決定

アップロードデータ

  • サイトマップ(ディレクトリマップ)
  • トップページワイヤーフレーム
  • データ収集(映画)タイトル、カテゴリ(洋画・邦画)、公開日、画像、概要、スタッフ、キャスト、ストーリー
  • 主な出来事、流行語

3回目:トップページデザインと配下ページ構成の提案と決定

アップロードデータ

  • トップページデザインカンプ
  • 配下ページワイヤーフレーム
  • 値のやり取りがあるページの画面遷移図

4回目:DB構成の提案と決定

アップロードデータ

  • DBレイアウト
    ユーザ情報とDB領域名
    テーブル構成をエクセルで作成し各テーブルに例となるレコードを5件くらい入れておく
    各テーブルの初期データレコード数を決めておく ※テスト可能数のみでOK
    リレーションするフィールドを明確にしておく
  • 全ページワイヤーフレーム
    「ワイヤーフレーム内でデータベースの値を表示する箇所」と「テーブルの対象フィールド」にヌケ・モレがないことを確認しておく

今回のグループプロジェクトも班長と進捗管理者を決めて進めていきました。
前プロジェクトでは班長、今回のプロジェクトでは進捗管理者を担当しましたが、思っていたよりも仕事や責任は重大でしたけど、経験して良かったと思ってます。

進捗管理

デザインよりもシステム実装を優先すること(優先度を決めて進める)
進捗管理者が中心となってグループ全体の進捗状況を管理する
進捗報告は進捗管理者ともう1名の2名で報告する(遅れている場合は対応策を報告)
下記項目作業終了を100%とした時のグループ全体の進捗状況の数値を報告:個人進捗は必要なし

  • コーディング(HTML/CSS/JS等の画面作成)
  • プログラミング(PHPでの値渡し/DB連携等)
  • データベース(DB構築/PHPで使用するSQL文作成)
  • 素材収集(画像/文章等)
  • 発表(発表資料/リハーサル)
納品物
  • 最終制作フォルダ一式
  • DBデータ(SQLファイル もしくは phpMyAdminのエクスポートファイル)
  • 制作時に使用したデータ
  • 発表時に使用したデータ
  • 環境再現に必要なデータ一式と構築手順書
発表

開発者から運用担当者への説明
発表時間:15分以内(厳守)進捗管理者が発表時間を管理すること

  • 依頼内容と企画
  • 作成したサイトの紹介
    • ポイントとなる部分の画面遷移
    • ランキングの変動や口コミ入力実演等
  • DBレイアウト
  • メンバーの担当と感想・最後に班長まとめ

発表後、質疑応答(15分以外で)

制作物

ゴール・ターゲット
ゴール・ターゲット

まず企画内容ですが、平成元年から平成31年の31年間に上映された映画を1年に1本ずつピックアップし、レビュー評価の平均値にて決定したランキングを掲載するサイトを作成することにしました。

この企画内容でのターゲットは全国の老略男女で、ゴールは劇場に足を運んでもらうことです。

ゴール・ターゲット

ゴールやターゲット、どんなランキングサイトにするかをチームで話し合い、それらの概要をエクセルにまとめました。

ディレクトリマップ・画面遷移図
ディレクトリマップ

ディレクトリマップを作成し、どんなページを作成するのかを明確にしました。

画面遷移図

画面遷移図は値の受け渡し方法を図にしたものです。
映画詳細ページやランキングページ、口コミ全件ページは第3者にURLをシェアする場合を考え意図的にGET形式で値を受け渡し、その他はセキュリティの観点からSESSIONで値を受け渡しています。

DB
データベース概要

データベースで苦労したのは、Windows標準言語のShift-JISとUTF-8で文字化けしてしまうこと。terminalからSQLファイルを読み込むとShift-JISで読み込まれて文字化けしてしまうので、phpMyaAminからSQLファイルを読み込むことにしました。

また、DBに登録されている情報を出力する際に、データによっては改行が必要な場面も出てきます。その際に綺麗に表示できるようにあらかじめphpMyaAmin内で改行した形式で登録し、出力する際に「nl2br」をつけてDBに登録されている形式のまま表示できるようにしました。

受講して感じたこと

良かった点
  • PHPとDBを使ってランキングサイト・口コミサイトを構築
悪かった点
  • プロジェクトへのモチベーションの差が人によって激しい
  • 評価基準がイマイチ

◎PHPとDBを使ってランキングサイト・口コミサイトを構築

これまでの講義で学んできたお問合せフォームや検索システムなどをフル活用して、ランキングサイトや口コミサイトのシステムをゼロから構築するのはとても大変でしたけど、すごく勉強になりました。

学んできたことをアウトプットすることで身に付くことが実感できたし、講義では教わっていないことはググれば時間がかかっても自分一人で解決できることも経験できて、このプロジェクトを終えて少し自信がつきました。

×プロジェクトへのモチベーションの差が人によって激しい

グループプロジェクトをする上で1番大変だったことは一人一人のモチベーションの高さが違うことだったと思います。私はこの半年間の職業訓練でweb制作を学びたいと強い思いで講義を受けていましたが、全員が全員そのために学校に通っているわけではありません。

出席さえしていれば失業手当を受給できるので、お金目当てで通っている人も少なからずいました。それは人それぞれなので何も言わないですが、グループプロジェクトの時はかなりの足枷になります。5ヶ月も講義を受けていると、やる気のある人ない人でかなりの実力差が生まれますし、得意不得意なことがでてきます。

それをチームで力を合わせて補って形にしていくのですが、あまりにも何も出来ない上になんの努力もせず平然としている態度をみると本当にぶん殴りたくなります。笑 こちとら早く学校に来てやったり、家に持ち帰ってやったりしても時間が足りないくらいなのに。

まぁ全て自分のスキルアップのためだ!と割り切って頑張るのですが、やはり仏じゃないのでね。それこそやりたい人だけプロジェクトをやる方がお互いにwin-winな気がしますけど、そういうわけにもいかないんでしょうね。

×評価基準がイマイチ

発表後は受講生と講師陣からQ&Aの時間があるのですが、講師陣の評価基準がなんかイマイチだなと私は感じました。そのイマイチというのは、今回のプロジェクトの本来の目的は上記でも書いてある通り、システムを構築することでデザインとかは二の次なんです。

実際にある程度のシステムを構築できていた班は6チーム中3チームのみ。時間がなくて実装できてませんって言ってたけど、私個人的には論外かなと。そこはもっと厳しく突っ込むべきポイントだと思いました。

期日が10日後で時間も限られている。チームメンバーも4人ないし5人で各々の実力はこれまでのプロジェクトや授業、sweetsの課題やれば大体把握できる。それらリソースを考慮して自分達が作れるシステムを考えて設計してシステムを構築する。それも仕事をする上では大事な能力だと思うし、そこをもっと重要視するべきだと思う。

まぁちゃんとシステム構築できたからってどうなるわけではないのですがね。




ABOUT US
Ryuji(りゅじ)
35歳からオーストラリアのシドニーでシェフを目指す男。 2023年に入り海外移住を真剣に考え始め、7月25日に渡豪。 現在はシドニーで調理学校に通いながらローカルのステーキハウスに勤務中。 海外旅行・国内旅行・温泉・グルメ・バーホッピングが大好き。 赤提灯の大衆居酒屋でホッピー飲んでる渋いイケおじになるのが目標。