はじめに
インターンでlaravelを使うことが多く、一刻も早く理解するべくまずはphpを勉強だ！と思ってカレンダーを作りました。
初心者でphpを勉強する人の参考になれば幸いです。
htmlとphpの基本的な書き方。ループ処理などの文法がある程度わかっていれば余裕でわかると思います！
参考にしたサイトhttps://php1st.com/1001
準備
phpはサーバーサイドの言語なのでローカル環境で動かすことができません。
とはいえ、いちいちサーバーにあげて確認するというのも手間がかかってしまいますので、
まずはローカル環境でもphpの動作確認ができるソフトウェアをダウンロードしていきましょう。
今回はxamppというWebアプリケーション開発に必要なソフトウェアをまとめたものがあるのでこちらをインストールしていきます。
自分はmacを使っているので下記のサイトがわかりやすかったです。参考にしてください。
https://blanche-toile.com/web/mac-xampp
windowsの方はこちらのサイトがわかりやすいと思います。
https://haniwaman.com/local-apache/
インストールが終わったらコードを書いていきましょう！
カレンダー以外の部分
htmlの雛形
phpはhtmlと一緒に書くことができるよう作られた言語なので、phpファイルにhtmlを書くことができます。
まずは雛形を書いていきましょう。vscodeを使っている方はemmetが標準で入っているので「！」を打って変換すると雛形が出てきます。
emmetを使っていない方は以下をコピペしてください。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>calender</title>
</head>
<body>
</body>
</html>
任意の年月を選べるフォームの作成
まずは自分が見たいカレンダーの年月を選べるようにフォームをbodyタグの中に作成しましょう。
<form action="test.php" method="get">
</form>
フォームを作る際にはこのようにフォームタグで囲います。
action属性は属性値にデータの送信先を書きます。
今回はページ遷移はしないのでそのままファイル名を書いてください。
method属性はどのようにデータを送信するかを指定します。
属性値はpostとgetがあり
getはサーバー側にあるデータの取得に適していて、（検索フォーム、カレンダー表示など）
postはユーザー側が情報を送信するのに適しています。（ログイン、メールフォームなど）
またgetは送信した内容がurlに記述されpostはされないという違いがあるので
プライベートな内容や機密性の高い内容を送信する場合はpost、
そうでない場合はgetを使うと覚えておくといいと思います。
次はselectタグを使って年月を選べるようにコーディングします。
今回は1990~2020年のカレンダーを選べるようにします。
ここでphpの使っていくのですが、phpを記述する際は
開始タグ<?php
終了タグ?>
を忘れないように書いてください。
<select name="year">
<?php
$year=1990;
while($year<2021){
echo "<option>$year</option>";
$year++;
}
?>
</select>
<select name="month">
<?php
$month=1;
while($month<13){
echo "<option>$month</option>";
$month++;
}
?>
</select>
selectタグのoptionタグはhtmlなら30個書く必要がありますが
phpで書くと少ない行で済みますね。
echo "hogehoge";
でhogehogeの部分にhtmlを書けばOKです。
最後にデータを送信するためのボタンを作りましょう。
inputタグの中にtype="submit"で送信ボタンを作成することができます。
valueはボタンのテキストですね。
<input type="submit" value="送信する">
</form>
これでフォームは完成です。
現在の年月を取得する
まずはdateメソッドを使って現在の年月を取得し、変数に代入していきます。
dateメソッドは決められたフォーマットを指定すれば現在の時間に対応する値を返してくれます。
Yだと年4桁の数字、mだと月を2桁の数字で返してくれます。
フォーマットは他にもたくさんあるので詳しくはこちらのページを参照してください。
https://www.php.net/manual/ja/function.date.php
<?php
$ym_now=date("Ym");
$y=substr($ym_now,0,4);
$m=substr($ym_now,4,2);
substrメソッドは対象の文字列を抽出して値を返すことができます。
substr(対象の文字列,何文字目から,何文字分抽出するか）
上記のコードでいうと、この記事を書いているのは2020年１月なので
ym_nowは2020001
yは2020
mは03
を取得することができます。
現在の年月を表示する
現在の時刻を取得できたらそれを表示してみましょう。
一番初めにサイトを開くときは現在のカレンダー、年月を指定した場合はそれを表示するといった場合分けが必要なのでif文を使っていきます。
if(isset($_GET['year'])){
$y = $_GET['year'];
$m = $_GET['month'];
echo "<p>$y 年$m 月</p>";
}else{
echo "<p>$y 年$m 月</p>";
}
issetメソッドは引数に与えられた変数に値があるときはtrue,ないときはfalseを返します。
今回issetメソッドの引数に$_GET['year']という変数をいれました。
この変数はphpでもともと定義されている変数で、主にWebサーバーから受け取った値が格納されています。
getで送った値がここに代入されるので、もし年月のデータを送信してたらそれを変数y,mに代入して表示します。
そうでない場合、つまり最初にページを開いたときは今の年月が表示されます。
カレンダーを表示していく
実際にカレンダーを表示してみましょう。
今回はtableタグで表示していきます。
曜日を表示する
echo "
<table border=\"1\">
<tr>
<th>日</th>
<th>月</th>
<th>火</th>
<th>水</th>
<th>木</th>
<th>金</th>
<th>土</th>
</tr>
<tr>";
これで曜日は表示されますね。
日付をいれていく
while構文を使って日にちを入れていきます。
その際に
- 日曜日の日にちを入れるときは改行を入れてから
- 日曜日は赤色、土曜日は青色のcssを当てる
を意識しながらコーディングしていきましょう。
$d=1;
while(checkdate($m,$d,$y)){
if(date("w",mktime(0,0,0,$m,$d,$y))==6){
echo "<td class=\"thursdayColor\">$d</td>";
echo "</tr>";
if(checkdate($m,$d+1,$y)){
echo "</tr>";
}
}elseif(date("w",mktime(0,0,0,$m,$d,$y))==0){
echo "<td class=\"sundayColor\">$d</td>";
}else{
echo "<td>$d</td>";
}
$d++;
checkdateメソッドはその日付が存在するかを確認するメソッドです。
引数は月、日、年の順番で入れていき、その日付が存在すればtrueを返します。
mktimeメソッドはUnix epoch(1970年1月1日00:00:00 GMT)から 指定された時刻までの通算秒を返すメソッドです。一見かなり使いづらそうに見えますが、dateメソッドと一緒に使うと指定した時間を値として返すことができるので大変便利です。引数は時、分、秒、月、日、年の順番で入れていきます。
例えば
date('w',mktime(0,0,0,4,12,2019))
と打つと、2019年4月12日00:00:00時点の曜日の数字を返してくれます。
ちなみにdateメソッドのフォーマットの一つ「w」は指定された日付に対応した曜日を数字で返すことができます。
0が日曜日で6が土曜日です。
while構文で日付を1日目から回していき、土曜日、日曜日になっただけ改行やcssを当てる処理をするといった流れです。
存在しない日にちを空白で埋める
ここまで作ってみるとわかると思いますが、初日の位置がおかしかったり、最終日の後も空白がなかったりと不自然な部分があります。
//1日目の前に空白を入れる処理
$wd=date("w",mktime(0,0,0,$m,1,$y));
for($i=1; $i<=$wd; $i++){
echo "<td> </td>";
}
//日付を入れていく処理
//最終日後の空白を埋める処理
$wdx=date("w",mktime(0,0,0,$m+1,0,$y));
for($i=1;$i<7-$wdx;$i++){
echo "<td> </td>";
}
?>
今回はfor文で回していきます。mktimeメソッドで曜日の数字を返してその数値を参考にして空白を作っていく流れになります。
ここまで書くと好きな年月のカレンダーが見られるようになっていると思います。
おわりとまとめ
ごちゃっとしてしまったので全体のコードも置いておきます。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>calender</title>
</head>
<body>
<form action="test.php" method="get">
<select name="year">
<?php
$year=1990;
while($year<2021){
echo "<option>$year</option>";
$year++;
}
?>
</select>
<select name="month">
<?php
$month=1;
while($month<13){
echo "<option>$month</option>";
$month++;
}
?>
</select>
<input type="submit" value="送信する">
</form>
<?php
$ym_now=date("Ym");
$y=substr($ym_now,0,4);
$m=substr($ym_now,4,2);
if(isset($_GET['year'])){
$y = $_GET['year'];
$m = $_GET['month'];
echo "<p>$y 年$m 月</p>";
}else{
echo "<p>$y 年$m 月</p>";
}
echo "
<table border=\"1\">
<tr>
<th>日</th>
<th>月</th>
<th>火</th>
<th>水</th>
<th>木</th>
<th>金</th>
<th>土</th>
</tr><tr>";
//1日目の前に空白を入れる処理
$wd=date("w",mktime(0,0,0,$m,1,$y));
for($i=1; $i<=$wd; $i++){
echo "<td> </td>";
}
//日付を入れていく処理
$d=1;
while(checkdate($m,$d,$y)){
if(date("w",mktime(0,0,0,$m,$d,$y))==6){
echo "<td class=\"thursdayColor\">$d</td>";
echo "</tr>";
}elseif(date("w",mktime(0,0,0,$m,$d,$y))==0){
echo "<tr><td class=\"sundayColor\">$d</td>";
}else{
echo "<td>$d</td>";
}
$d++;
}
$wdx=date("w",mktime(0,0,0,$m+1,0,$y));
for($i=1;$i<7-$wdx;$i++){
echo "<td> </td>";
}
?>
</tr>
</table>
<style>
.sundayColor{
color:red;
}
.thursdayColor{
color:blue;
}
</style>
</body>
</html>
参考書でのアウトプットも大事ではありますがこうやって実際に手を動かしてコーディングすると全く手が動かなくなるのですごい焦りますね。初めてqiitaを書きましたが、あやふやだったところが明確に見えてくるのですごく良かったです。
もうphpは完全に理解しました。