xamppとはApache、MySQL/MariaDB、PHP、Perlを含むオープンソースのクロスプラットフォームWebサーバーソリューションスタックパッケージです。
つまり、無料で使えて、OSを選ばず、サーバー構築に必要な一通りのソフトをまとめたパッケージです。
これにより、Web開発者はローカルコンピュータで簡単にテスト環境を構築できます。
利点として、すぐに使える状態で提供されるため、インストールや設定が非常に簡単で、各ソフトがすぐに連携して動作します。
目的
xamppを利用してWebサイトを作成し、ラズパイpicoWとセンサで取得したデータをグラフで表示したいと思います。
以下のサイトで古いノートパソコンにUbuntuをインストールして、ApacheやPHPを動作させていますが、普段使いのWindowsPCで簡単に動作確認等をできるようにしたいと思います。
インストール方法
公式サイトからxamppをダウンロードして、インストーラを起動します。
ウィルス対策ソフトがインストールされていると、以下のダイアログが表示されることがあります。
インストールが遅くなる等の干渉が行われる可能性があることの確認です。
「はい」で問題ありませんが、気になるようであればウィルス対策ソフトをオフにするといいでしょう。
ユーザーアカウントコントロール（UAC）が有効になっているため、xamppの一部の機能が制限される可能性があることを警告しています。
「OK」でインストールを継続します。
「Next」で次に進みます。
インストールしたいソフトを選択します。
そのまま「Next」で問題ありません。
xamppのインストール先を入力します。
デフォルトで「Next」で問題ありません。
言語を選択します。
日本語はないのでEnglishで「Next」を押下します。
インストールの準備は完了です。
「Next」でインストールを開始します。
コントロールパネルを開くにチェックを入れて、「Finish」を押下します。
xamppのコントロールパネルを開くときに、Windowsファイアウォールの確認ダイアログが表示されます。
「許可」を選択します。
xamppのコントロールパネルが表示されたらインストール完了です
xamppの設定
Apacheの起動
xamppのコントロールパネルからApacheの「Start」を押下し、Apacheを起動します。
動作確認
ブラウザのURLを入力するところに自分のパソコンのIPアドレス、もしくは「localhost」と入力して、Apacheにアクセスします。
ページが表示されれば成功です。
ファイルの配置
Apacheで公開するWebコンテンツを配置します。
xamppをデフォルトのパスにインストールしていた場合、以下のパスがApacheで公開するWebコンテンツを配置する場所です。
「C:\xampp\htdocs」
ここへ動作を確認したいhtmlファイルやjavascript、PHP等のファイルを配置します。
私は以下のGitで公開しているファイルを配置しました。
以上で設定は完了です。
セキュリティ
XAMPPはローカルでWeb開発環境を簡単にセットアップできる非常に便利なツールですが、セキュリティリスクも伴います。
開発環境向けであるため、初期設定はセキュリティが緩く設定されています。
これにより、インターネットに直接接続されている場合は、攻撃の対象となる可能性があるので注意が必要です。
家庭内のローカルネットワーク等での使用を推奨します。
まとめ
ブラウザの開発者ツールでhtmlやjavascriptのデバッグをしつつ、ミスがあれば簡単に修正を行うことができるようになりました。
修正が完了すれば、teratermなどで本番用のサーバーへアップロードして公開します。
コメント