5
5

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 3 years have passed since last update.

Vagantを使ってLaravelを動かす

Posted at

はじめに

初学者が最初に躓きやすいと言われる環境構築ですが手順をしっかり追い、そこで何が行われているを簡単にイメージすることが大事だと痛感しました。
そこで私的メモ程度に構築手順を書き記します。
あくまで私の環境ではこの手順で動くものであって、全員がこれで動くとは限らないので参考程度でお願いいたします。
また初学者であるがゆえに問題点があるかと思います。修正箇所やご指摘いただけると幸いでございます。

この記事でやること

  1. vagarantを使ってcentOS環境の構築。
  2. その環境下でPHP、Laravel、MySQLを導入。
  3. Nginxを立ち上げ、プロジェクトにログイン機能を実装する。

今回使うもの

  • Vagrant
  • vbguest
  • CentOS7
  • Nginx
  • PHP7.3
  • Laravel6.x
  • MySQL5.7

上記に接続できる環境があることを前提に手順を追っていきます。

環境を構築してゆく

作業ディレクトリの準備

まずは仮想環境に接続できる作業スペースを作成していきます。

ターミナル上でLinuxコマンドで作業ディレクトリを作成します。

今回は仮にvagrant_lessonとします。

mkdir vagrant_lesson cd vagrant_lesson

ディレクトリ移動後に使用するboxを指定してあげましょう。

今回はcentOS7を使用します。

vagrant init centos/7

# 実行後以下のようになれば成功
A `Vagrantfile` has been placed in this directory. You are now
ready to `vagrant up` your first virtual environment! Please read
the comments in the Vagrantfile as well as documentation on
`vagrantup.com` for more information on using Vagrant.

vagrantfileの編集

vagrant_lessonのVagrantfileをエディタで開き、以下記述に変更します。

1 コメントアウトを外す

config.vm.network "forwarded_port", guest: 80, host: 8080
# 今回ip番号は以下を使用します
config.vm.network "private_network", ip: "192.168.33.15"

2 記述を適当な箇所に追加

config.vm.synced_folder "./", "/vagrant", type:"virtualbox"

vagrantの起動

# Vagrantfileがあるディレクトリにて以下コマンドの実行
vagrant up

macbook air だとここあたりからpcがうなりだすかもしれませんがゆっくり見守ってあげましょう。
ちなみに起動や停止などのコマンドはこちらを参考
【まとめ】Vagrant コマンド一覧

仮想環境に接続する

ssh接続で環境に接続します。

今回作業するディレクトリ内で以下コマンドを実行するだけです。

vagrant ssh

# 実行後以下のようになれば成功
[vagrant@localhost ~]$

パッケージの導入

開発を使用する上で必要なパッケージをインストールします。

仮想環境につながった状態で以下コマンドを実行します。

[vagrant@localhost ~]$ sudo yum -y groupinstall "development tools"

これで作業するディレクトリの下準備が完了しました。

続いて実際に環境構築していきます。

環境構築~導入編~

このセクションでは環境構築に必要なものを仮想環境にインストールしていきます。

PHP7.3の導入

centOSのデフォルトのPHPのバージョンは5.4.16です。
一方で今回使用するPHPのバージョン7.3なので、それがインストール出来るようにcentOSの設定を変更します。

変更といってもコマンドを入力するだけです。

# EPELのリポジトリを追加
sudo yum -y install epel-release wget

# インストール先を最新の状態に更新します
sudo wget http://rpms.famillecollet.com/enterprise/remi-release-7.rpm

# REMIのリポジトリを追加
sudo rpm -Uvh remi-release-7.rpm

# php7.3をインストール
sudo yum -y install --enablerepo=remi-php73 php php-pdo php-mysqlnd php-mbstring php-xml php-fpm php-common php-devel

# バージョン確認
php -v
# バージョンが7.3.x であれば成功

composerの導入

次にLaravelとそれに必要なcomposerをインストールしていきます。

まずはcomposerを導入します。

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"

php composer-setup.php

php -r "unlink('composer-setup.php');"

# グローバルコマンドを使用するためにfileを移動
sudo mv composer.phar /usr/local/bin/composer

# バージョン確認
composer -v

バージョンが確認できれば成功です。

Laravel6.xの導入

ではLaravelのバージョン6.xを導入していきます。

準備としてLaravelを導入するディレクトリに移動しましょう。

# 移動して
cd /vagrant

# Laravel6.0をインストール
composer create-project laravel/laravel=6.0 --prefer-dist laravel_sample

# 移動して
cd laravel_sample/

# バージョン確認
php artisan --version

# 6.xになっていれば成功です。

Nginxの導入

最新のバージョンをインストールするため以下コマンドでファイルを編集します。

sudo vi /etc/yum.repos.d/nginx.repo

下記内容を追記します。

[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/mainline/centos/\$releasever/\$basearch/
gpgcheck=0
enabled=1

入力方法は
iでインサートモードにし、編集後escでインサートを終了し:wqで保存&終了します。

間違ってしまったら:q!しましょう。

ではインストールしましょう。

# laravel_sampleでコマンド実行
sudo yum install -y nginx

# バージョン確認
nginx -v

インストール成功したらNginxを起動してみましょう。

起動コマンドは以下のとおりです。

sudo systemctl start nginx

Nginxのwelcome画面が表示されれば成功です。

環境構築~Laravel表示編~

では、今表示されているNginxの画面からLaravelのホーム画面になるように設定していきます。

Nginxの設定ファイルを編集します。

sudo vi /etc/nginx/conf.d/default.conf
server {
  listen       80;
  server_name  192.168.33.15; # Vagranfileでコメントを外した箇所のipアドレスを記述してください
  root /vagrant/laravel_sample/public; # 追記
  index  index.html index.htm index.php; # 追記

  #charset koi8-r;
  #access_log  /var/log/nginx/host.access.log  main;

  location / {
      #root   /usr/share/nginx/html; # コメントアウト
      #index  index.html index.htm;  # コメントアウト
      try_files $uri $uri/ /index.php$is_args$args;  # 追記
  }

  # 省略

  # 以下の該当箇所のコメントアウトを指定の箇所外し、変更する場所もあるので変更を加える
  location ~ \.php$ {
  #    root           html;
      fastcgi_pass   127.0.0.1:9000;
      fastcgi_index  index.php;
      fastcgi_param  SCRIPT_FILENAME  /$document_root/$fastcgi_script_name;  # $fastcgi_script_name以前を /$document_root/に変更
      include        fastcgi_params;
  }

続いてphpインストール時にインストールしたphp-fpmの設定fileを編集していきます。

sudo vi /etc/php-fpm.d/www.conf
;24行目近辺
user = apache
↓ 変更
user = vagrant

group = apache
↓ 変更
group = vagrant

編集が完了したらNginxを再起動してphp-fpmを起動しましょう。

# Nginx再起動
sudo systemctl restart nginx

# php-fpm起動
sudo systemctl start php-fpm

Forbidden という403エラーが出た場合

sudo vi /etc/selinux/config

この記述を変更してくだい。

# 変更前
SELINUX=enforcing

# 変更後
SELINUX=disabled

保存を反映させるためにvagrantを再起動しましょう

exit #ログアウト

vagrant reload #再起動

再起動後、ssh接続しましょう。

vagrant ssh

接続が完了したらNginxを再起動してphp-fpmを起動しましょう。

# Nginx再起動
sudo systemctl restart nginx

# php-fpm起動
sudo systemctl start php-fpm

Laravelのhomeが表示されたらエラ−解決です。

環境構築~DBに接続編~

mysqlの導入

rpmにリポジトリを追加しインストールします。

sudo wget http://dev.mysql.com/get/mysql57-community-release-el7-7.noarch.rpm

sudo rpm -Uvh mysql57-community-release-el7-7.noarch.rpm

# インストール
sudo yum install -y mysql-community-server

# バージョン確認
mysql --version

#バージョンが確認できたら成功です

mysqlに接続

sudo systemctl start mysqld

sudo cat /var/log/mysqld.log | grep 'temporary password'

#以下表示される。文末がパスになるのでコピーする
2017-01-01T00:00:00.000000Z 1 [Note] A temporary password is generated for root@localhost: ********

mysql -u root -p

#パスワードが求められるので先程コピーしたものを入力
Enter password: ********

接続後パスワードを変えます。

-- パスワードはダブルクオーテーションで囲む
mysql > set password = "新たなpassword(必ず大文字小文字の英数字 + 記号かつ8文字以上)";

DBを作成

最後に実際に使用するDBを作成しましょう。

mysql > create database DBの名前;

-- 以下表記で成功
Query OK, 1 row affected (0.00 sec)

作成したプロジェクトに登録・ログイン機能を実装してゆく

仮想環境に繋いだまま、作成したlaravel_sampleに移動しましょう。

移動後、以下コマンドを実行するだけでLaravelホーム画面に登録機能とログイン機能が実装できます。

composer require laravel/ui 1.*

php artisan ui vue --auth

# 以下が表示されれば成功
Vue scaffolding installed successfully.
Please run "npm install && npm run dev" to compile your fresh scaffolding.
Authentication scaffolding generated successfully.

先程設定したhttp://192.168.33.15/を開きし、右上にregisterとloginの項目があれば成功です。

さいごに

環境構築と言われ難しいイメージを感じたかもしれませんが、何がどの役割を持っているかイメージできれば割と理解しやすいかと思います。
ただ私も6割程度の理解ですのでこれからこの辺りの知識は深める必要があると感じました。

参考サイト

5
5
2

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
5
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?