PHPを使用して、アプリを開発するには、XAMPP(ザンプ)をインストールし、PHPとMySQL環境を構築する必要があります。
この記事では、XAMPPを利用して、PHPとMySQLの環境構築を行い、アプリを立ち上げまでご紹介できたらなと思います!
ぜひ最後までご覧ください!
①XAMPPとは
XAMPPとは、アプリ開発をローカル環境に構築することができたり、開発に必要なツールを一括でインストールすることができたりする有能なパッケージです。
主なメリットとしては、
・初心者でも簡単にアプリ開発環境を構築することできる
・AWSやAzureといったクラウドサーバーにもインストールできる
などが挙げられます!
XAMPPの主な特徴について、簡単にご紹介しますね!
クロスプラットフォームに対応
XAMPPの「X」とは、「クロスプラットフォーム」のことを意味し、
・Windows
・Mac
・Linux
など、多くのOSに対応し、同じように環境構築を行うことができます。
それぞれのOSでインストールするモジュールが異なるので、それは後にご説明しますね!
Apache
XAMPPの「A」とは、最も一般的で広く使われているオープンソースのWebサーバーソフトウェアである「Apache」のことを意味しています。
Apache HTTP Server(通常は単にApacheと呼ばれます)は、1995年にリリースされ、その後も世界中の多くのウェブサイトで使用されています。
Apacheは、セキュリティ機能、ドキュメントとコミュニティサポートが豊富といったメリットあり、信頼性や柔軟性の高いことが主な特徴です。
Maria DB(MySQL)
XAMPPの「M」とは、人気なデータベースシステムの「Maria DB」を意味しています。
MariaDBは、MySQLの互換性を持つオープンソースのリレーショナルデータベース管理システム(RDBMS)です。MySQLの元々の開発者であるMichael “Monty” Widenius(マイケル・モンティ・ウィデニウス)によって開発され、MySQLのコードベースから派生しています。
今回は実際に、世界でも人気のあるMySQLを使用できるように環境構築を行うので、使用できるようになると他のアプリケーションの開発でも活かすことができます!
PHP
XAMPPの「P」とは、アプリ開発に使用される「PHP」と「Perl」を意味しています。
PHP(PHP: Hypertext Preprocessor)は、主にウェブ開発に使用されるスクリプト言語であり、HTMLに埋め込むことで、動的サイトの開発に役立ちます。PHPは、1994年にラスムス・レルドルフによって開発され、その後急速に広まり、現在も広く使用されている言語です。
Perl(Practical Extraction and Reporting Language)は、テキスト処理やシステム管理などの用途に適したスクリプト言語です。ラリー・ウォールによって開発され、初期のUNIX環境で広く使用されました。Perlは、強力な文字列操作機能や正規表現、データ処理の機能を備えており、ウェブ開発やシステム管理、テキスト処理などの多岐にわたる用途で利用されます。
②XAMPPのインストール
実際にXAMPPをインストールして、環境を構築しましょう!
下記のリンクからXAMPPの公式ページにいってください!
OSを選択してインストール
ここで使用されているOSを選択して、下記からダウンロードしましょう
↓
クリックして、開きます
下記のエラーが表示された方は、「Eject Disk Image」を選択して、設定を開いてください!
「Open Anyway」を選択して、再度ダウンロードしたファイルを開いてみましょう!
Passwordを入力して、Unlockすれば、開くと思います!
↓
「Next」を選択
↓
「Next」を選択
↓
「Next」を選択
↓
「Next」を選択
これでXAMPのインストールは、完了です!
③VSCodeのインストール
VSCode(Visual Studio Code)は、Microsoftが開発した無料で使用できるコードエディターです。主にアプリケーションの開発やプログラミング学習など、は幅広い画面で使用されます。
VSCodeは軽量で高速な動作を特徴とし、豊富な拡張機能やカスタマイズ可能な設定を提供しているため、PHP以外にも、さまざまなプログラミング言語やフレームワークに対応しています。
VSCodeは、Windows、macOS、Linuxなどのさまざまなプラットフォームで利用可能であり、自分の好みや作業に適した環境を構築できます。
VSCodeのURL
実際にVSCodeをインストールして、環境を構築しましょう!
下記のリンクからVSCodeの公式ページにいってください!
インストールが完了したら、アプリケーションを起動して、この画面が表示されたらインストール完了です!
④htdocsでプロジェクトを作成
XAMPPのhtdocsディレクトリ(通常はXAMPPのインストールディレクトリ内にある)は、ローカルサーバーに配置されたウェブサイトやアプリケーションのファイルを格納する場所になります!
これにより、開発する側はローカルでウェブサイトやアプリケーションを開発し、実際にブラウザで確認することができます。htdocsディレクトリ内のファイルは、Apacheサーバーによって配信されるため、開発者が作成したウェブページやアプリケーションは、ブラウザからアクセス可能となります。
XAMPPの保管場所を開く
②でインストールしたXAMPアプリケーションを起動し、「Open Application Folder」をクリックします。
(WindowsとLinuxは、表示形式が異なるので、似たような部分を探してみてください)
htdocsフォルダーを開く
XAMPPの保管場所を開いたら、htdocsフォルダーを選択して、オープンします。
↓
ここで実際にファイルを追加して、アプリ開発を行えます!
(個人で追加したフォルダがありますが、それは無視してください)
新規プロジェクトファイルの作成
上記のhtdocs内に、アプリ開発用の新規ファイルを追加しましょう!
私は「SampleApp」として、追加します。
⑤ローカルサーバーを開いてみる
ローカルサーバーは、自分のコンピュータ上でウェブアプリ開発を行うための仮想的なサーバーです。インターネットに接続されていなくても使用することができるのが特徴です。
ローカルサーバーを使うと、実際のウェブサービスと同じように開発を進めることができ、インターネット上に公開されることがありません。
そのため、プライバシーやセキュリティの心配がなく、自由に実験やテストを行うことができます。
プロジェクトをVSCodeで開く
④でhtdocsに作成した新規プロジェクトファイルを、VSCodeで実際に開いてみましょう!
htdocsのプロジェクトファイルを、VSCodeへドラッグ&ドロップをすることで、簡単に開けます!
(VSCodeの[ File -> Open Folder] から開いても問題ありません)
↓
作成したSampleAppが、VSCodeに追加されました
Apacheサーバーを起動
②でインストールしたXAMPのmanager-osx.appを起動し、「Apache Web Server」をStartします
(インストール直後であれば、開いていると思います)
起動していない方は、こちらから開いてください
PHPファイルを追加して、ブラウザを開く
VSCode上で、プロジェクトファイルの中に、「index.php」のファイルを追加しましょう
コードは、なんでも大丈夫ですが、簡単なサンプルとして、貼り付けておきますね!
<h1>SampleApp</h1>
<h2>Sample</h2>
<h3>App</h3>
index.phpファイルを追加できたら、ブラウザを開いてサーバーのセットアップは完了です!
http://localhost:80/sampleapp/
上記URLで開かない方は、Apache Web Server -> Configure のPort番号を確認し、置き換えてから、URLに貼り付けてください!(デフォルトは8080だったような気がします…)
まとめ
XAMPPを使用することで、手軽にローカル環境を構築し、開発をスムーズに行うことができますが、
PHPとMySQLの開発環境を構築した今回の手順は、ウェブ開発者として、重要なスキルの1つとなります。
この記事では、XAMPPのインストールからApacheを使用して、ブラウザの起動、PHPファイルの配置をご紹介しました。今後は、MySQLの環境構築やアプリ開発についても紹介していきますので、ぜひ興味がある方は参考にしてみてください!
インスタやXで、質問にも対応しますので、気軽にご連絡ください!
コメント