Create Todo App with CodeIgniter 3 + AngularJs

For this tutorial, I would like to demonstrate on how to create simple Todo App with CodeIgniter 3 and AngularJS. We also use CodeIgniter Rest Server library for restful API creation.

Although Laravel is the most popular PHP framework nowadays, creating web application using CodeIgniter is still relevant (for me). It is actively support and has very good documentation.

You may download the full source code here.

Below is step by step on how to create simple Todo App with CodeIgniter 3 and AngularJS. Click here to view the demo.

1. Setup the database

Create a table as sample below. Basically we need an id, title, and status column to store our todo list. Configure your database in the config folder.

CREATE TABLE IF NOT EXISTS `task` (
  `id` int(9) NOT NULL AUTO_INCREMENT,
  `title` varchar(250) NOT NULL,
  `status` tinyint(4) NOT NULL DEFAULT '0',
  `timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

2. Install CodeIgniter Rest Server library

Put the library and config files in its folder accordingly. You may refer to the documentation page for more detail.