breeze next

Laravel Breeze -Next.js Edition▲

介紹

該存儲庫是Next.js中的Laravel Breeze應用程序 /身份驗證啟動套件Frontend的實現。所有身份驗證的樣板已經為您編寫 - 由Laravel Sanctum提供動力，使您可以快速開始將美麗的Next.js Frontend與強大的Laravel後端配對。

官方文件

安裝

首先，通過將Laravel Breeze安裝到新鮮的Laravel應用程序中並安裝Breeze的API腳手架來創建Next.js兼容Laravel後端：

 # Create the Laravel application...
laravel new next-backend

cd next-backend

# Install Breeze and dependencies...
composer require laravel/breeze --dev

php artisan breeze:install api

# Run database migrations...
php artisan migrate

接下來，確保您的應用程序的APP_URL和FRONTEND_URL環境變量分別設置為http://localhost:8000和http://localhost:3000 。

定義適當的環境變量後，您可以使用serve工匠命令使用Laravel應用程序：

 # Serve the application...
php artisan serve

接下來，克隆此存儲庫，並使用yarn install或npm install安裝其依賴項。然後，將.env.example文件複製到.env.local並提供後端的URL：

 NEXT_PUBLIC_BACKEND_URL=http://localhost:8000

最後，通過npm run dev運行應用程序。該應用程序將在http://localhost:3000 ：

 npm run dev

注意：目前，我們建議在您的後端和前端的本地開發過程中使用localhost ，以避免CORS“相同原產”問題。

身份驗證鉤

此Next.js應用程序包含一個自定義useAuth React Hook，旨在將所有身份驗證邏輯從頁面中抽像出來。此外，該掛鉤可用於訪問當前身份驗證的用戶：

 const ExamplePage = ( ) => {
    const { logout , user } = useAuth ( { middleware : 'auth' } )

    return (
        < >
            < p > { user ?. name } </ p >

            < button onClick = { logout } > Sign out </ button >
        </ >
    )
}

export default ExamplePage

注意：當訪問用戶對像上的屬性以說明Next.js的初始服務器端渲染時，您將需要使用可選的鏈接（ user?.name而不是user.name名稱）。

命名路線

為了方便起見，Ziggy可用於從您的React應用程序中引用您的Laravel應用程序的名為Route URL。

貢獻

感謝您考慮接下來為微風做出貢獻！可以在Laravel文檔中找到貢獻指南。

行為守則

為了確保Laravel社區歡迎所有人，請審查並遵守《行為準則》。

安全漏洞

請查看我們有關如何報告安全漏洞的安全政策。

執照

Laravel Breeze Next是根據MIT許可證許可的開源軟件。