no message
This commit is contained in:
110
README.md
Normal file
110
README.md
Normal file
@@ -0,0 +1,110 @@
|
||||
# 掲示板 PHP 実装課題
|
||||
|
||||
## はじめに(演習の⽬的と取り組み⽅)
|
||||
当演習は、講義で学んだことを⾃⼒で実践できるようになるために実施します。 そのために以下の内容を守って演習に取り組んでください。
|
||||
|
||||
### 納品物、納期を守りましょう
|
||||
この演習は、実際の仕事を想定した内容です。
|
||||
提出物の内容と提出期限は必ず守ってください。
|
||||
作業が間に合わない、提出物に問題が出そうな場合は、**必ずルールにしたがって適切な相⼿に相談してください**。
|
||||
|
||||
### 適切な⼿順で開発しましょう
|
||||
プログラムを書き始める前に、**README.md** や**仕様書**(配布されている場合) を必ず読んでください。
|
||||
「**何を作るのか**」、「**どこまで作ればよいのか**」を理解してから作業を始めてください。
|
||||
|
||||
### 知らないことは⾃分で調べましょう
|
||||
この演習には、**講義で扱っていない内容が⼀部含まれています**。
|
||||
その場合は、インターネットなどで⾃分で調べながら進めてください。
|
||||
調べることも、エンジニアにとって⼤切なスキルの⼀つです。
|
||||
|
||||
|
||||
## 課題概要
|
||||
既存のプログラムに対して、未実装の機能を追加で実装してください。
|
||||
|
||||
## 納品物
|
||||
- 作成したプログラム
|
||||
- テスト仕様書
|
||||
- `PHP_StringCheck/テスト仕様書/`に格納してください
|
||||
|
||||
## 納品方法について
|
||||
指示に従ってください。
|
||||
|
||||
## 目標
|
||||
- PHP を使用し、独習 PHP で学んだ知識を活用して実装すること
|
||||
**特に重要な要素:** 制御構文 (`if`, `for`)、メソッド、`return` 文
|
||||
- HTML 側でエラーが発生した場合の制御方法(バリデーション)を理解する
|
||||
- 単体テストの作成基準を学び、テストを踏まえて **正しく動作するプログラムを納品する意識** を身に付ける
|
||||
|
||||
## 環境構築手順
|
||||
1. **XAMPP を使用します**
|
||||
2. **Apache を起動してください**
|
||||
3. `htdocs` フォルダ配下に`StringChecker` フォルダを作ってください
|
||||
4. クローンをします。その際の`保存先のパス`には3で作成した`StringChecker` フォルダを指定してください
|
||||
5. ブラウザで `http://localhost/StringChecker/StringCheck.php` にアクセスしてください
|
||||
6. 1段階目から順番に4段階目まで実装を進めていきましょう (ノルマ、全員ここまで完成させてください!)
|
||||
7. 4段階目が完了したら、5段階目に着手してください
|
||||
|
||||
## 実装ステップ
|
||||
`StringChecker.php`ファイルを編集します!
|
||||
上記のファイルにはHTMLの画面の実装は済んでいますが、裏側(サーバー側)の処理は未実装です
|
||||
以下の指示にしたがって裏側をPHPを用いて実装してください
|
||||
|
||||
### **1段階目: 基本的な投稿機能の実装**
|
||||
- 投稿文を入力し送信するとき
|
||||
- その入力された投稿文を投稿メッセージエリアに表示してください
|
||||
- 1段階目では、投稿文の改行は考慮しなくてもOKです
|
||||
- 例:「あ<改行>い」を送信⇒「あい」のように、改行されていない状態での表示で合格とします
|
||||
- (参考画像 > `1段階目 > image2.png` 参照)
|
||||
- 初回表示時(StringCheck.phpの初回アクセス時)
|
||||
- **「まだ投稿はありません。」** と表示されるようにすること
|
||||
- (参考画像 > `1段階目 > image1.png` 参照)
|
||||
|
||||
|
||||
|
||||
### **2段階目: 入力チェックの実装**
|
||||
- テキストエリアに何も入力せず投稿した場合、`「入力がありません。」` とエラーメッセージを表示させてください
|
||||
- (参考画像 > `2段階目 > image.png` 参照)
|
||||
- この時、投稿メッセージエリアには **「まだ何も投稿ありません」** が表示される仕様でOKです
|
||||
|
||||
|
||||
### **3段階目: 文字数制限と改行処理**
|
||||
- 投稿成功時に、`「投稿成功しました。」` と表示されること
|
||||
- 改行含んだ入力をした場合、そのまま反映されるようにしてください。1列で表示されないようにしてください
|
||||
- (参考画像 > `3段階目 > image4.png` 参照)
|
||||
- テキストエリアの **各行が21文字以上** の場合に、以下の処理を実装してください
|
||||
- `「21文字を超えています:対象行の内容」` とエラーメッセージを表示する
|
||||
- この時、投稿メッセージエリアには **「まだ何も投稿ありません」** が表示される仕様でOKです
|
||||
- (参考画像 > `3段階目 > image1.png` 参照)
|
||||
|
||||
|
||||
|
||||
#### ヒント (投稿成功時に、`「投稿成功しました。」` と表示されること)
|
||||
- 各行を処理するには、文字列を **改行コードで区切る** 必要があります
|
||||
- `explode()` や `preg_split()` を使うと便利です
|
||||
- 通常の `echo` では **改行が反映されない** ため、1行で表示されてしまいます
|
||||
- (参考画像 > `3段階目 > image2.png` 参照)
|
||||
- 投稿したメッセージは改行コード(\n)を含んだ文字列で取得します
|
||||
- HTMLとして表示させるには<br>タグに変換させる必要があった....変換できる関数はなんだっけ??
|
||||
- (参考画像 > `3段階目 > image3.png` 参照)
|
||||
|
||||
#### ヒント (「21文字を超えています:対象行の内容」` とエラーメッセージを表示する)
|
||||
- 改行を含んだ入力の場合、改行コード(\n)を含んだ文字列になります
|
||||
- 1行1行21文字あるかどうかチェックしていけばいい
|
||||
- 改行コードを起点に文字列を配列に変換させる必要がある......文字列から配列に変換できる関数ってなんだっけ?
|
||||
- 配列にしたあと、foreachを用いて1つ1つの値にアクセスし、21文字超えているかチェックする
|
||||
- 超えていれば$errorMessage にエラー内容を記述すればいける
|
||||
|
||||
### **4段階目: 単体テスト仕様書の作成、およびテストの実施**
|
||||
- `PHP_StringCheck/テスト仕様書/`以下にあるサンプルを参考に、単体テスト仕様書を作成してください
|
||||
- 3段階目までの全ての仕様を満たしているかを確認するテストを記載すること
|
||||
- 作成したテスト仕様書に従って、実際にテストを実施すること
|
||||
- なお、不具合を見つけることができたらコードを修正し、再度テストを実施すること
|
||||
|
||||
## **早く終わった方向けの追加課題**
|
||||
|
||||
### **5段階目: 画像アップロード機能の実装**
|
||||
- 投稿時に画像をアップロードできるように機能追加してください
|
||||
- 画像がアップロードされた場合、投稿メッセージと一緒に表示するように実装してください
|
||||
- (参考画像 > `5段階目 > image.png` 参照)
|
||||
- 画像のアップロードには `enctype="multipart/form-data"` を指定する必要があります
|
||||
- 画像ファイルの形式は JPG, JPEG, PNG, GIF のみ対象とします
|
||||
Reference in New Issue
Block a user