MAMPが起動中にもかかわらずブラウザ表示が上手くいかないとムズムズしちゃいますよね。。
初心者がこういう状況に陥ってしまう主な原因はズバリ、URLの打ち間違いです。
localhost…から始まるURLにしないと、たとえMAMPを起動していてもブラウザ上にはファイルにあるコードだけが表示されてしまうんですね。
仮に現時点で「なんのこっちゃ?」状態だったとしても大丈夫です◎
このページでは、MAMPを起動してからブラウザ上でWebページを見れるまでの手順をサクッとご紹介します^^
MAMPに緑色のランプが点灯しているかチェックする
アプリケーションの中にあるMAMP(MAMP.appではない)を起動したら、まずランプが正常に点いているかを確認しましょう。
ここで重要なのは、
- Apache Server
- MySQL Server
この2つが緑色になっているかどうかです。
正常であれば、以下のようにランプがグリーンに変わっているはずです。

ここさえスムーズにできたら、後はめっちゃ簡単です^^
Open WebStart pageを開きlocalhostアドレスを確認する
ランプが正常に点いていたら、その下の中心にある「Open WebStart page」をクリックしてください。

すると、以下のようなページが出てきます。

本来であれは、MAMPを起動して、Apache ServerとMySQL Serverが動きはじめると自動で開かれるページですので、すでにブラウザにWelcome to MAMPが見えていたらもう一度開く必要はありません。
ここで注目していただきたいのは、ブラウザ上に出てきたURLアドレスです。

今回はlocalhost…から始まるアドレスになっていますよね。
おそらく、ファイルのコードしか表示されなかったときのアドレスとは違っているはずです。
これはどうしてかというと、
- 緑色のランプが点いたApacheがWebサーバーの役割を果たしている。(Webサイトを動かすにはサーバーが必須。)
- localhostとアドレスに入力することでApacheのwebサーバーにアクセスできた。
…からなんですね。
ちなみに、ファイルの中身のコードしか見えなかった時のアドレスは「ファイルパス」と言って、ファイルの置き場所である位置を表したものになります^^
MY WEBSITEを開き当該ファイルをクリックすれば解決◎
次にMY WEBSITEの部分をクリックします。

すると、以下のようにファイル名が出てきます。

この時点でブラウザ上に表示させたい大元のファイルやフォルダ名が確認できるはずです。
万が一、この段階で当該ファイルを収めたフォルダ名が見当たらない場合、MACの「Finder」→ サイドバーにある「アプリケーション」→「MAMP」→「htdocs」の順に追っていきながら、「htdocs」の中に自分の作成ファイルが収納されているかどうか改めてチェックしてみてください。
MAMPはその特性上、「htdocs」の中に各ファイルを置くことでWebサーバーにファイルを設置したかのように扱ってくれます。
あとは、MY WEBSITEのボタンを押してからクリックを重ねて当該ファイルを開けば大丈夫です。
ここではサンプルとしてhello.phpファイルをブラウザ上で開いてみますね。

はい。アドレスからもわかるように、phpフォルダ → 2-3 → hello.phpと当該ファイルを探した結果、ちゃんとブラウザ上に反映したいWebページを表示できたことがわかりますね。
このように、あなたも表示したいファイルを探してlocalhostから始まるURLを入力するだけで、同じようにWEBサイトページを見れるようになるはずです^^