プログラミング練習3つの準備

Pocket
LINEで送る


スポンサードリンク


それじゃあ、はじめてみようか。

まずは、プログラミングを練習できる環境を作ろう。30分~1時間くらいかかるかもしれないけど、これは最初だけだからがんばろう。

まずは、XAMPPとWordPressのインストールだ。

と言っても、たぶん何のことだか分からないだろう。まぁ、とりあえず両方とも有名なもので、無料で使えるものだから安心して大丈夫だ。

XAMPPの読み方は「ザンプ」。WordPressをローカル環境で動作できるフリーのソフトウェアだ。

つまり、PHPで書いたプログラムの練習結果をローカルで確認することができるんだな。

で、WordPressの読み方は「ワードプレス」。ブログやWebサイトを制作するためのプログラムだ。

WordPressはPHPで動くから、PHPのプログラム練習にはもってこいだよ。
(「はじめに」でも言ったけど、僕はWordPressで自分の好きなようにWebサイトを制作できるようになりたくて、プログラミングの勉強を始めたんだ。)

なんで、ローカルで練習するのかって?

プログラムをWeb上で動かすには、サーバが必要になる。サーバを使うにはお金がかかる。でも、ローカルで練習するなら、サーバを買ったり借りたりする必要がないんだ。

いきなりお金をかけるよりも、まずは無料で練習しようじゃないか

それに、プログラムはローカルで動作確認をするのが基本だ。これは覚えておこう。

だって、もしエラーのでるプログラムをいきなりWebサイトで使ったら、大変なことになるのは想像がつくよね。Webサイトが表示されなくなったら自分が困るし、間違ってエンドレスに続くプログラムを公開しちゃったりしたらみんなの迷惑だからね。

これからやり方を説明するけど、難しいことは考えなくていい。ここは準備だから、とりあえず機械的に進めてみてね。

じゃあ、まずは、XAMPPをインストールしよう。

ここにアクセスだ。
http://sourceforge.net/projects/xampp/files/XAMPP%20Windows/

この記事を書いている時点での最新版は、ver1.7.7なので、これをクリック。もし表示が違っていたら、一番上に表示されているものをクリックしてくれ。
XAMPPダウンロード

今回使うのは xampp-win32-1.7.7-VC9-installer.exe だ。そこをクリックしよう。
xampp-win32-1.7.7-VC9-installer.exe

ダウンロードする先を聞かれるので、好きなところを選んで「保存」をクリック。
保存

こんなメッセージが表示されるかもしれないが構わず「保存」をクリックだ。突き進め!
警告メッセージ

保存した場所にこういうアイコンができるので、ダブルクリック。
.exeファイル

「実行」をクリックしよう。
実行

言語は「English」しかないので、「Ok」をクリック。(もし「Japanese」が選べたら、そっちを選択してもいい)
English

「OK」をクリック。
OK

「Next」をクリック。
Next

「Next」をクリック。どこに保存したかは覚えておいてくれ。後で使うからね。(保存したい場所を選びたい場合は「Brows」をクリックして選ぼう)
Brows

ApacheとMySQLにチェックをいれて「Install」をクリック。ちなみに、Apacheってのはサーバーのソフトウェアで、MySQLはデータベース管理システムだ。もちろん、今は分からなくてもいい。なんとなく、そういうのがあるんだなくらいに思ってくれ。
ApacheとMySQLにチェック

インストール中である。しばし待たれよ。
インストール中

「finish」をクリック。
finish

「OK」をクリック。
ok

「はい」をクリック。
はい

ApacheとMySQLがRunningになっていることを確認。(もしRunningになっていなかったらRunボタンでRunningにしてくれ)
ApacheとMySQLがRunning

これでインストールは完了だ。お疲れさま!・・・といいたいトコだけど、まだ続きがある。

ブラウザを起動して、アドレスバーに、

http://localhost/

と入力してみよう。

xampp初期画面が標示されるので、「日本語」をクリックだ。
xampp初期画面

すると、こんな画面に切り替わる。おめでとう!と言われているので何やらめでたいらしい。喜んでおこう。
インストール成功

左下の方にある、phpMyAdminをクリック。お、PHPという言葉がでてきたね。phpMyAdminは、さっきチラっといったMySQLっていうデータベース管理システムを扱う管理画面だ。もし今は難しく聞こえても、そのうち分かるから心配しなくていいぞ。
phpMyAdmin

言語で日本語を選択。
言語で日本語

「データベース」をクリック→自分の好きなデータベース名を半角英数で入力→「作成」をクリック。
データベースを作成

これでやっとWordPressをインストールする準備ができた。疲れた場合は熱い緑茶でも飲んで休憩しよう。

ということで、準備のふたつめだ。WordPressをダウンロードしよう。

http://ja.wordpress.org/ にアクセスだ。

画面の右側にWordPressの最新版をダウンロードできるリンクがあるから、クリックしてくれ。
WordPress日本語版

で、好きな場所に保存。
WordPressを保存

保存した場所でwordpress-3.3-ja.zipをダブルクリック。(3.3とか数字のところはバージョンによって変わってくるぞ。)

wordpress-3.3-ja.zip

WordPressのフォルダをコピーしよう。
WordPressフォルダ

で、これをXAMPPフォルダの中にある、htdocsっていうフォルダの中にペーストする。(XAMPPフォルダの場所は分かるかな?さっき保存するとき覚えておいてくれ、って言ったところだ。)
htdocsにWordPress

そしたらブラウザで

http://localhost/wordpress/

にアクセスしてみよう。

こんな画面になるから、「設定ファイルを作成する」をクリック。
WordPress設定ファイル

「次に進みましょう!」をクリック。
次に進みましょう

ユーザ名を「root」、パスワードは空欄、データベースのホスト名を「localhost」として、「作成する」をクリック。
WordPressの設定

「インストール実行」をクリック。
インストール実行のやり方

以下を入力したら、「WordPressをインストール」をクリック。

  • サイトのタイトル・・・好きなタイトルを入力しよう。(後で変更もできる)
  • ユーザー名・・・初期ではadminになっているが、別のものに変えておいたほうがいいぞ。adminだとセキュリティ的に良くないからね(半角英数)。ユーザ名は覚えておこう。
  • パスワード・・・好きなパスワードを入力しよう。(半角英数)。パスワードも覚えておこう。
  • メールアドレス・・・キミのメールアドレスを入力しよう。

インストール方法

成功しました!という画面になる。「ログイン」をクリックして、WordPressの管理画面にログインしよう。
wordpressインストール成功

さっき設定したユーザ名とパスワードを入力しよう。このログイン画面のURL http://localhost/wordpress/wp-login.php はお気に入りに登録しておくと、なにかと便利だぞ。
ログイン

画面左上のサイト名にマウスオーバーし「サイトを表示」をクリック
画面左上のサイト名にマウスオーバーし「サイトを表示」をクリック

サイトがちゃんと表示されたかな?おめでとう!
サイトを表示

で、準備はあともう一個ある。

みっつめの準備は、PHPエディタだ。

PHPエディタっていうのは、PHPを編集する専用のソフトだ。

PHPエディタはいろいろあるんだけど、とりあえずフリーソフト『PHPエディタ』というのそのまんまの名前のヤツがあるから、これをダウンロードしよう。

PHPエディタの配布ページにアクセスして、画面を下の方にスクロールすると、「最新版のダウンロード」という項目がある。このphp_editor_s133.zipというところをクリックだ(数字はバージョンによって異なるよ)。どこに保存したかは覚えておこう。
PHPエディタスタンドアローン版

PHPエディタを起動すると、下のような画面になる。右側の空白エリアにプログラムを入力していくんだ。

プログラム入力エリア

次に、ちょっとした設定をする。メニューの「表示」→「エディタ設定」から「その他」のタブを開いて、「UTF-8」にチェックを入れ、「php.exe」の右の「…」をクリックし、さっきPHPエディタを保存した「PHP」フォルダの中の「php.exe」をダブルクリックする。すると、下の画面のようにパスが表示される。で、「OK」をクリックだ。
PHPエディタの設定

ちなみに「UTF-8」っていうのは文字コードと呼ばれるものだよ。WordPressでPHPのプログラムを動かすには、文字コードがUTF-8でなきゃならない。文字コードっていうのは、コンピュータで文字を利用するときに各文字に割り当てられるバイト数の設定だ。まぁ、よく分からないかもしれないけど、今は気にしなくていい。文字コードにはいろんな種類があるけど、ここではとりあえず、WordPressでは「UTF-8」を使うってことだけで充分だ。

さて、ここまでの設定が終わったところで、PHPエディタの簡単な使い方を覚えよう。

ファイルを保存するときは、画面左上の「ファイル」をクリックし「名前をつけて保存」する。PHP専用のエディタだから、拡張子は自動的に.phpになる。PHPを動かすには、拡張子が必ず.phpになってなければいけないんだ。これは覚えておいて欲しい。

ファイルを開きたいときは、「ファイル」から「開く」をクリックすればいい。

「構文チェック」という便利機能もある。これはキミが書いたPHPのスクリプトに文法的な間違いがあった場合教えてくれる親切機能だ。「エディタ編集」から「構文チェック」をクリック(ショートカットキーはF9)して、文法的な間違いがなければ、No syntax errors detected in・・・という画面が表示される。
PHP文法チェック

逆に、文法エラーがあった場合は、Errors parsing・・・と表示される。こうなったら書いたプログラムのスクリプトを見直して修正する必要がある。
PHP文法エラー

おっしゃ!これでプログラミングを勉強する準備は整ったぞ。

スポンサードリンク