はじめに

前回まででローカル環境でPHPを書く環境を整えたので、今回からは実際にPHPを書いてブラウザに表示する方法を忘れないようにまとめていきたいと思います。

やること

　・PHPを書いてみる
　・ブラウザで入力内容確認

環境

　・Windows10 64bit
　・XAMPP v3.2.4
　・Apache v2.4.46
　・PHP v7.4.10

XAMPPを使ってPHPをブラウザで表示

　では早速PHPを書く前に、テスト用HTMLを書いていきましょう。XAMPPやVsCodeをなにそれ？って方は前回の記事をお読みください。
　大丈夫だよーって方はXAMPPのApacheを起動してからお読みください！

①テスト用PHPファイルの作成

ドキュメントルート

　ドキュメントルートとはWeb上に公開することのできるディレクトリのルートのことです。公開したいディレクトリのパスを設定するとそのディレクトリ配下のファイルへ全てアクセスが可能になります。

　しかし、初心者がいきなりディレクトリ公開するのはセキュリティ面で非常にリスキーなので今回は設定せず、ローカル(自分のPC上だけ)で書いていけるように設定は飛ばします！

XAMPPのディレクトリ

　XAMPPのディレクトリはインストール時指定をしていなければC:\xamppに作成されています。
そしてドキュメントルートはC:\xampp\htdocsとなります。要するにhtdocs内にhtmlやPHPファイルを配置していけばブラウザに表示されるということです。

　index.phpにはXAMPPの設定でlocalhostにアクセスしたら、indexと名前がつくファイルに自動的にアクセスするよーという処理(リダイレクト)がされており、
http://localhost/にアクセスすると、自動的にURLはhttp://localhost/index.phpとなり、C:\xampp\htdocs\index.phpが開き、XAMPPのダッシュボードが表示されるようになっています。

VSCode上でhtdocsを開く

　VScode内でXAMPPのドキュメントルートを開いて作業をしやすくしちゃいましょう。
VSCodeを開いてFileメニューのOpen Folder…からXAMPPのhtdocsを指定します。

無事に開けると左側にhtdocsのディレクトリが表示されます。
先ほど説明したindex.phpもちゃんとありますね。試しに開いてみるとdashboardページが表示されるようにPHPが書かれています。

しかし今回は新たなテスト用PHPファイルを作成したいのでこのPHPファイルは削除しちゃいましょう。
index.phpを選択してDeleteで削除できます。
(内容を全部消しちゃって書き換える方法でも大丈夫です)

それではテスト用のPHPファイルを作成します。
メニューバーのNew Fileを選択して新しいファイルを作りましょう

するとUntitled-1という名無しファイルができます。
そのままCtrl + S(上書き保存)すると名前を付けて保存することができますので、ファイル名はindex.phpで保存します。ここで名前が違うとうまく表示されなくなってしまうので気を付けましょう。

これでPHPファイルは完成です。

②PHP記述してWEBブラウザで確認

　PHPのファイルができたので早速PHPを記述して記述内容をWebブラウザで確認してみましょう。

PHPを書く

　今回は確認さえできればいいので、お決まりのHELLO WORLDを表示させちゃいましょう。
下記のコードをindex.phpに記述しちゃいましょう。

<?php
 echo "HELLO WORLD";
?>

記述したらCtrl + Sで上書き保存して、Webブラウザでhttp://localhost/にアクセスすると…

しっかり表示出来ているのが確認できました！お疲れ様でした！
index.phpの内容を変えて、更新したらしっかりと内容が変わっていることを確認してみてください！

まとめ

　今回でローカル環境でPHPを書ける環境を構築しました。とはいっても初期構築のやり方も言語一つとっても様々なので、自分の環境にあったやり方を見つけましょう。その際に一つ一つ理解していると構築しやすくなります。

次はLaravelの導入方法を書こうと思ったのですがこの方がわかりやすくまとめているのでこちらをどうぞ！！！(一部内容被っております)

→初心者による投稿機能付き掲示板の作成

初歩的な内容でしたが、ここまでお読みいただいてありがとうございました！