laravel react sample appのダウンロード - laravel react sample appソースコードのダウンロード

laravel react sample app

その他のソースコード

2.0

ダウンロード

BigCommerce 用 Laravel React アプリ

これは、カタログ概要ビューとキャンセル可能な注文のリストの 2 つの画面を備えた基本的な BigCommerce アプリで、Laravel と React を使用して構築されています。

これは、アプリのコンセプトを BigCommerce コントロールパネル内で使用できるものに落とし込む能力を迅速に追跡することを目的としています。ライブストアは、ローカルで実行しながらこのアプリをインストールできます。

このアプリを作成するために必要な手順と、BigCommerce でアプリを作成するために必要な手順を説明するチュートリアルは、ここで読むことができます。

前提条件とインストール

始める前に、システム要件が満たされていることを確認してください。

PHP (インストールガイド)
Composer (インストールガイド)
Laravel (インストールガイド)

PHP 開発を容易にし、開発したアプリを簡単に共有できるようにするには、OS に応じて Valet または Homestead を使用します。

ローカル SSL 証明書 (セットアップを容易にするために Valet または Homestead をお勧めします)
- Mac OS: Valet (インストールガイド)
- Windows / Linux: ホームステッド (インストールガイド)

以下の一部の手順では Valet を使用しますが、サイトをホストおよび共有する機能は Valet と Homestead の両方で同様です。このチュートリアルでさらに重要なのは、React を使用して BigCommerce に接続するように Laravel を構成する方法です。

PHP の依存関係をインストールするには:

composer install

JS の依存関係:

npm install

BigCommerce ストアでテストするには、bigcommerce.com で無料トライアルを作成するか、技術パートナーにサインアップして無料のサンドボックスストアをリクエストできます。

Laravel と React を一緒に実行する

ここで、今後の開発のベースラインを作成します。これは、ブラウザの特定の URL でロードされ、デフォルトの Laravel 画面の代わりに React コンポーネントをロードする単純なアプリケーションです。

新しい Laravel コードベースを作成する ~/Sites ディレクトリにアプリの初期ボイラープレートを作成する Laravel コマンドを使用するか、Composer を使用することができます。

composer global require laravel/installer
laravel new laravel-react-bigcommerce-app

または

composer create-project laravel/laravel laravel-react-bigcommerce-app

アプリのアドレスにアクセスして、それがローカルに存在していることを確認します。

上記のコマンドが完了したら、Valet がアプリを安全に提供できるようにディレクトリを設定する必要があります。

 cd laravel-react-bigcommerce-app
valet link
valet secure

これで、ブラウザで次の URL にアクセスすると、デフォルトの Laravel ようこそ画面が表示されるはずです。

https://laravel-react-bigcommerce-app.test

Breeze と Inertia を使用して React を JS フレームワークとしてセットアップする

Larvel Breeze は、認証機能を備えた Laravel アプリケーションを構築するための最小限かつシンプルな開始点を提供します。 Blade と Tailwind を搭載していますが、Inertia を使用して SPA として構成できます。この例では、react を使用してフロントエンドを強化します。

まず、Breeze をインストールしましょう。