Simple Blog – Example 2: Procedural

Simple Blog is a multi-part series. Check out The Index

There is a lot of cleanup to do after Example 1: Structured Programming. In this example, we’ll focus on cleaning up repetitive blocks of code and markup by using functions and includes.  Using a procedural programming style, we’ll transform our code from page-level scripts, to functional blocks of code and markup that can be reused throughout the application as required. The four main areas we’ll rethink and rewrite are:

  1. Directory Structure
  2. Site Configuration
  3. Page Layout
  4. Reusable Functions

1. Directory Structure

In this example, we’ll be extracting blocks of code and markup from our pages and storing them in external files which can be imported back into our base pages as required. To differentiate between our base pages and our includes, let’s start by creating a new directory named ‘includes’. We’ll use this directory to store all configuration, layout, and function files which will be imported into our base pages. Note, in a production application, you would secure this directory by creating it above your application’s root directory.

Next, instead of storing all include files in the include directory, let’s create two more sub-directories named ‘functions’ and ‘templates’. These sub-directories will help us further differentiate between blocks of code which will be stored in ‘functions’ and blocks of markup which will be stored in ‘templates’.

2. Site Configuration

Our site configuration file we’ll help setup site-wide default values such as default timezone, default currency, and default database credentials. It also helps us setup absolute paths to our base directory and our includes, functions, and templates directories. Finally, the configuration files gives us a central location to import functions that will be used on each and every page.

Continue reading