在上一篇[教學] CodeIgniter 4 快速上手 (ㄧ) 下載與安裝裡有提到，CodeIgniter 4 是採用PHP7重寫整個架構，根據測試PHP7的執行效率，PHP7是PHP5至少兩倍快，這是許多PHP開源系統所以公開的訊息，而CodeIgniter是一個輕量級的PHP框架，意思是簡單易上手，而且說明書也算簡單易懂。雖然說CodeIgniter是一個輕量級PHP框架，內建function與功能當然沒有Laravel來得多，但Laravel最令人詬病就是他不夠輕巧、檔案過多，如果你只是需要一些常見功能與MVC架構做前後端分離，那CodeIgniter絕對會是你的首選。
所以CodeIgniter對我來說就像瑞士刀一樣，你需要的基本功能CodeIgniter都有，本篇我們就來試試程式設計的基本4大功能，也就是新增(create)、刪除(delete)、查詢(read，也譯作讀取)、修改(Update)，中文簡稱增刪查改，英文簡稱為CRUD，而一次可以練習到這四項功能的部分就是最新消息這個常見功能了！為了避免篇幅過長，本篇就以最簡單的純文字最新消息作為一個基本練習，為了篇幅過長，這一篇我們先來講解新增create功能吧！
Step1. 基本開發環境建置
架設基本CodeIgniter 4基本環境，詳細步驟請參考上一篇[教學] CodeIgniter 4 快速上手 (ㄧ) 下載與安裝
Step2. 新增MVC的V
在專案根目錄/app/view 裡面新增一頁list.php，貼上以下HTML Code
<!DOCTYPE html>
<html lang="zh-Hant-TW">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>News List</title>
<style>
body{
margin: 0 auto;
padding: 0;
text-align: center;
}
ul{
width: 50%;
margin: 0 auto;
padding-inline-start: 0px;
}
li{
list-style: none;
border:#333 1px solid;
margin: 10px 0;
}
hr{
border: none;
border-top: #666 1px solid;
}
@media (max-width:750px){
ul{
width: 90%;
}
}
</style>
</head>
<body>
<h1>News List</h1>
<a href="#">Add News</a>
<ul>
<li>
<h3>News title</h3>
<p>News content</p>
<hr/>
<p>
<span>2021-05-03 00:00:00</span>
<a href="#">Update</a> /
<a href="#">Delete</a>
</p>
</li>
</ul>
</body>
</html>再同樣的資料夾位置再新增一頁form.php 貼上以下HTML Code
<!DOCTYPE html>
<html lang="zh-Hant-TW">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Add News</title>
<style>
form{
display: flex;
flex-direction:column;
width: 50%;
margin: 0 auto;
}
@media (max-width:750px){
form{
width: 90%;
}
}
input,textarea{
margin: 10px 0;
font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
}
input[type='submit']{
background: cornflowerblue;
border: #333 1px solid;
padding: 10px;
}
input[type='submit']:hover{
background-color: deepskyblue;
}
</style>
</head>
<body>
<form action="" method="post">
<label for="title">title:</label>
<input type="text" name="title">
<label for="content">content:</label>
<textarea name="content" id="" cols="30" rows="10"></textarea>
<input type="submit" value="submit">
</form>
</body>
</html>以上的list.php 為本次最新消息的列表頁，而form.php 則為本次負責新增最新消息的表單頁。我已經有做好一個很基本的前台頁面畫面，包含一個非常簡單的RWD，建議採用Chrome瀏覽器瀏覽，讓你可以專心在學習CodeIgniter上，因為CodeIgniter採用MVC架構，即Model、View、Controller 分離式架構，所以這兩頁前台的靜態頁就隸屬於View的範疇，故需要放在app/view 之下。
Step3. Mysql或MariaDB資料庫
為了可以讓你專注在CodeIgniter學習上，我們先把資料庫處理好，所以麻煩你開啟你的資料庫管理介面，通常是使用 phpmyadmin，你可以使用你熟悉的界面。
建立一個新資料庫，取名news（或你喜歡的名字），編碼採用utf8mb4_general_ci，然後按下新增。新增完資料庫之後我們需要接著新增資料表，資料表的命名也可以叫做news（或你喜歡的名字），欄位數為5欄，第一欄為id int(11)並勾選AUTO_INCREMENT(A_I)，主要放置文章編號，採用數字最多11碼，勾選AUTO_INCREMENT會自動以流水號方式產生，並且記得將id設定成主鍵。第二欄為title varchar(255) ，放置文章標題，採用變動型字元串最多255個字元。第三欄是content text，為放置文章內容之欄位採用純文字欄位。第四欄是insertTime datetime，設定CURRENT_TIMESTAMP，放置文章建立的年月日時分秒。第五欄是update-time datetime，設定CURRENT_TIMESTAMP，放置更新文章的年月日時分秒。如果你採用phpmyadmin，那你設定的方式會與下圖相同，然後既然按下右下角的Save。
如果你在這裡儲存遇到問題，可以先取消第一欄為id int(11)的AUTO_INCREMENT(A_I)的勾選，先儲存並將id int(11) 設定爲主鍵之後在回來設定id int(11)的AUTO_INCREMENT(A_I)的勾選。
如果你真的對sql設定有很大的困擾，在phpmyadmin後台找到sql指令頁，然後透過複製以下sql指令到sql指令頁上執行，可以幫助你暫時跳過這一個環節。
CREATE TABLE `news` (
`id` int(11) UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,
`title` varchar(255) NOT NULL,
`content` text NOT NULL,
`insertTime` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP,
`updateTime` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;Step4. 設定連接資料庫
連接資料庫設定請打開app/datebase.php，填上資料庫的hostname、username、password與database。hostname通常都是localhost，而username與password通常本機環境預設值都是root，或是username是root但密碼保留空白，而database就是指資料庫名稱，這裡請填上news 或你剛剛設定的資料庫名稱。請注意，這裡是填寫資料庫名稱，而不是資料表名稱喔！
Step5. 建立MVC的C，create的部分
前往app/Controllers，打開Home.php複製裡面的程式碼，接著在app/Controllers資料夾中新增一頁News.php，貼上剛剛複製的程式碼，然後將第五行的Home改成News後儲存。請注意，這裡的檔名與function名稱的News的N一定要大寫，也就是首字要大寫，不然程式會出錯，至於為什麼要大寫，我只能說這是CodeIgniter的規定，我如果沒有記錯是為了區分class與function名稱的緣故，所以無論如何請記得大寫，後續Model的部分也是同樣的首字要大寫喔。
在News.php中，複製一個function index()並貼在function index() 下方，並把index改成create，然後回到function index()，將裡面的「return view('welcome_message');」改成「return view('list');」，如此一來當我們打開 http://localhoat/news/ 時，預設就會執行function index() 的內容，程式就會回傳 list 這個view 給瀏覽器，於是你就會看到列表頁的內容了，瞭解基本的function index()結構後，我們要從新增文章內容做起，之後在Read階段時我們會在回來這裡。
將function create() 裡面的內容「return view('welcome_message');」刪除，改成以下內容：
//if form submit
if($_POST){
$model = new NewsModel();
$model->save([
'title' => $this->request->getVar('title'),
'content' => $this->request->getVar('content')
]);
return redirect()->to(base_url('news'));
}else{
return view('form.php');
}上面的程式碼是在說，如果表單有用post的方式送資料過來，那要調用NewsModel()，然後將title、content的資料存到model裡，存好返回list列表頁，如果表單沒有用post的方式送資料則顯示form.php的頁面內容。這裡我們有調用NewsModel()，所以我們要在整個class News()之前招喚NewsModel()，所以要寫上「use App\Models\NewsModel;」，以下是我目前News.php的全部樣子，紅框部分為本步驟所新增的範圍。
Step6. 建立MVC的M
由於我們剛剛招喚了NewsModel()，但我們還沒有建立這個Model，所以前往資料夾app/Model，建立NewsModel.php，輸入以下程式碼：
<?php
namespace App\Models;
use CodeIgniter\Model;
class NewsModel extends Model
{
protected $table = 'news';
protected $allowedFields = ['title', 'content', 'insertTime','updateTime'];
}以上程式碼的大意是，namespace命名空間採用App的Models，使用CodeIgniter的Model功能，建立一個class叫NewsModel作為Model功能的延伸，資料表名稱是news，要使用的欄位有title、content、insertTime與updateTime四個欄位。
Step7. 測試Create 新增功能
到這裡你就可以開啟你的網站，例如http://localhost/news/create，你就可以測試你的表單資料有沒有正常送出到資料庫了，因為送出後沒有做提示訊息，所以麻煩請到資料庫確認你的資料有進去news資料表中。
然後由於我們新增的部分已經做好了，所以你可以前往view將list.php中，第37行改成以下程式：
<a href="<?= base_url();?>/news/create">Add News</a>如此一來就可以從列表頁連到表單頁了。
Step8. 檢查資料庫與下載本文程式碼
如何檢查你是否有跟是本篇文章，完成教學的內容？你只需要前往資料庫，瀏覽資料庫裡面的資料即可！
你會在資料表中看到你在create form中輸入的內容，id會是流水編號，title、content 會是你輸入的資料，insertTime與updateTime會是資料庫自動產生的時間，只要這些欄位有正常儲存進資料庫，就代表你完成本篇教學的內容了。如果你想下載本篇文章的程式碼，請直接按下方下載按鈕即可。
