トップ » 技術記事 » オリジナル Wiki を作ってみよう!(2) - 開発環境のセットアップ

オリジナル Wiki を作ってみよう!(2) - 開発環境のセットアップ

タグ: PHP Wiki

前回より、PHP を用いて Wiki アプリケーションを作る手順を解説しています。ゼロから Wiki を作ることで、Wiki がどんな仕組みで動いているのか、どんな技術要素が必要になるのかを解説します。

Wiki アプリケーションの企画

前回、Wiki とは何か、どんな Wiki があるのか、有名なものを紹介しました。そして、せっかくゼロから作るので、これまでに無いような機能をつけてみようということで、いろいろなアイデアを出してみました。前回は、アイデアを好き勝手に出しただけなので、本当に実現できるのかまでは考えていません。ですが、何回か連載を行っていく中で可能な限り、理想の Wiki を作っていきたいと思います。

PHP 環境の構築~XAMPP で開発環境を簡単セットアップ

さて、はじめに、PHPの動作する環境を用意していきましょう。PHP は、Web アプリケーションの構築によく使われてるプログラミング言語です。(前回紹介した MediaWiki や PukiWiki も、PHPで作られています。)なので、PHPだけをインストールしてもWebアプリケーションの開発環境を整えたことになりません。一般的なWebアプリケーションを製作・テストするためには、最低、PHPに加えて、WebサーバとMySQLのようなデータベースが必要になるでしょう。

これら、Webサーバー(Apache)・データベース(MySQL)・PHPがセットでインストールできる XAMPP という配布パッケージが用意されています。Windows, Mac OS X, Linux と主要なOSをターゲットとしたバイナリが用意されているので、これを利用したいと思います。ここでは、ユーザーが多いと思われるWindowsでの手順を紹介します。

XAMPP のセットアップ

では簡単に XAMPP のセットアップ方法を紹介してみます。

インストーラーをダウンロード

XAMPP のWindows バイナリは以下のサイトよりダウンロードできます。

  • XAMPP for Windows

XAMPP のページ

インストール

基本的にダウンロードしたセットアップファイル「xampp-win32-x.x.x-installer.exe」をダブルクリックして[次へ]をクリックしていくことで終わると思います。インストール先は「c:\xampp」などのスペースや日本語を含まないパスを指定することをお勧めします。

Apacheの起動

インストールを終えたら、スタートメニューから[Apache Friends - XAMPP - XAMPP Control Pnael」を起動します。そのためには、Apache の[起動]ボタンをクリックします。

XAMPP のコントロールパネル

テストプログラムの実行

それから、Webブラウザを起動して「http://localhost/」にアクセスします。すると、言語を選択する画面が出るので「日本語」をクリックします。以下のような画面が出ればインストールは成功しています。

XAMPP の画面

次に、「XAMPP Control Panel」の「エクスプローラ」ボタンを押すと、XAMPP をインストールしたフォルダを開くことができます。この中のフォルダ「htdocs」を開いてみて、そこに、「test.php」というファイルを作ってみましょう。「test.php」の内容は次のようにしてみました。

<?php
echo "Hello!!";
?>

そして「http://localhost/test.php」にアクセスします。うまくいくと、以下のような画面が出るはずです。

XAMPP でテスト

Apache の設定を変えなければ、XAMPP のインストールフォルダにある htdocs が、「http://localhost/」にマッピングされます。

KonaWiki を動かしてみよう

では、今、完成しているところまで、Wiki を動かしてみましょう。以下のページより KonaWiki をダウンロードしてください。

ZIPファイルになっているので、解凍ソフトでアーカイブを展開します。そして、次に、XAMPP の htdocs フォルダに KonaWiki の全ファイルをコピーします。

そして、ブラウザから「http://localhost/konawiki_setup.php」へアクセスします。すると、データベースが作成されて、KonaWiki が使えるようになります。

KonaWiki

KonaWiki の製作~設計編

アプリケーションのテスト環境が揃って KonaWiki がどんなものか分かったところで、KonaWiki の設計に関して確認しておきます。前回、アイデア出ししたときに、この連載で作るWikiの名前を KonaWiki と決めました。以下、Wikiの開発で肝になりそうな部分を項目ごとに考えてみます。

データベース

KonaWikiでは、Wikiデータの保存にファイルベースで手軽に扱える、SQLite というデータベースを採用することにしました。SQLite は小規模なプロジェクトでの使用に向いています。将来的には、MySQL や PostgreSQL にも対応したいので、ある程度、データベースの処理は、冗長に作っておきます。

Wiki 記法

Wiki の最大の特徴の1つに、Wiki記法というものがあり、「*」から始まる行をタイトルとして強調するとか、「-」から始まる行をリストとして扱うなどの文章を整形する特別なルールがあります。また、はてなが運営するブログサービス「はてなダイアリー」でも、日記を書くのに「はてな記法」というWiki記法を拡張した記法を用いています。このWiki記法はとても便利で一度覚えてしまうと、何でもWiki記法で書きたくなるほどです。

実は、PHP のライブラリに、Text_Wiki というクラスがあり、これを使うと手軽に Wiki 記法を実現できるようです。しかし、今回は、敢えてWiki記法の自作に挑戦してみます。なぜ自作するのかというと、「Wikiパーサーを書くのが一番の楽しみだから」という理由が一番ですが、自分で作ることにより、細かい部分を作りこみたかったという理由と、Wiki記法の仕組みを深く理解できると思ったからです。

テンプレートエンジン

そして、Wikiアプリケーションのデザインを簡単に差し替えられるような仕組みも提供します。PHPには、Smarty というテンプレートエンジンがあります。これを利用すると、高度なテンプレート機能を利用することができます。そのため、テンプレートエンジンに、Smarty を採用しようと思ったのですが、もっと単純な仕組みを採用にしました。というのも、タイトルや本文といった限られた数箇所の置換を行うだけで良さそうなのです。そこで、「[[body]]」とか「[[page_name]]」のように、テンプレートに書いたタグを単純に置換するだけで事足りてしまいそうなのです。すると、テンプレートエンジンを使うほどでもないので、Smartyの採用も見送りました。

まとめ

今回は、ローカルPCにPHPの開発環境を用意して、KonaWiki の未完成版を動かしてみました。

この原稿執筆時点では、複数人で書き込みを行ったときの衝突の検出機能などがないものの、Wikiとしてのページの新規作成や編集などが行えるようになっています。PukiWiki互換のWiki記法を用いて、文章を書き込み、ファイルの添付ができます。

次回以降、Wiki の仕組みについて詳しく見ていきたいと思います。お楽しみに。

Series Navigation«既存 Wiki の紹介どんな技術要素が必要になるのか»

執筆者紹介

クジラ飛行机

クジラ飛行机

くじらはんど(http://kujirahand/)にて、日本語プログラミング言語「なでしこ」(IPA未踏ユース採択)、テキスト音楽「サクラ」(OSPオンラインソフト大賞入賞)など多くのオンラインソフトを開発。著書に「Flexプロフェッショナルガイド」「なでしこ公式バイブル」、「一週間でマスターするActionScript3.0」など。

TrackBack URL :