翻譯進度
79% 已翻譯
更新時間:
2024年6月30日 上午8:27:00 [世界標準時間]
翻譯人員:
  • cornch
幫我們翻譯此頁

入門套件

簡介

為了讓你在撰寫 Laravel 專案時有個好的開始,我們很高興能為你介紹「登入入門套件」與「專案入門套件」。這些套件包含了讓使用者註冊或登入的路由、Controller、與 View,會幫你自動進行 Scaffold。

雖然我們歡迎你使用這些入門套件,不過這些套件並不是必要的。你可以從全新的 Laravel 安裝開始製作自己的專案。無論如何,我們都知道你會做出很棒的東西!

Laravel Breeze

Laravel Breeze 是一個簡單且最小化實作出所有 Laravel 認證功能的套件,包含登入、註冊、密碼重設、電子郵件認證、以及密碼確認。此外,Breeze 中也包含了一個簡單的「個人檔案」頁面,在該頁面中,使用者可以更新其名稱、E-Mail 位址、以及密碼。

Laravel Breeze 的預設 View 層是由 Blade 樣板構成的,並使用 Tailwind CSS。或者,Breeze 也可以使用 Vue 或 React 以及 Inertia 來 Scaffold 你的專案。

對於從頭開始撰寫 Laravel 專案來說,Breeze 提供了一個絕佳的起始點。而且,對於打算通過 Laravel Livewire 來提升 Blade 樣板功能的專案來說,Breeze 也是個不錯的選項。

Laravel Bootcamp

如果你第一次接觸 Laravel,歡迎參考 Laravel Bootcamp (英語)。Laravel Bootcamp 會帶領你使用 Breeze 來建立你的第一個 Laravel 專案。Laravel Bootcamp 是學習各種有關 Laravel 與 Breeze 相關技術的好地方。

安裝

首先,請先建立一個新的 Laravel 專案,設定資料庫,執行資料庫 Migration。建立好新的 Laravel 專案後,可以使用 Composer 來安裝 Laravel Breeze:

1composer require laravel/breeze --dev
1composer require laravel/breeze --dev

安裝好 Breeze 後,就可以使用本文件下方討論的其中一個 Breeze「Stack」來 Scaffold 你的專案。

Breeze 與 Blade

安裝好 Laravel Breeze 套件後,執行 breeze:install Artisan 指令。這個指令會將登入用 View、路由、Controller、以及其他一些資源安裝到專案中。Laravel Breeze 會將其所有程式碼安裝到專案中,因此對於 Breeze 的功能與實作你擁有完整的控制權與可見性。

預設的 Breeze「Stack」是 Blade Stack。Blade Stack 使用了簡單的 Blade 樣板 來轉譯專案的前端。只要不加任何參數地叫用 breeze:install,就可以安裝 Blade Stack。Breeze 的 Scaffolding 安裝好後,就可以編譯專案的前端資源:

1php artisan breeze:install
2 
3php artisan migrate
4npm install
5npm run dev
1php artisan breeze:install
2 
3php artisan migrate
4npm install
5npm run dev

接著,在瀏覽器中打開網站的 /login/register 網址。Breeze 中所有的路由都定義在 routes/auth.php 中。

深色模式

若想在 Scaffold 專案前端時讓 Breeze 包含「深色模式」的支援,只要在執行 breeze:install 指令時加上 --dark 指示詞即可:

1php artisan breeze:install --dark
1php artisan breeze:install --dark
lightbulb

要瞭解更多有關如何編譯網站的 CSS 與 JavaScript 的資訊,請參考 Laravel 的 Vite 說明文件

Breeze & React / Vue

Laravel Breeze 也提供了使用 Inertia 前端實作的 React 與 Vue Scaffolding。使用 Inertia,我們就能使用傳統的 Server-Side Routing 與 Controller 來製作現代、單一頁面的 React 或 Vue 網站。

使用 Inertia,我們就可以享受 React 與 Vue 所提供的強大前端,並搭配使用生產效率高的 Laravel 後端,以及超快速的 Vite 編譯。若要使用 Inertia Stack,請在執行 breeze:install Artisan 指令時將 vuereact 指定為要使用的 Stack。安裝好 Breeze 的 Scaffolding 後,也請編譯專案的前端資源:

1php artisan breeze:install vue
2 
3# 或是...
4 
5php artisan breeze:install react
6 
7php artisan migrate
8npm install
9npm run dev
1php artisan breeze:install vue
2 
3# 或是...
4 
5php artisan breeze:install react
6 
7php artisan migrate
8npm install
9npm run dev

接著,在瀏覽器中打開網站的 /login/register 網址。Breeze 中所有的路由都定義在 routes/auth.php 中。

伺服器端轉譯

若想讓 Breeze 在 Scaffold 時加上對 Inertia SSR 的支援,可在叫用 breeze:install 指令時提供 ssr 選項:

1php artisan breeze:install vue --ssr
2php artisan breeze:install react --ssr
1php artisan breeze:install vue --ssr
2php artisan breeze:install react --ssr

Breeze & Next.js / API

Laravel Breeze can also scaffold an authentication API that is ready to authenticate modern JavaScript applications such as those powered by Next, Nuxt, and others. To get started, specify the api stack as your desired stack when executing the breeze:install Artisan command:

1php artisan breeze:install api
2 
3php artisan migrate
1php artisan breeze:install api
2 
3php artisan migrate

在安裝過程中,Breeze 會在專案的 .env 檔中新增一個 FRONTEND_URL 環境變數。這個 URL 應為 JavaScript App 的 URL。在開發時,通常為 http://localhost:3000。此外,也應確認一下 APP_URL 是否為 http://localhost:8000,該網址就是 serve Artisan 指令的預設 URL。

Next.js 參考實作

最後,我們已經準備好可以將這個後端與你的前端組合起來了。我們在 GitHub 上提供了一個作為 Breeze 前端的 Next 參考實作。這個前端是由 Laravel 維護的,其中包含了與 Breeze 提供的傳統 Blade 與 Inertia Stack 中相同的使用者界面。

Laravel Jetstream

雖然 Laravel Breeze 提供了一個簡單起始點能讓你開始製作 Laravel 專案,但 Jetstream 提供了更多的功能,其中包含了強健的功能與額外的前端技術 Stack。對於剛開始使用 Laravel 的新手,我們建議先了解一下 Laravel Breeze 的使用方式,再來學習 Laravel Jetstream。

Jetstream 為 Laravel 提供了一個設計的很好看的網站 Scaffolding,並包含了登入、註冊、E-Mail 認證、二步驟認證、工作階段管理、通過 Laravel Sanctum 提供的 API 支援、以及一個可選的團隊管理功能。Jetstream 使用 Tailwind CSS 設計,並提供了 LivewireInertia 作為前端 Scaffolding 的選項。

Complete documentation for installing Laravel Jetstream can be found within the official Jetstream documentation.

翻譯進度
79% 已翻譯
更新時間:
2024年6月30日 上午8:27:00 [世界標準時間]
翻譯人員:
  • cornch
幫我們翻譯此頁

留言

尚無留言

“Laravel” is a Trademark of Taylor Otwell.
The source documentation is released under MIT license. See laravel/docs on GitHub for details.
The translated documentations are released under MIT license. See cornch/laravel-docs-l10n on GitHub for details.