環境構築

 

 

PHPを学習するための、環境構築をしましょう!

ひとくちに環境構築といっても、複数のツール(道具)をすべてインストールする必要があります。ツールは以下のとおりです。

かっこの中は本記事で取り上げる具体的なツール名です。

  • Webブラウザ(Chrome)
  • テキストエディタ(ATOM)
  • Webサーバー(Apache)

それでは順にインストールしていきましょう。

Webブラウザ(Chrome)

普段お使いのブラウザでもよいのですが、できるだけChromeを使ってください。

なぜかというと、ChromeにはWebサービスを開発する上で、非常に便利な開発者用ツール「デベロッパーツール」があるからです。

Chromeのインストーラは以下のURLからダウンロードできます(2017年12月現在)。

https://www.google.co.jp/chrome/browser/desktop/index.html

テキストエディタ(ATOM)

テキストエディタをインストールしましょう。

PHPでは文字コードをUTF-8にてファイル保存する必要があります。

Windowsに最初から導入されているメモ帳でもできるのですが、ファイルを新規作成するたびに文字コードをUTF-8に変える必要があります。

しかもメモ帳は機能的に物足りません。これを機にATOMやSublime Textといったテキストエディタをインストールしましょう。

本記事では、テキストエディタとしてATOMを使います。

ATOMのインストーラは以下のURLからダウンロードできます(2017年12月現在)。

https://atom.io/

画面中央の赤いボタンは、OSによってラベルが変わります。

ダウンロードしたあとは、インストーラの指示に従ってください。

Webサーバー(Apache/XAMPP)

Webサーバーとは、ブラウザからのアクセスを受けて画面のHTMLを返す役割をします。さまざまなWebサーバーが存在していますが、ここではPHPではメジャーなApacheというWebサーバーを使用します。

ただしApacheを単体でインストールするのではなく、データベースやPHP言語そのものを一括でインストールや管理ができるXAMPP(ザンプ)をインストールします。

XAMPPのインストーラは以下のURLからダウンロードできます(2017年12月現在)。

https://www.apachefriends.org/jp/index.html

お使いのOSにあったインストーラをダウンロードし、画面の指示に従ってインストールしてください。

インストール後Apacheを立ち上げて、問題なく動作するかを試しておきましょう。

XAMPPから、Apacheを立ち上げてみてください。

Windowsの画面です。

図中のApacheの行にあるStartボタンをクリックしてください。エラーが表示されることなくApacheが立ち上がればOKです。

Windowsは起動後こうなります。行の状態が変わっていることにお気づきでしょうか。何かエラーが発生していれば、下のログ表示にその内容が表示されます。

Macの画面です。

Servicesのタグをクリックして、Apacheをクリック後、Startボタンをクリックしてください。Apacheという言葉の左にあるマルが、緑色に変われば起動できています。

Macでは、エラーの情報はLogタブに表示されます。

文字を出力させてみましょう

動作確認をかねて、Hello!という文字を画面に表示させましょう。

ATOMを立ち上げて、メニューバーから「File」→「New File」を選択してください。

ファイルの新規作成画面になります。そして次のように入力してください。

入力ができたら、任意の場所に保存してください。「File」→「Save」を選び、フォルダ選択のダイアログを表示させて、お好きな場所(フォルダ)を選択後、Hello.phpという名前を入力して保存ボタンを押します。

保存したファイルを、XAMPP管理下にあるhtdocsというフォルダへコピーします。このフォルダは外部へ公開する(つまりブラウザから表示できる状態にする)ためのフォルダです。

Windowsでは、XAMPPインストール時に標準と異なる場所を選ばない限り、標準で以下になります。

Macではここです。

(ファインダーからMacintosh HD→アプリケーション→XAMPP→xamppfiles→htdocsと進んでください。)

コピーが終わったら、Chromeを立ち上げて、アドレスバーに以下を入力してEnterしてください。

http://localhost/Hello.php

Hello!と表示されればOKです。

 

それではいよいよ本格的なプログラミングに進んでいきましょう。

入門編1 WEBプログラミングを始めましょう!