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许可证许可的开源软件。