![見出し画像](https://assets.st-note.com/production/uploads/images/94359711/rectangle_large_type_2_8e94d9cfea262d4c1cfcbe8ca6b252e1.png?width=1200)
8.[PG4]PHPでTODOリスト(csv版)を作ってみよう(xampp & PHP) その1
こちら第8回「プログラマー養成講座」のパート1になります!
目次はこちらからご参照下さい!
PHPとは? なぜPHP?
今日からは、MicrosoftOfficeを離れることになると聞いています。
そうです。今日からひさきさんにはPHPを勉強してもらいます。
ピー・エイチ・ピーと読みます。
PHPは、1995年に開発され、今年で27歳になりますが
今も継続してアップデートされている元気なWEB言語です。
ITの世界は、流行り廃りがどうしてもありますが、
安定して成長している言語といえると思います。
世界のWEBページの3分の1を作っていると言われる
「Wordpress」というBlogシステムはPHPで開発されています。
ふむふむ
PHPは、主にはWEB上のページ表示に使われることが多いです。
Wordpress以外にも、色々なWEBシステムがPHPで作成されています。
ですがパワーシェルのように実行プログラムもPHPでかけます。
実はVBにもWEBページを作成する機能があるのですが、
今回はPHPを勉強してもらおうと思っています。
それはどうしてですか?
ExcelVBAとAccessVBAはプログラムがほとんど同じプログラムなのですが、
ここでPHPも少しかじることで、
VBAとPHPでも、書き方のルールなどは違うけど、
IF文やループ文の考え方/構造は同じであることを
肌で感じて頂けると思います。
そういう意味ではJavaでもRubyでも良いのですが、
それらに比べてPHPは開発環境を作るのが頭一つ抜けて<簡単>なのでチョイスしました。場合によっては、Javaのサーブレットなどは、Eclipseで開発環境を作るだけで手いっぱいになってしまったりするので、ちょっと敷居が高いです。PHPの開発環境は「xampp」(ザンプ)を使いますが、低スペックPCでもサクサク動くのでそこも良い点です。何せ私のノートPCは7年目になりますので、そろそろ型落ちですが、xamppは余裕で動きます。
ここでVBAでもPHPでも慣れれば、PerlやJavascriptなどはすぐ使えるようになりますし、その後にJavaやRubyなども習得候補になるでしょう。
開発環境を作るのが簡単というのは良いですね。
プログラム以外にも言えることですが、
「最初の1歩は軽ければ軽いほど良い」
と思います。
PHP開発環境構築(XAMPP)
(以下、すべて師匠の言葉になります)
ではGoogleで「xampp」と検索して下さい。たぶん一番上に出てくるサイトでURLが、 www.apachefriends.org で始まります。画像を流用して良いかわからないのですが、オレンジ背景にXが掛かれたアイコンです。
ちなみにサイトトップからWindows用のxamppをダウンロードすると、「Windowsインストーラー」を使うバージョンになります。このほかに「ZIP展開」バージョンや、「USBフラッシュメモリに入れるよう」バージョンなどがあります。今回はWindowsインストーラーを使いましょう。
![](https://assets.st-note.com/img/1672280371219-76Wq18Bwi5.png?width=1200)
![](https://assets.st-note.com/img/1672280407325-3c53AU0ymI.png?width=1200)
ダウンロードが終わりましたら、サイトは閉じちゃって大丈夫です。
ダウンロードしたWindowsインストーラーを実行しましょう。
![](https://assets.st-note.com/img/1672280523606-2Nt3n1k9o4.png)
Next を押しましょう。
![](https://assets.st-note.com/img/1672280556626-OuIfxcKSUa.png)
そうですね。そのままNextでもいいのですが、今回使わないものはチェックを外しましょうか。
FileZilla FTP Server・・・FTPサーバー機能。今回は不要。
Tomcat・・・WEBサーバー。今回はApacheを使うので不要。
Perl・・・プログラム言語。今回はPHPを使うので不要。
Webalizer・・・WEB解析機能。今回は不要。
![](https://assets.st-note.com/img/1672280740356-dalQoROLJs.png)
Next を押しましょう
![](https://assets.st-note.com/img/1672280921111-xCHq6FgOHi.png)
インストールフォルダはデフォルトで良いと思います。
Next を押しましょう。
![](https://assets.st-note.com/img/1672280960213-53Q8PIhbQf.png)
言語は何でもいいです。「Start」と「Stop」しか使いません。
Next を押しましょう。
![](https://assets.st-note.com/img/1672281135948-oCQkRs3hck.png)
準備は良いか?と聞かれています。
Next を押しましょう。
![](https://assets.st-note.com/img/1672281173387-U37JnLFIn6.png)
ちなみに私は、仮想マシン上でインストールを実行しました。ディスク容量40GBの、メモリ2GBの、シングルスレッドCPUの仮想マシン上でもxamppは動作可能です。
(ひさき:仮想マシン・・・。なんかカッコいいですね・・・。)
仮想マシンに興味があれば、また今度教えてあげますね。
![](https://assets.st-note.com/img/1672282224086-JaYWaFFEu8.png)
Finishしましょう。
![](https://assets.st-note.com/img/1672282269777-1jgGunDzgt.png?width=1200)
今表示されたのがxamppのコントロールパネルです。
ここでやることは大きく2つです。
1.サービスの「Start」「Stop」すること
2.サービスの「Config」、つまり設定を変更すること
です。
基本的に「Apache」しか起動しなくて大丈夫です。
PHPは、ApacheというWEBサーバー上で動作するプログラム言語ですので、実行するのは「Apache」になります。
では、ApacheをStartさせて下さい。
初回だけ、ファイアウォールの設定でブロック画面が表示されると思います。とりあえず「プライベートネットワーク」「パブリックネットワーク」の両方のチェックを外して下さい。
これはひさきさんのPC以外から、WEBサーバーへの通信を許可するかの確認画面です。現状では通信を許可しない設定で進めましょう。
![](https://assets.st-note.com/img/1672825677131-FMClOOPaAA.png)
![](https://assets.st-note.com/img/1672282681124-Z1RF7frovf.png?width=1200)
さて、このようにApacheが稼働状態になりましたか?
なったら、実際にWEBページを表示してみましょうか。
PHPの動作検証、動作確認
何でもよいのでWEBブラウザを起動して、URLを、
127.0.0.1
を入力してOKを押してみて下さい。
勝手にダッシュボードに転送されて、以下のようなページが出たら成功です。ちなみに「127.0.0.1」というのは全世界共通で「自分のPC」を見るためのIPアドレスです。
![](https://assets.st-note.com/img/1672282797299-S7u5JcHBjP.png?width=1200)
さて、今表示されているのは、自分のPC内にインストールされたWEBページです。実際には
C:\xampp\htdocs = 127.0.0.1
に存在しています。
C:\xampp\htdocs にテキストファイルを作成してみましょうか。
test.txt でいいです。
test.txtを開いて「テスト」と書いて閉じましょう。
http://127.0.0.1/test.txt
にアクセスしたら、どのように表示されたでしょうか?
ちなみに、私がEdgeでアクセスしたら、以下のように表示されました。
![](https://assets.st-note.com/img/1672283263214-L3MeqUdlpu.png?width=1200)
これは所謂(いわゆる)文字化けというやつですね。
文字化けを解消する方法は2個あります。
1.ブラウザのデフォルト文字コード(ANSI)に合わせる
2.このページが文字コード(UTF-8)で書かれていることを明記する
1については、ファイルを保存するときに変更して保存することができます。メモ帳で「名前を付けて保存」を選んだ時に、下の方に実は「文字コード」ってあるのでそこを「ANSI」に選択して保存するだけです。
![](https://assets.st-note.com/img/1672283580107-cCbBdLrgik.png)
こんな感じですね。
![](https://assets.st-note.com/img/1672283617383-2RqTytHkif.png?width=1200)
ちゃんと表示されましたか?
では次にファイル名を「test.php」を作成して、同じように中身に「テスト」と記載して閉じて、WEBブラウザで表示してみましょう。
![](https://assets.st-note.com/img/1672283754063-jhg48xSx7d.png?width=1200)
一応、この段階でPHPでも動作していることを確認できていますが、味気なさすぎなので、
テスト
<?php
print "PHP実行";
?>
これをtest.txtと、test.phpの両方に記載して、
両方のページをWEBブラウザ上で表示して、内容を確認して下さい。
![](https://assets.st-note.com/img/1672283988706-NMBzUBUd8z.png)
![](https://assets.st-note.com/img/1672284011488-ZUoSEwZWiY.png)
どうでしょうか。txtファイルの方は、記載した内容がそのまま表示されていますが、phpファイルの方は、「print "PHP実行";」がうまく動いているようです。このようにWEBサーバーは拡張子で実行処理を決めています。PHPが実行されるのは「.php」という拡張子で、「.txt」ではPHPは実行されないことが確認できました。
これからやること
今後やることを説明しておきます。
実は、PHP言語だけ勉強しても、WEBページを作ることができません。
WEBページの構成は(HTML、Javascript、CSS)の3つの要素から成り立ち、
プログラム言語は「WEBページを作成するプログラム言語」なのです。
検定に例えると、
WEBページ検定3級・・・HTML作成
WEBページ検定2級・・・CSS、Javascript実装
WEBページ検定1級・・・プログラム言語実装(PHP,Perl,Java,Rubyなど)
ちゃんとしたWEBページを作るには、このような感じで知識を深めていく必要がありますが、今回は2級部分は丸めてスキップします。
今回の研修では
・HTMLの基礎学習
・HTMLのフォーム作成
・HTMLのフォーム送信値をプログラム言語で受け取る
・プログラム言語で受け取った値をテキストファイルに出力
・テキストファイルを読み込み、TODO内容をHTML出力
をやります。
その題材として、「TODOリスト」を作成したいと考えています。
TODOリストとは「やらないといけないことを忘れないために一覧に書いておいて、やったら”対応済み”みたいに表示」ものです。
用途や使い方に応じて「いつまでにやるか」も記載したり、「誰がやるか」を記載したりもします。そういうのがなく、たんに付箋にやることをメモして貼っていくようなTODOリストもアリです。
最初なのでそこまで高性能なことは避けて、
ID(表示順)、タスク名、期日、対応フラグ(未対応or対応完了)
の4項目でいいかなと思います。
たかだか4項目でも、機能性を考えると色々なことができます。
・期日が近づいたら、背景色を変える
・対応フラグが完了になったら、表示しない
・対応フラグが完了のものも、表示する機能
・IDを変更したら、表示順が変わるようにしたい
ここらへんのちょっとした機能があると、使いやすいTODOリストにどんどんカスタマイズしていけると思います。
ひさき:
今日ほとんどしゃべってませんが、ひさきです!最初の一歩の「環境構築」は師匠のわかりやすい説明のおかげで、無事クリアしました!
実は、スマフォのメモ帳に「やることリスト」をつけていて、
毎日、書いて消してを繰り返していますので、
自分で使えるようなものができたら嬉しいです!
その2へ続く!!
この記事が気に入ったらサポートをしてみませんか?