6
8

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.

Laravel+Reactのセットアップメモ

Posted at

以下、composerがインストールされていることが前提になります。

セットアップ

プロジェクト作成

composer create-project --prefer-dist laravel/laravel $project_name

プロジェクトフォルダへ移動

cd $project_name

react環境のセットアップ

php artisan preset react
npm install && npm run dev

以上でlaravel+react環境のセットアップ完了

動作確認

開発サーバ起動

php artisan serve

http://localhost:8000にアクセスして、laravelの動作を確認

React環境の動作確認

/resources/views/welcome.blade.phpのbodyの中身を以下のように書き換えて、再度http://localhost:8000にアクセスすると、ビルド元の/resources/assets/js/components/Example.jsの内容が表示されるはず。

<body>
        <div id="example"></div>
        <script src="{{mix('js/app.js')}}" ></script>
</body>

ファイル監視の起動

npm run watch

これで/resources/assets/js/components/Example.jsをいじると自動ビルドされるはずなので、再度http://localhost:8000にアクセスすれば、変更が適用されるはずです。

参考ページ

PHPフレームワーク「Laravel」を使ってReactデビューしてみよう!
Laravel 5.7 インストール

6
8
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
6
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?