Step by Step Complete CodeIgniter 4 Basics Tutorial

Reading Time: 11 minutes
1 Views

This tutorial guides you the complete basic concept of CodeIgniter 4 from beginners to advance level. If you are familiar with older versions of CodeIgniter like v2.x or 3.x then this course will be somewhere easy to understand in terms of MVC pattern.

An open-source PHP web application development framework called CodeIgniter was created to make it easier to create dynamic, interactive websites.

It is built on the Model-View-Controller (MVC) architectural paradigm and offers a wealth of tools, helpers, and plugins that allow developers to quickly and efficiently create online applications.

In CodeIgniter 4 there is complete change of working folders and files in comparison of older versions of CodeIgniter. If you thought that you can handle easily v4.x after learning v3.x then may be you will be not comfortable to work completely with v4.x.

Read More: How To Integrate ChatGPT API in CodeIgniter 4 Tutorial

After going with this whole article you will find the differences.

Let’s get started the module wise learning of CodeIgniter 4 Basics Tutorial.

What is CodeIgniter 4.x ?

CodeIgniter is PHP based web application development framework and 4.x is the current development version. It is very easy to work and develop an application. Let’s see some important features of this framework –

  • CodeIgniter is MVC supported working architect. In MVC, M stands for Model, V stands for View & C stands for Controller. By using this MVC concept, application development is quite easy to manage everything like with the part of database, user interfaces (UI) of end users etc.
  • This framework is very light weight, you will see when you do the installation of this framework. Very simple installation part.
  • Availability of the concept of Helpers & Libraries i.e core classes application development is faster. There are several core classes which proved many functions which enhances the development process.
  • Working with the Databases is pretty simple in nature. Inside this framework we have many ways to work the database queries like Raw Queries, Query Builder Class, Models & Entities etc.
  • Inbuilt features of security like XSS clean & input sanitization methods.
  • Well management of Session based concept. We can easily handle the data of session or flashdata.
  • Routes configuration now in v4.x is very very neat and clean. Those who have the knowledge of Laravel framework, they can easily understand the flow of routes and method types.

Official websiteCodeIgniter Official click here

Installation Process of CodeIgniter 4.x in System

In older versions of CodeIgniter, installation process includes either we can download a zipped folder or simply need to do clone of github repository.

But in CodeIgniter 4.x we now find the installation process also includes composer based concept. It means we have total methods available to download equals to 3.

Methods of Installation

  • Download & Setup via a zipped folder from official link – Manual Method.
  • CodeIgniter 4.x Github repository clone.
  • Install by Composer

For complete detail about step by step installation of CodeIgniter 4 in Ubuntu, Click here to go.

Successfully, we have now a setup of CodeIgniter 4 at local system.

Read More: How To Cache Database Query Using CodeIgniter Cache?

Understanding CodeIgniter 4.x Folder Structure

When the project downloads, get back to it’s folder structure. It contains directories at root – /app /public /system /writable.

The main folder from these folders where we do development i.e inside /app directory. Inside this app directory we should all development folders like Controllers, Models, Views, Config etc. We will see in details about each of these in few seconds.

Explanation of CodeIgniter 4 folder structure

/public – This folder contains index.php, .htaccess, public accessible folders/files. At int ital stage application runs from this folder. In the application development if we need to keep assets like CSS, JS, Images etc then we need to store all them into /public folder. It’s name means public accessible folder.

/system – Core files/packages/libraries stores into this folder. Modifications into any of these files will crash your application or will not work as per its default behaviour. So it’s not recommended to do any changes there. CodeIgniter 4 provides many of core files which we use like Helpers, Libraries, Databases etc stores their core files inside this folder.

/writable – Writable folder contains the temporary files like cache, logs etc. Modifying, deleting any files are not recommendable from this folder.

/app – Main application folder. It contains all the development modules like Config, Controllers, Views, Models, Helpers, etc. Inside this folder all code lives.

  • Config – It contains application configurations – Like Routes, Database etc.
  • Controllers – It works with Models & Views and develop an application working flow.
  • Models – Database functional files.
  • Views – End users representational layers, HTML basic files.
  • Helpers – It contains the standalone functions which is basically created for doing some specific function.
  • Libraries – Classes which contains some functions, methods which helps to develop an application.
  • Language – Multiple language support

Along with all these folders, CodeIgniter 4 contains env file. It is environment file. In this file, we have many environment variables i.e configuration variables which we can set and use in application development.

While working, we need to change env to .env to use that.

Also CodeIgniter contains a spark module. This is the new module which has been added into version 4.x.

Environment (.env) Setup

When we install CodeIgniter 4, we will have env file at root. To use the environment variables means using variables at global scope we need to do env to .env

Either we can do via renaming file as simple as that. Also we can do by terminal command.

Open project in terminal

cp env .env

Above command will create a copy of env file to .env file. Now we are ready to use environment variables.

Enable Development Mode

CodeIgniter starts up in production mode by default. You need to make it in development mode to see any error if you are working with application.

Open .env file from root.

# CI_ENVIRONMENT = production

 // Do it to 
 
CI_ENVIRONMENT = development

Now application is in development mode.

Overview of Default Controller, Route & View

When we install CodeIgniter 4 setup, there is a default route, a view file and a controller created. These default configuration creates the landing page of CodeIgniter 4.

Controller is in /app/Controllers folder.

View in /app/Views folder.

Route defined in /app/Config/Routes.php.

//...

$routes->get('/', 'Home::index');

//...
<?php namespace App\Controllers;

class Home extends BaseController
{
	public function index()
	{
		return view('welcome_message');
	}
}

Home is the default controller which extends BaseController. BaseController in the parent controller which every controller needs to inherit.

Inside this Home Controller, there is a index method which returns a view files called welcome_message. welcome_message is the default view file. This view file is inside /Views folder.

Read More: CodeIgniter 4 How To Work with MySQL Joins Tutorial

Create First Controller, First Route & a View File ?

Controllers are the modules which controls application with Views & Models. To create any controller in CodeIgniter 4, BaseController is the parent controller which needs to be extend while developing.

Controllers will be created inside /app/Controllers folder. There is no naming convention to create controllers. We can create the name like Site or SiteController.

Spark CLI interface is newly added feature in CodeIgniter 4. Open project in terminal and run few spark commands.

To create Site.php, here is the spark command

php spark make:controller Site

To create SiteController.php, this is command.

php spark make:controller Site --suffix

Open Site.php from /app/Controllers folder.

<?php 

namespace App\Controllers;

use App\Controllers\BaseController;

class Site extends BaseController
{
	public function index()
	{
		return view('site_index');
	}
}

namespace indicates the path of the class, here Site has been created inside /app/Controllers.

Inside this controller we have created first method i.e index which returns a view file – site_index. This view file is in /app/Views/site_index.php.

Routes added inside /app/Config.

Routes.php file is the main configuration files for routes. While adding routes methods, there can be different different method types as get, post, put, patch etc.

//...

$routes->get('site', 'Site::index');

//...

Here, we have registered our first route for Site controller. When we open route named site into browser then it will call index method.

Site::index – It means index method of Site Controller.

To Work with CodeIgniter 4 Models and Entity, click here.


Application Testing

Open project terminal and start development server via command:

php spark serve

This command will start application’s development server.

URL: http://localhost:8080/site

That’s it.

We hope this article helped you to learn about CodeIgniter 4 Basics Tutorial in a very detailed way.

Online Web Tutor invites you to try Skillshike! Learn CakePHP, Laravel, CodeIgniter, Node Js, MySQL, Authentication, RESTful Web Services, etc into a depth level. Master the Coding Skills to Become an Expert in PHP Web Development. So, Search your favourite course and enroll now.

If you liked this article, then please subscribe to our YouTube Channel for PHP & it’s framework, WordPress, Node Js video tutorials. You can also find us on Twitter and Facebook.

1 thought on “Step by Step Complete CodeIgniter 4 Basics Tutorial”

  1. Straight to the point and very helpful piece, you should keep it up.

Comments are closed.