CodeIgniter 4 CRUD + Bootstrap 4

by Jairon Landa

In this tutorial, I will demonstrate and guide you on how to develop basic create, read, update, and delete operation in CodeIgniter 4 framework. The new version CodeIgniter 4, it provides you with a basic CRUD operation. To accelerate your project development.

Require in this project

GitHub Link:

We will create a basic Cinema project with basic CRUD operation.

Before we are going through, first we need setup CI_ENVIRONMENT, APP, and DATABASE in .env file.

Follow this tutorial (Setup CodeIgniter 4 in XAMPP), if you still don't have CodeIgniter 4 in your local machine. 

Step 1

From the root of your project rename the env file to .env.

Step 2

Uncomment the line with CI_ENVIRONMENT on it change to production to development.


CI_ENVIRONMENT = production to CI_ENVIRONMENT = development

Step 3

Uncomment the line app.baseURL and add a domain name.


app.baseURL = 'http://ci4site.test/'

Step 4

Setup database connection variable

Note: this is default configuration for XAMPP phpmyadmin

database.default.hostname = localhost
database.default.database = cinema
database.default.username = root
database.default.password =
database.default.DBDriver = MySQLi

If everything is good, now we can start a development. Database structure for our project Cinema is

Database Cinema Structure

id primary key and auto increment for movie id

title movie title in string

description movie description in string

created_at date and time data is created

updated_at date and time data is updated


CREATE TABLE `cinema`.`movie` ( 
`id` INT(11) NOT NULL , 
`title` VARCHAR(355) NOT NULL , 
`description` TEXT NOT NULL , 
`created_at` DATETIME NOT NULL , 
`updated_at` DATETIME NOT NULL ) 


Create Model

Navigate app/Models/ and create new file MovieModel.php

Copy and paste this code to MovieModel.php



Which is your table name


Uniquely identifies the records in this table. This is useful when using find() method.


Allow CodeIgniter to save, insert, or update method any field names. If not listed will be discarded.


Determines whether current date is automatically added to all inserts and updates.


Specifies which database field should use for keeping data record create timestamp. Leave it empty to avoid update it (even useTimestamps is enabled)


Specifies which database field should use for keeping data record update timestamp. Leave it empty to avoid update it (even useTimestamps is enabled)


Declare Helper and Service

Navigate  app/controllers/ and open BaseController.php file.

The base controller is a great place to load any helpers, models, libraries, services, etc. that you intend to use every time your project runs. (More Info)


protected $helpers = ['html', 'url', 'form'];


$this->session = \Config\Services::session();

Full code for BaseController.php file


Controller singleton for our Home.php 


Next, lets start a development.

1) Movie Index


CodeIgniter Index CRUD


Movie index html.


Controller method

Index method

This is our index method, the purpose is to retrive all data from database.


2) Create Movie


ci4 Create


HTML to create movie

Controller method

In this method, we validate user input using CodeIgniter library to validate if user already input data in html. Else, it will show error.

3) Read/Edit Movie


ci4 Edit/Read


HTML Edit movie detail

Controller method

We retrieving our data from database, base on movie id. If movie id not exist. It will show pop-up error.

4) Delete Movie


We use javascript onClick() method to request user input before delete the movie data in database.

ci4 Delete

Controller method

This method delete data in database base on primary key movie id.



You already learn how to use basic CRUD operation in CodeIgniter 4.

About Jairon Landa (@jaironlanda)
Jairon Landa

Backend and Frontend developer, a.k.a full-stack developer.

Kg Bundung, Tuaran

Recommended Posts