どのプログラム言語を覚えればいいのか分からないっていう初心者さんのためのガイド（Web）
作りたいWebサイトのアイデアはあるけど、どんなプログラムを勉強したらいいか分からない人のためのざっくりとしたガイドです。 XHTMLとCSSはわかるけど ... という人初心者さんが対象の記事になってます。
インターネット上には本当に色んなWebサイトがあって、こんなサイトを自分でも作ってみたいなーと思う事がたくさんあります。でも、いざ自分で作ってみようと挑戦しようとするとき、これって何でできてるんだろうと考えます。そういえば、まだホームページを作り始めるずっと前にもそんな風に思っていた初心者時代がありました。（今でも初心者みたいなものですが …。）
やりたい事はあるけれど、まず、どんなプログラムを勉強すればいいのか、そこからが分からなかったんですよねー。プログラムといってもC言語系、PHP、Java、Perl、Javascript … たくさんあって初心者さんには意味不明だと思います。各プログラム言語の入門サイトはいっぱいあるけれど、どれを勉強すればいいのかが分からないとどこから手をつけていいのやらと思っている人もいるかもしれません。
このブログの読者さんにはちょっと合わないテーマかもしれませんが、最近勉強を始めた友達のためにブログにしておきます。ホームページが基本 XHTML によって書かれていて、ページの装飾に CSS を使うってことは知ってるんだけど … という方が対象です！
目標：WordPressで自分らしいブログを作る！
ちょっと説明するのに終りとなる目標がないと起承転結にならないので、目標は WordPress で自分らしいブログを作る！ということにしますね。
WordPress（ワードプレス）はデータベースに MySQL を利用し、PHPで書かれたオープンソースのブログソフトウェアである。b2/cafelog というソフトウェアの後継として開発された。GNU General Public License（GPL）の下で配布されている。
Wikipedia
初心者さんにとって、こういう文章って？？？だと思います。私も最初は、そもそも WordPressって何？MySQLって何？PHPって何よー？って感じだったんですから。でも今はそれで大丈夫。順を追って説明します。
どのプログラム言語を覚えればいいの？ 目次
- クライアントサイドとサーバーサイド
- クライアントサイド・スクリプトで何ができるの？
- サーバーサイドスクリプトって何ができるの？
- WordPressって何ですか？
- 結局どのスクリプトを勉強すればいいの？
1. クライアントサイドとサーバーサイド
XHTML、CSS が分かってれば簡単なホームページは作れますよね。で、そこにどうやってプログラムが関わってくるのかを簡単にご紹介します。それからここまで分かりやすさを優先してプログラムと表現してきましたが、語弊もあるのでスクリプトと言う言葉を使いますね。
スクリプトにはざっくりとクライアントサイド・スクリプトとサーバーサイド・スクリプトというふたつに分ける事ができます。
サーバとはインターネット上のどこかにある、あなたのホームページを置いてある場所っていう感じです。クライアントサイドというのはお客さん側という意味ですけど、ホームページを見ている人のパソコン、もっと言えばブラウザってことです。
ブラウザ：あなたがインターネットを見る時に使っている Internet Explorer や Safari のことを総称してブラウザと言います。ブラウザにはたくさん種類があって、どれも無料でダウンロードして使う事ができます。下のアイコン見た事あると思いますが、これら全部ブラウザです。それぞれに便利な機能がついていて選びがたいのですが、自分にあったブラウザでインターネットをもっと快適に！
2. クライアントサイド・スクリプトで何ができるの？
スクリプトにはざっくりとクライアントサイド・スクリプトと、サーバーサイド・スクリプトに分けられる事がわかりました。まずはクライアントサイド・スクリプトではどんなことができるのかをご紹介します。
クライアントサイド・スクリプトといえば、Javascript が代表選手です。（Java と Javascript とは別物なので注意してくださいね。）
2. 1. クライアントサイド・スクリプトの例 #1
Javascript でどんなことができるかというと、本当にいろんな事ができちゃうんですけど、簡単な例から見ていきます。例えば、ユーザーにいろんな情報を入力してもらうフォームでも Javascript はよく使われています。
上の例では、電話番号を入れなければいけない部分にアルファベットが入っています。電話番号は数字、もしくは数字とハイフン（-）で構成されているので不正な値ですよね。だから、間違ってますよーという警告を Javascript で出力しています。XHTML だけじゃできませんよね。
参照サイト：MobiCart
送信ボタンを押す → ページを移動 → 間違ってますよー！という流れよりも、その場（クライアントサイド）で警告を出してあげた方が親切だし、サーバ側の負荷も減ります。最近ではクライアントサイドでフォームの値をチェックするのが主流になってますね。
2. 2. クライアントサイド・スクリプトの例 #2
ホームページ上で色んなエフェクトを加えるのにも Javascript は使われています。サムネイル（縮小画像）をクリックすると元の画像がドーンとポップアップ表示される Lightbox というプラグイン（後述）も Javascript でできています。
それからこの記事のところどころに設置してある ↑ 目次へ というアンカーリンクをクリックすると、するするーっとページ内を移動します。これも Javascript です。
クライアントサイド・スクリプトはユーザーのブラウザ側で動くスクリプトのこと。だから基本的にはサーバ側には影響を与えないし、そういう意味ではできる事も限られてきます。
（注釈：Ajaxという手法もあって、上の表現は適切じゃないかもしれないけれど、クライアントサイド・スクリプトの基本はこんな感じです。）
だんだん分かってきましたか？注意することは、クライアントのブラウザで動くので、いろんなブラウザでキチンと動くかどうか確認が必要になりますね！
2. 3. jQueryって何？
クライアントサイド・スクリプトの代表選手、Javascript について簡単に説明しましたけど、それではjQuery って何でしょう？よく目にしますよね。
jQueryは、JavaScript と HTML の相互作用を強化する軽量な JavaScript ライブラリ。John Resig が2006年1月に開催された BarCamp NYC でリリースした。MIT License と GNU General Public License のデュアルライセンスであり、フリーかつオープンソースである。
Wikipedia
… さっぱりです … まず、ライブラリというのは図書館！じゃなくて、部品置き場みたいなものだと思ってもらって差し支えないと思います。他のスクリプトから呼び出して、組み合わせて使うっていう感じで、一から作るよりもずっと効率的に作業することができるようになります。
Javascript の代表的なライブラリには prototype.js というものもあり、jQuery も Javascript ライブラリのひとつです。
もちろん他のスクリプトにもライブラリがあったりします。例えば、PHPというスクリプトのライブラリでは、PEAR なんかがあります。（部品というよりも拡張モジュールという感じですけど）
2. 4. じゃあplugin（プラグイン）って何？
プラグイン… よく聞きますよねー。jQuery のプラグイン、とか WordPress のプラグインとか。よくプラグ（コンセント）のアイコンで表現されてたりします。
プラグインという言葉はとてもあちこちで使われているのでひと言で説明するのはちょっと無理な感じがしますが、ざっくりいうと、コンセントを入れると電化製品が動き出すように、プラグインを導入すると新しい機能を使う事ができるようになるって感じです。
jQuery のプラグインといったら、jQuery にプラグを差し込んで（ jQuery がないと使えないので）ある機能を追加するっていうことです。
例えば、画像などをスライドショー的に表示してくれる EasySlider なんかも jQuery のプラグインです。
簡単にスライダーをWebサイトに設置できるEasySlider
こんな風にたくさんのプラグインがインターネット上にはたくさんあります（有料だったり、無料だったり様々です）。自分で1から作らなくても利用できるので、とっても嬉しいしありがたいですよね。
他にも DropDown メニュー（マウスを置いたりクリックするとでろでろーって出てくるナビゲーション）とか、さっきも出てきたフォームに入力された値が正しいかどうかを判断するプラグインなんかもあります。
クリックするとセクシーにメニューがでてくる Sexy Drop Down Menu
クライアントサイド・スクリプトってどんな感じかが大体つかめたでしょうか？ホームページを見ているみんな（クライアント）のブラウザで仕事をするのがクライアントサイド・スクリプトです。あなたのやりたいことが、クライアントサイド・スクリプトでできるんだったら、Javascript を勉強してみるといいと思います。
注記：Javascript でできることは本当にたくさんあって、ここで紹介していることはほんの一部、0.1%くらいだと思います。クライアントサイド・スクリプトというものがどんなものかということを伝えるために紹介したにすぎません。色んな可能性を秘めた Javascript … ぜひ学習したいスクリプトのひとつです！
Javascriptのおすすめ書籍
- オライリー JavaScript
私はオライリーのこの本を読みました。初心者さんにも分かりやすく書かれていると思います。
（アマゾンへ飛びます）
3. サーバーサイドスクリプトって何ができるの？
クライアントサイド・スクリプトに対して、インターネット上にあるサーバで動くスクリプトがサーバーサイド・スクリプトです。サーバーサイドスクリプトにはいろんなスクリプトがあります。
PHP（ぴーえいちぴー）、Javaサーブレット（じゃばさーぶれっと）、Python（ぱいそん）、Perl（ぱーる）、ASP（えーえすぴー）など …私はPHP以外は詳しくないので紹介もおすすめもできませんが、本当にたくさんありますねー。
ではサーバーサイドスクリプトではどんなことができるのか、簡単にご紹介します。
3. 1. サーバーサイドスクリプトの例
サーバーサイドスクリプトの特徴として、ユーザーからのリクエストを受けて、サーバーで処理、そしてその結果をユーザーに返すといったことができます。ちょっと分かりにくいですねー。
例えば、前述したお問い合せフォームがあったとして、あなたが名前や電話番号、メッセージを入れて送信します。
これがリクエスト。そのメッセージをサーバーサイドスクリプトが受け取って処理をします。
例えば、メッセージに不備があったら、「記入漏れがあるのでやり直してください」的なページを出力したり、不備がないようなら「お問い合せありがとうございました」のようなページを表示させるとか。
何となくイメージが湧きましたか？例えば通信販売の注文の処理とかもサーバーサイドスクリプトがあなたのリクエストを受けて仕事をして、その結果をWebページとして出力します。
他にも、このブログにも検索機能がついていますが（ページのいちばん上に検索窓があります。）、キーワードを入力して送信。これがリクエスト。リクエストを受けたサーバーサイドスクリプトが仕事をして、結果をWebページに出力。
こうやって動的にWebページを作成してくれるのがサーバーサイド・スクリプトの特徴のひとつです。クライアントサイド・スクリプトではできないこともサーバーサイド・スクリプトではできるんですねー。
3. 2. 動的、静的って何？
XHTML と CSS しか知らない頃は、この動的にページが作成されるってことすら知りませんでした。あなたは今、XHTML と CSS でホームページを作ることはできるはずですよね。ファイルの拡張子は .html で。
でもそのホームページはあなたが XHTML ファイルを書き換えてサーバーにアップし直さない限りずっと同じままですよね。こんな風な純粋な XHTML で書かれたホームページを静的な（スタティックな）Webページと言います。
静的なWebページに対して、ユーザーのリクエストに応じて自動的にサーバーサイド・スクリプトによって作られるページを動的ページと言います。
例えば Yahoo でキーワードを入れて検索すると …
こんな風に検索結果が表示されますよね。これはサーバーサイド・スクリプトによって動的に作られたページで、リクエストは URL にパラメータ（引数）をくっつけて送られています。
分かりやすく図にするとこんな感じです。
これは一例ですけど、こんな感じで自動でページ作られています。検索結果一件一件のページを誰かが手書きで XHTML 書いてる訳ではありません …
3. 3.データベースと組み合わせる
サーバーサイド・スクリプトでは他にも掲示板や予約システム、通信販売用のカートなど、本当に色々なことができます。でもデータベース（データをしまっておく入れ物）と組み合わせることが多いので、データベースについても勉強したほうがいいかも。
データベースにも色んな種類がありますが、私は SQLite と MySQL というデータベースしか使ったことがないので、他のデータベースについては紹介できません。例えば MySQL というデータベースを操るなら、SQL文というものも覚えなくてはなりません…
4. WordPressって何ですか？
今までクライアントサイド・スクリプトとか、サーバーサイド・スクリプトとかを紹介してきましたがWordPress（わーどぷれす）というのは何でしょう。PHP（サーバーサイド・スクリプト）で作られた CMS（Contents Management System）です。
CMS（しーえむえす）を使えば、コンテンツを作るだけで自動的（動的）にページを作ってくれます。ブログをやったことがある人なら分かると思いますが、記事を書くだけで新しいページがどんどん作られていきますよね。別にブログじゃなくてもいいんですけど、コンテンツを書くだけで動的にページを作ってくれるので、Webサイトの構築がとっても簡単にできちゃいます。
他にも OpenPNE、Zen Cart、XOOPS、EC-CUBEなど、たくさんのCMSがあります。通信販売に特化したものやポータル、コミュニティーに特化したものなど、様々なタイプの CMS を無料で利用することができます。ここで紹介した CMS は全部 PHP（サーバーサイド・スクリプト） + MySQL （データベース）で構築されています。
4. 1 .WordPress を使うのに覚える必要があるのはどれですか？
WordPress には無料で利用できるテーマもたくさん配布されていますし、機能を追加できるプラグイン（ jQuery のところでも出てきましたね）もたくさんあります。なので、特にスクリプトを覚えなくてもブログくらいなら誰でも簡単にできてしまいます。そこが CMS のスゴいところですねー。
でも自分の思うようなWebサイトを作るなら、少なからずカスタマイズする必要もありますから、スクリプトについての知識は必要になります。
注釈：WordPress のテーマというのは、Webサイトのデザインや最低限の機能がパッケージされたテンプレートのようなものです。
5. 結局どのスクリプトを勉強すればいいの？
やりたいことによって覚えるべきスクリプトは変ってきますよね。でもWebサイトを作成するならクライアントサイドの Javascript は覚えた方がいいかもしれませんね！Javascript でできることはとってもたくさんあります。Javascript では、DOM、Ajax なんてものも出てきて、とっても勉強のしがいのあるスクリプトです。
サーバーサイドサイド・スクリプトについては、私がPHPくらしかできないのでPHPを簡単に紹介すると、
決して難しいスクリプトではありませんよー。もちろん完全に習得するにはたくさん学習する必要はありますが、初心者さんでも馴染みやすいスクリプトだと思います。
PHPを学習するなら、合わせて MySQL（データベース）についても少し学習した方がいいかもしれません。もちろんデータベースなんて使わないよーという人なら必要ありませんが。
PHP、MySQL おすすめ書籍
- PHPによるWebアプリケーションスーパーサンプル 第2版
初心者さんから中級者まで使えるPHPのサンプル集です。私も辞書がわりに結構使ってます。 - 基礎からのMySQL
MySQLの入門書てしてはとても分かりやすいと評判の一冊です。
（アマゾンへ飛びます。）
5. 1. スクリプトを勉強するには何が必要なの？
Javascript を学習するならテキストエディタとブラウザがあれば特に必要なものはありません。最初のうちは無料で利用できるテキストエディタで十分だと思います。
無料で利用できるテキストエディタ
- CotEditor
Mac用。スプリクトごとにカラーリングもできたりするので使いやすいと思います。 - Fraise
Mac用。フリーとは思えない素敵エディタです！ - さくらエディタ
Windows用。機能的には十分な感じがします。
クライアントサイド・スクリプトである Javascript はブラウザがあれば動きますが、サーバーサイド・スクリプトを動かすためには、あなたのパソコンの中にサーバを用意しなくてはなりません。
サーバって聞くとインターネット上にあるもので、レンタルしなきゃいけないっていうイメージを持ってる人もたくさんいるみたいですが、サーバはあなたのパソコンの中に構築することかできます。ローカルサーバとか、ローカル環境とか言ったりします。
サーバをインターネット上ではなくて、自分のPCの中に置いてあるってことです。ローカルサーバでWebサイトを作って、完成したらインターネット上のサーバにアップするって感じです。
私は PHP + MySQL （サーバーサイド・スクリプト + データベース）でWebサイトを作っているので他のスクリプトの環境は分からないです。なので PHP + MySQL 環境を簡単にローカルに構築する方法だけになってしまいますが、ご紹介します。
5. 2. 無料で利用できる PHP + MySQL のローカルサーバ
サーバをセットアップして、PHPをインストールして、MySQL を構築して … なんて個別に難しいことをしなくても、Apache（あぱっち）というWebサーバ、PHP、MySQLがセットになっていて、無料で簡単に利用できるパッケージがあります！
- MAMP
Mac用の Apache、PHP、MySQL のパッケージです。有料版のMAMP PROもあります。 - XAMPP
Windows用コメントでご指摘いただいて訂正しました！Windows、Linux、Mac OS X、Solaris の Apache、PHP、MySQL のパッケージです。 - WampServer
Windows用の Apache、PHP、MySQL のパッケージです。私は使ったことがないので ….
これをインストールすれば、ローカルで PHP + MySQL の環境が簡単にできちゃいます！しかも無料なんてうれしすぎます。
あとはいろいろいじり倒してスクリプトを勉強しましょう
これで、クライアントサイド・スクリプト、サーバーサイド・スクリプトの両方を勉強する環境は整いました。インターネット上のいろんなWebサイトを参考にして勉強するのもいいし、書籍を購入して勉強するのもいいと思います。
WordPressもダウンロード
PHP + MySQL 環境で使える CMS、WordPress もダウンロードして、あなただけのWebサイトを作ってみてはいかがですか？色んなスクリプトを覚えながら、自分だけのWebサイトを作っていくのは楽しいですよー。
今回はホームページで色々やりたいことがあるけれど、どんなプログラム言語を勉強すればいいのか分からないっていう人に参考にしてもらえればいいな、という記事でした。私がPHP以外のサーバーサイド・スクリプトに詳しくないので、こういうことがしたいなら、コレ！というような紹介ができなくてごめんなさい。
私自身、PHP、WordPress などでWebサイトを作ることが多いので、 PHPをお勧めするよう内容になってしまいましたが、人それぞれやりたいことがあって、それにあったプログラム言語があると思います。何を勉強すれば、自分の作りたいホームページが作れるようになるのか … その参考にしてもらえれば嬉しいです。
追記：PHPのセキュリティーについて
PHPのセキュリティーについて … というコメントを頂いたので、追記させてください。最初からセキュリティーについて少し触れておくべきでした。ごめんなさい。
入力のフィルタ
PHPのようなサーバーサイドスクリプトを扱う場合、常にセキュリティーの事を考えながらコードを書く必要があります。ユーザーからリクエストを受けて、サーバーが処理をするという流れの中では、不正なリクエストがあった場合の事を考えておかなくてはいけません。
インターネット上に公開する以上、これは必ず行わなければいけない大事な事なので、自分でコードを書いてWebサイトを運営する場合は気をつけてくださいね。
ユーザーからのリクエストに対しては基本的にフィルタを設けて、Webサイト（あなた）が許可するもの以外は受けつけないようにしましょう。
簡単な例を上げると、お問い合せフォームに名前を入力するテキストボックスがあったとします。ここにデータベースの値を改ざんするようなSQLコマンドを入力して送信するとどうなるでしょう？送られてきたSQLコマンドをフィルタを通さずに処理するとデータベースの値を改ざんされてしまう事だって起こってしまいます。
こういう攻撃をSQLインジェクションといいます。ユーザーからのリクエストは常にフィルタを通して、通ったものだけサーバで処理をすすめた方が安全です。
出力のエスケープ
今度は出力時、PHPが動的にコードを吐き出しブラウザで閲覧できるように出力した場合を考えてみます。これも簡単な例ですが、ユーザーの入力した値を出力するときは必ずリスクが伴います。入力が適切にフィルタされて、エスケープされていなければどういう事が起こるでしょう。
初心者さんにも分かり易く説明するために、XHTMLタグをエスケープせずに出力した場合を考えてみます。入力フォームの”名前”を入力する欄に”<h1>高橋 のり”と終了タグのない h1 タグが入力されたとします。これをエスケープしないでそのまま画面に出力するとどうなるか？
<h1>タグによって文字は大きくなり、それ以降終了タグもないのでWebページ全体の文字が大きくなってしまいますよね。これは<h1>タグだから害はありませんが、悪質な Javascript のコードだったりしたら大変です。ブラウザのクッキーを盗み取られたりすることだってあります。
PHPで動的に作られたWebページを画面に出力する場合にも、入力時と同様に気を配り、エスケープ処理などをする必要があります。
PHPは初心者さんにも親しみやすいスクリプトだと思います。でも同時にセキュリティーについても学ぶ必要も出てきます。ここで紹介したことはセキュリティーについてのほんの一部です。
ファイルアップロード攻撃、クロスサイトスクリプト攻撃、HTTPリクエストの偽装、SQLインジェクションなどなど、様々な攻撃からサーバを守るセキュリティーについて勉強しなくてはなりません。
コメント欄で指摘されたように、こういう事は最初から紹介しておくべきだったなと反省しています。
PHPセキュリティー入門書籍
- オライリー：入門PHPセキュリティ
初心者さんがPHPのセキュリティー対策の基本的な考え方を身につけるのにはいい本だと思います。私も読みました。
（アマゾンへ飛びます。）
