2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【環境開発】XAMPP使用して、ローカル環境にlaravelを表示させる。(指定したURLでも可能)

Posted at

1.XAMPPをインストール

今回は、XAMPPインストールされていてサイトが観れる前提で進めていきます。

image.png

2.Composerをインストール

概要

Composerを使用してLaravelをインストールする為に、
公式サイトからをComposerダウンロードしていきます。

手順

以下のリンクにアクセスします。

【公式】Compose
https://getcomposer.org/download/

image.png

Downloadを選択します。

Screenshot_2019-11-11 Composer.png

Composer-Setup.exeをダウンロードします。

01.png
NEXT >を選択します。

01.png
NEXT >を選択します。

01.png
NEXT >を選択します。

01.png
Installを選択します。

image.png
NEXT >を選択します。

image.png
Finishでインストール完了します。

3.Laravelプロジェクトの作成

概要

今回はc:\xampp\htdocslaravelという、プロジェクト名を作成していきます。

手順

コマンドプロンプトを開きc:\xampp\htdocsまで移動する。

コマンドプロンプト
cd c:\xampp\htdocs

Laravelプロジェクトの作成をします。※ 時間が掛かります。
コマンドプロンプト
composer create-project laravel/laravel --prefer-dist laravel

このようなメッセージが表示されれば準備完了です。
コマンドプロンプト
Installing laravel/laravel (v6.4.0)
  - Installing laravel/laravel (v6.4.0): Downloading (100%)
Created project in projectName

~ 割愛 ~

Package manifest generated successfully.
> @php artisan key:generate --ansi
Application key set successfully.

作成したプロジェクト(laravel)のファイルまで移動して、接続テストをしてみます。 ※ xamppが、``C:`` 直下にインストールされていることが前提です。
コマンドプロンプト
cd projectName
php -S localhost:8000 -t public

``Press Ctrl-C to quit.``が表示されていればOK! ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/197404/d75621ad-e509-338d-0b0e-d4f33d2e5840.png)

http://localhost:8000 に接続してみて、画像と同じ画面が出ていれば接続テスト完了!

image.png

Ctrl+C で接続を終了させます。

XAMPPの設定変更

概要

【URLの変更】
現状: http://localhost/laravel/public/ でTOPが表示される。

変更後:http://localhosthttp://example.com でTOPを表示させる。
※「example.com」はURLの変更も可能です。

手順

URLが表示されるか確認する。
http://localhost/laravel/public/


``C:\xampp\apache\conf\extra\httpd-vhosts.conf`` を開きます。

NameVirtualHost のコメントアウトを外し、以下のコードを追加して保存する。

※ アクセス権を与えなけれ403エラーとなるので注意

httpd-vhosts.conf
NameVirtualHost *:80

###############
# localhost
##
# フォルダパスとドメイン名の設定
<VirtualHost localhost:80>
  DocumentRoot "C:/xampp/htdocs/laravel/public"
  ServerName localhost

  # アクセス権付与
  <Directory "C:/xampp/htdocs/laravel/public">
    AllowOverride All
    Options All
    Require all granted
  </Directory>
</VirtualHost>



###############
# example.com
##
# フォルダパスとドメイン名の設定
<VirtualHost example.com:80>
  DocumentRoot "C:/xampp/htdocs/laravel/public"
  ServerName example.com

  # アクセス権付与
  <Directory "C:/xampp/htdocs/laravel/public">
    AllowOverride All
    Options All
    Require all granted
  </Directory>
</VirtualHost>

image.png


次に、host設定をしていきます。 ``C:\Windows\XXXXXXXX\drivers\etc``にあるhostを開き、以下のコードを追加して保存する。 ※ 「XXXXXXXX」はユーザーです。
host
127.0.0.1       localhost
127.0.0.1       example.com

image.png

XAMPPでApacheを再起動させ、URLに接続して出来たら設定完了!!
http://localhost/
http://example.com/

お疲れ様でした:clap_tone1::clap_tone1:

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?