VSCodeでPHPを開発
こんにちは、徳です。
デジタルDIYができるようコーディング・プログラミング・画像加工・動画編集などを本やYouTubeで勉強しています。
現在は初心者なので、とにかくゆっくり進んでいくと思います。
また、「間違っていること」や「こうした方が良いよ」などがあれば、コメントなどしていただけたら幸いです。
では、いきましょう!
PHP
今回は、
PHPの環境構築 (Mac版)
です。
こちらではPHPを、
で作成します。
そのため、
VSCodeのインストール方法
を紹介します。
それではよろしくお願いします。
環境構築とは
環境構築とは
環境構築とは、
プログラムを書いたり、実行できたりする環境を自分のコンピュータに整える
ことです。
普段使っているパソコンでは、そのままプログラミングはやりづらいです。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
せっかくならやりやすい環境で始めたいですよね。
そのため、プログラミングをやりやすいように整えましょう。
必要なもの
PHPを使用するのに必要なものは、
です。
PHP
PHPの開発には、PHPのインストールが必要です。
そのため、
ターミナル
![](https://www.noriblogs.click/wp-content/uploads/2023/05/check-tarminal.png)
でインストールしましょう。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
以前のmacOSではインストール済みだったようですが、
最近のバージョンでは無くなりました。
コードエディタ
ここでは、
Visual Studio Code
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vscode.jpg)
を使用します。
Visual Studio Codeとは、
Microsoft社が開発したプログラムを書くためのエディタ
です。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
PHP以外にもHTMLやPythonでも使用します。
ブラウザ
ここでは、
GoogleChrome
![](https://www.noriblogs.click/wp-content/uploads/2021/07/chrome.png)
を使用します。
GoogleChromeは、
Google社が開発したWebページを表示するブラウザ
です。
実際には、EdgeやSafariでも表示をすることができます。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
こちらは持っている人が多いと思いますので、
ここでは省かせていただきます。
しかし、
GoogleChromeのデベロッパーツールがとても便利なため
こちらにしました。
ダウンロード&インストール方法 それと拡張機能
PHP
インストール
1、ターミナルを開く
まずは
ターミナル
![](https://www.noriblogs.click/wp-content/uploads/2023/05/check-tarminal.png)
を開きましょう。
![](https://www.noriblogs.click/wp-content/uploads/2023/05/php-open-terminal.jpg)
2、「brew install php@8.0」を入力
ターミナルで
brew install php@8.0
![](https://www.noriblogs.click/wp-content/uploads/2023/05/php-ins.jpg)
を入力しましょう。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
インストール終了まで待ちましょう。
3、完了
![](https://www.noriblogs.click/wp-content/uploads/2023/05/php-fin.jpg)
セットアップ
インストールしただけではPHPは使用できません。
セットアップが必要です。
1、コードの入力
ターミナルに、
echo 'export PATH="/opt/homebrew/opt/php@8.0/bin:$PATH"' >> ~/.zshrc
![](https://www.noriblogs.click/wp-content/uploads/2023/05/set-code1.jpg)
を入力しましょう。
2、次のコードの入力
ターミナルに、
echo 'export PATH="/opt/homebrew/opt/php@8.0/sbin:$PATH"' >> ~/.zshrc
![](https://www.noriblogs.click/wp-content/uploads/2023/05/set-code2.jpg)
を入力しましょう。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
すみません。
これは何をしているかわかりません。
3、確認
ターミナルに、
php -v
![](https://www.noriblogs.click/wp-content/uploads/2023/05/set-check.jpg)
を入力しましょう。
![](https://www.noriblogs.click/wp-content/uploads/2023/05/set-fin.jpg)
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
これでPHPのセットアップ完了です。
Visual Studio Code
ダウンロード
1、公式サイトへ
公式サイトはこちらです。
2、「今すぐダウンロード」を押す
![](https://www.noriblogs.click/wp-content/uploads/2023/05/vscode-dounload.jpg)
3、ダウンロードフォーマットを押す
![](https://www.noriblogs.click/wp-content/uploads/2023/05/vscode-mac.jpg)
を押しましょう。
インストール方法
1、ダウンロードしたファイルを解凍
ダウンロードしたファイルを解凍しましょう。
![](https://www.noriblogs.click/wp-content/uploads/2022/01/in-defrost.jpg)
2、VSCodeをクリック
解凍するとVSCodeがインストールされているため、クリックして開きましょう。
![](https://www.noriblogs.click/wp-content/uploads/2023/05/ins-click.jpg)
3、[開く]を選択
![](https://www.noriblogs.click/wp-content/uploads/2023/05/ins-open.jpg)
4、完了
これで完了です。
![](https://www.noriblogs.click/wp-content/uploads/2023/05/ins-fin-2.jpg)
拡張機能
表示を日本語へ変換
Visual Studio Code
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vs-code.jpg)
インストールしたばかりの時は、英語表記です。
そのためまずは、日本語表示にしましょう。
1、「Extensions」を選択
こちらの「Extensions」が拡張機能になります。
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vs-extensions.jpg)
2、日本語表記のパックをインストール
Searchで
Japanese Language Pack for Visual Studio Code
を検索しインストールしましょう。
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vs-ja.jpg)
3、VSCodeの再起動
インストールし終わったら、VSCodeの再起動をしましょう。
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vs-restart.jpg)
3、完了
これで日本語表記になりました。
![](https://www.noriblogs.click/wp-content/uploads/2022/01/vs-complete.jpg)
まとめ
今回は、
PHPの環境構築
について紹介させていただきました。
PHPの環境構築としては、
の3つを準備をします。
こちらの3つを使用することで、
- エディタ:コードを作成
- ブラウザ:作成したページを表示
することができます。
特に難しいことはしません。
公式サイトへ行き、順番に進めていきましょう。
また、VSCodeの拡張機能として、
日本語表記
にする拡張機能もインストールしましょう。
![徳](https://www.noriblogs.click/wp-content/themes/cocoon/images/man.png)
やっぱ日本語の方がわかりやすいです。
最後まで読んでいただき、ありがとうございました。
コメント