【Webアプリ製作入門③】 XAMPPをインストールしてみよう! 【スクショあり】

XAMPPをインストールしてみよう IT関連

これまで、「PHPについて」→「実行するための環境について」→「XAMPPについて」の順に学んできました。

この記事では、実際にXAMPPをインストールしてみます!

前提条件

今回XAMPPをインストールした、PCの条件です。

  • OS: Windows10
  • プロセッサ: Intel Corei5
  • メモリ: 8GB
  • SSD: 256GB(インストール当時の空容量は125GBほど)

スクリーンショットも添付しています。

Macでも同様に可能ですので、置き換えてやってみてください。

XAMPPをダウンロードする

以下のリンクからダウンロードします。

XAMPP Installers and Downloads for Apache Friends
XAMPP is an easy to install Apache distribution containing MariaDB, PHP and Perl.

※今回は、バージョン「8.0.6」です。

XAMPPダウンロードページ

インストーラを起動する

インストーラとは
ソフトをPCに導入・起動できるようにする(インストール)プログラムのこと。
導入する作業のことを「インストール」や「セットアップ」とも呼びます。

ダウンロードフォルダを開くと、先ほどダウンロードしたパッケージがあります。

「xampp-windows-x64-8.0.6-0-VS16-installer.exe」というやつです。

XAMPPのインストーラ格納場所確認

それをダブルクリックすると、「このアプリがデバイスに変更を加えることを許可しますか?」といったダイアログが表示されます。

「はい」を選択すると、インストーラが起動します。

XAMPPインストール時の警告

なんかよく分からないダイアログが出ますが、OKにしておきましょう。

インストーラを使って、インストールする

「Next」を押下します。

XAMPPインストール手順1

次は、インストールするコンポーネントを選択します。

XAMPPインストール手順2

不要なものはチェックを外しましょう。今回は、以下のようにしました。

XAMPPインストール手順3

インストール先を指定します。

(※下のスクショはCドライブ配下を指しています)

XAMPPインストール手順4

今回はユーザ配下に 「.xampp」 というフォルダを作成し、そこを指定しました。

XAMPPインストール手順5

言語を指定します。Englishにします。残念ながら日本語はないです。

XAMPPインストール手順6

次は広告が表示されます。Bitnamiを使うと簡単にWordpressが入れられるよ!と言っているようです。

「Learn more Bitnami for XAMPP」のチェックを外して「Next」を押します。

チェックを入れたままにしていると、Webページに遷移します。

今回必要ないのでチェックを外しておきましょう。

※ついてても別に問題ないです。

XAMPPインストール手順7

「Ready to Install」と表示されたら、インストールの準備ができたことを示します。

「Next」を押しましょう。

XAMPPインストール手順8

待ちます。

XAMPPインストール手順9

インストールが完了しました!

XAMPPインストール手順10

「今すぐコントロールパネルを起動しますか?」というところは、チェックマークをつけておきましょう。

「Finish」を押下すると、さっそくXAMPPが起動します!

XAMPPのコントロールパネル

こちらがXAMPPのコントロールパネルです。

XAMPPインストール手順11

【お試し】ApacheとMySQLを起動

「START」を押下するだけです!

アクセス許可を求められるダイアログが表示される場合がありますが、「はい」にしておいてOKです。

XAMPPインストール手順12

以下のいずれかのURLに、ブラウザでアクセスしてみましょう。

  • https://localhost/xampp/
  • https://127.0.0.1

ダッシュボードが表示されました。

XAMPPインストール手順13

これで一旦OKです。

お疲れ様でした!

次に進むための下準備

次に「知っておくべきこと」「やっておくべきこと」をまとめました。

  • xampp-control.exe がコントロールパネルです。
  • タスクバーに固定しておきましょう。
    • 次回以降の起動が簡単になります。
  • コントロールパネルの右側にある「Explorer」を押すと、XAMPPディレクトリを開くことができます。
    • 「Quit」を押下すると、XAMPPそのものがタスクを終了します。
    • 「×」を押しても、Apacheなどは起動しています。注意しましょう!

最後に

次は、XAMPP内のファイルを詳しく見ていきます!

【Webアプリ製作入門④】 XAMPP の中身について学ぼう!
開発環境を簡単に構築できる、XAMPPのことを詳しく学習してみましょう!
タイトルとURLをコピーしました