Laravel 11 に Trix Editor をインストールして使用する方法

この記事では、Laravel 11 アプリケーションに Trix エディターをインストールして使用し、画像アップロード機能を実装する方法を説明します。

Trix エディターは、Basecamp によって開発された軽量のリッチ テキスト エディターです。シンプルで使いやすく、ユーザーに複雑さを感じさせることなく、太字、斜体、リンク、リストなどの基本的なテキスト書式設定機能を提供します。最新の Web テクノロジーに基づいて構築されており、Web アプリケーションとシームレスに統合され、コンテンツを作成および編集するためのシンプルで直感的なインターフェイスを提供します。 Laravel 11 チュートリアルで CKeditor を使用して画像をアップロードする方法 も参照してください。

この例では、画像アップロード機能を含む単純な Trix エディタを作成し、画像をローカル ストレージに保存します。画像をアップロードするためのPOSTルートを含む3つのルートを設定します。ユーザーが画像を選択して送信すると、その画像は「メディア」フォルダーに保存されます。

ステップ 1: Laravel 11 をインストールする

まず、新しく始めるので、次のコマンドを使用して新しい Laravel 11 アプリケーションを作成する必要があります。ターミナルまたはコマンド プロンプトを開き、次のコマンドを実行します:

<code>composer create-project laravel/laravel example-app</code>

ステップ 2: ルートを作成する

このステップでは、3 つの GET メソッド ルートと POST メソッド ルートを routes/web.php ファイルに追加します。コードは次のとおりです:

routes/web.php

<code class="language-php"><?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\TrixController;

Route::get('trix', [TrixController::class, 'index']);
Route::post('trix/upload', [TrixController::class, 'upload'])->name('trix.upload');
Route::post('trix/store', [TrixController::class, 'store'])->name('trix.store');</code>

ステップ 3: コントローラーを作成する

この手順では、TrixController メソッドと index() メソッドを含む update() という名前の新しいコントローラーを作成する必要があります。

画像はこのフォルダーに保存されるため、パブリック ディレクトリにメディア フォルダーを作成していることを確認してください。

詳細については、完全なチュートリアルを参照してください。

以上がLaravel 11 に Trix Editor をインストールして使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。