建構第一個應用程式¶

緒論¶

本教學旨在向你介紹 CodeIgniter4 框架與 MVC 設計模式的基本原則。它將會向你展示如何逐步建構一個基本的 CodeIgniter 應用程式。

如果你對 PHP 並不熟悉，我們建議你在使用這個教學之前，不妨先查看 W3Schools PHP （簡體中文）教學。

在這個教學中，你將會創建一個 基本的新聞應用程式 。首先會從靜態頁面的程式開始編寫。接著，你將創建從資料庫中讀取新聞內容的程式。最後，你將透過教學創建一個表單頁面，並且透過這個表單你可以在資料庫中創建新聞內容。

本教學將著重於：

模型、視圖與控制器的基本知識。
路由的基本知識。
表單驗證。
使用 CodeIgniter 的「查詢生成器」執行基本的資料庫查詢。

整個教學被切分成了數個條目，每個條目都解釋了一部份的 CodeIgniter 框架功能。你將會瀏覽以下幾個頁面：

緒論（本頁），概述整個教學的內容，並且佈署基本的 CodeIgniter 框架以及運行。
靜態頁面，教導你控制器、視圖與路由的基本知識。
新聞頁面，你將開始使用模型，並執行一些基本的資料庫操作。
建立新聞，開始更深入的資料庫操作，以及表單驗證。
結論，將給你一些進一步閱讀其他資源的指引。

開始享受對 CodeIgniter 的探索吧！

佈署與執行¶

你可以從官方網站手動下載發行版，但在這個教學中，我們推薦你透過 Composer 安裝穩定版框架，請在命令列中使用下列指令：

composer create-project codeigniter4/appstarter ci-news

這將會建立一個新的 ci-blog 資料夾，你的應用程式將會包含在其中， CodeIgniter 將被安裝在 vendor 資料夾。

在預設情況下，CodeIgniter 將以正式模式執行。這是一項安全性功能，它可以讓你的網站在正式上線後更加安全。但在開發的過程中，我們需要一些環境設定，所以先將根目錄下的 env 複製後重新命名成 .env，並且打開它。

這個檔案包含特定於伺服器的設定，這代表著你不需要向版本控制系統提交任何敏感資訊。它包括一些你會需要的常見內容，儘管它們目前是被註解掉的狀態。因此，你首先需要取消 CI_ENVIRONMENT 的註解，並且將 production 替換成 development ：

CI_ENVIRONMENT = development

完成了上述設定，是時候在瀏覽器中查看你的應用程式了。你可以透過你使用的任何伺服器 Apache 或 Nginx 提供服務，但 CodeIgniter 提供一個簡單的指令，利用 PHP 的內建伺服器讓你在開發環境中可以快速啟動且運行。請進入專案根目錄鍵入下列指令：

php spark serve

歡迎頁面¶

現在，將你的瀏覽器指向正確的 URL ，你將可以看到歡迎畫面。請試著在瀏覽器中鍵入以下 URL：

http://localhost:8080

你應該可以看到以下畫面：

這代表你的應用程式正常工作中，你可以開始對它進行修改。

除錯¶

現在，你正處於開發（ development ）模式，你將在應用程式底部看到一個工具列。這個工具列有著許多有用的功能，你可以在開發期間使用這些功能。這個工具列並不會在正式環境中出現。按一下底下的選項卡可以顯示不同功能的資訊，按了工具列右側的 X 將可以把工具列縮小成一個方塊，這個方塊上頭有著 CodeIgniter 的火焰，再按一下工具列就會再次顯示。

除此之外，在開發的過程中如果你的程式出現異常或錯誤時，CodeIgniter 還有一個十分有用的錯誤頁面。打開 app/Controllers/Home.php 文件，並且嘗試更改一些程式碼故意產生錯誤（刪除大括弧或分號），重新整理畫面後你將可以看到以下畫面：

你需要注意幾件事情：

頂部的紅色標題是一個連結，點下去後將會自動打開 Google.com 並替你搜索這個異常。
按一下 Backtrace 中任意的 arguments 鏈結將展開傳遞到該函數，並且呼叫中的引數列表。

當你看到它時，一切會非常明瞭。

現在，我們已經知道如何佈署與如何除錯，讓我們開始建構這個小型應用程式吧！