Creating a Full-blown MVC Web App using PHP5 or PHP7 & Ignition-Go

• Assumed Knowledge or Pre-reqs: Basic PHP knowledge; familiarity with the MVC pattern
• Ideal for: PHP newbies, ASP.net MVC developers wanting to build open source or PHP app

Part 1 of 2: Setting Up a Solid Framework

The Goal of this Tutorial

This tutorial will walk you through the creation of a simple but full blown web application. In Step 1, we’ll be getting and installing a framework, creating and configuring a database, and setting up the main web app with a login screen. In Step 2, we will be creating an application module to list, add, edit, and delete contacts.

What You'll Need Before We Start

You'll need to have:

• A running HTTP Web Server. We’re going to assume you’re using Apache, though the steps for using other servers should be very similar. We might have to play a little with the server configuration. Make sure you have PHP 5.5, 5.6 or 7.x installed and configured.

• A database server. We’re going to be using MySQL server (or MariaDB) in this tutorial. You’ll need to know enough about SQL in order to create an empty database. Since we’re using SQL, also make sure that you have the pdo_mysql or mysqli extensions enabled in PHP.

• Basic PHP knowledge. Any object-oriented programming you’ve done in any language is also helpful.

• Finally, you’ll need a basic knowledge of the MVC (Model-View-Controller) programming pattern. A quick overview can be found using Google.

• Optional: install GIT version control (see here)

What We are Using

The purpose of this setup is for an enterprise-class web application. There are lots of frameworks out there. But these days, for enterprise apps, there are two major foundational frameworks from which many starter frameworks are based on: Laravel and Codeigniter. So then you need to choose which of these starter frameworks or foundations to build on.

Ignition-Go

For this tutorial, we chose an up-and-coming framework called Ignition-Go because it is similar to a popular one we used to use for many years called Bonfire (and this author is a major contributor). Ignition-Go is modular and has a GUI code generator. Both of the aforementioned are Codeigniter-based. Codeigniter is very easy to work with and have intuitive classes for new PHP developers, especially if you come from a ASP.net MVC background. It's very stable, and now has seen a recent new lease on life with a 3.x release and a new version 4.x in the works.

The Steps

Step 1: Get the framework

The first step is to get the framework. Ignition-Go includes Codeigniter so it is one stop shopping. To download it and review the documentation beyond this tutorial, visit the project on GitHub: https://github.com/ci-blox/Ignition-Go and download the latest release package.

If you have GIT, You can also clone the repository using the command line after navigating to your web server htdocs folder:

 git clone git://github.com/ci-blox/Ignition-Go igo

Otherwise, unzip the package to a new folder named "igo" in the htdocs folder of your web server or extract it to a directory on your local machine and copy and paste it under htdocs/igo.

Step 2: NPM

Install NPM node.js: package manager for node modules if you don't have it. See https://nodejs.org/en/

Step 3: Change directory

Open a command line and change directory to the new site folder igo. Example: cd igo

Step 4: Yarn

Install Yarn to manager component dependencies. Type:

npm install -g yarn

Step 5: Update components

Install the latest version of all the components. Type:

yarn install 

(hint: more should be downloading other than shown; as in if the list is longer do not worry)

Step 6: Gulp

Install and run 'gulp' (note that gulp will run continuously in "watch"mode, watching for css and js changes). Type:

npm install gulp

Then,

npm install gulp-cli -g

(gulp-cli -g allows you to put forth a command line interface)

Step 7: MySQL

Create an empty MySQL database called ci_blox

Example: use HeidiSQL and create both a database and a user with privileges to new database

Step 8: Run Gulp

Run 'gulp' (note that gulp will run continuously in 'watch' mode, watching for css and js changes).

Type:

gulp serve

Then after a certain amount of data loads, this should be the end result on the bottom:

Step 9: Result

In your browser, go to /install/init under your web root, which would be http://localhost:8080/install/init if you used gulp as depicted above, to finish using install wizard.
Note: alternatively, if you had created virtual host igotestlocal.com, then you would go to http://igotestlocal.com/install/init in your browser.

If all goes right, this is what you will see when you go back to the web root:

Watch out for Part 2!

We're always available to answer any questions you may have at tutorial@codementor.io.