Building Applications using CodeIgniter (Part 1) – File Structure

Posted at April 29, 2009

Creating web applications with CodeIgniter (CI) is quick and easy because CI handles a lot of the typical application requirements right out of the box (like session management, database abstraction and file uploading). I’ve developed a number of applications with CI now, including BadgeTracker and Sign-Up-Sheet.com, and while CI does handle the repetitive stuff it’s still up to you to create a scalable and easy to update application. Over the last couple of years I’ve come up with a pretty solid structure and set of files that I use whenever I’m building a new app and in this series I’m going to show you what I do so you can get ideas for your own apps.

In this first part of the series I’m going to talk about file structure. The first step to building your app is to get your folder and file structure setup so you have an idea where everything is going to go. If you wait to figure this out as you go along you run the risk of inconsistencies in your code so it’s good practice to just settle on a structure first thing.

CodeIgniter Default

By default, CI (version 1.7.1) presents you with the following structure:

- system
— application
—— application folders…
— cache
— codeigniter
— database
— fonts
— helpers
— language
— libraries
— logs
— plugins
— scaffolding

Everything lives inside the system folder. This isn’t necessarily a bad thing, but every time you want to get to your application to add or update files it’s just a hassle to go into system to get to your application. So, it’s pretty common practice to move your application folder outside of the system folder so it’s front and center in the document root (or whatever folder your developing in).

To accomplish this you will need to update the main index.php file outside of the system folder. Line 43 needs to change to “../application” instead of “application”. Once that update is done then CI shouldn’t be able to tell the difference.

Application Assets

It might be because I’m a neat freak or maybe it’s because of the brief exposure I had with Ruby on Rails (RoR) but I don’t like having my application root littered with folders for images and JavaScript files and such. I like a nice clean document root. So I create a folder at the root of my application called assets. Inside the assets folder I create 3 other directories for images, JavaScript and CSS files so it looks something like this:

- assets
— images
— js
— css

Now all of my non-php files are nicely organized in a single directory at the top of my application. From time to time I’ll also add a directory for videos but you get the idea.

Template Files

Another one of those common application tasks that CI handles, like I mentioned earlier, is templating. The views folder (inside application) makes up the V in MVC and that’s where all your design/display files should go. It’s taken me some time but I’ve settled on a pretty standard way I handle my application templating and it all revolves around a folder I create within views called _templates.

Instead of loading a bunch of view files one after another to make up my page, I prefer to create layout files which are complete web pages just with some variables acting as place folders for content to be inserted later. When it’s time to display a page I load a couple of partial views into variables (by returning the views as strings instead of displaying them) and then passing those variables to my master view file for display. The main benefit of this type of templating structure is that your whole application can use a just a hand full of layout files to handle page structure.

Within the _templates folder I create another folder called layouts. This is where the actual layout files live. Other include/template files are placed inside the _templates folder that are included in more than one layout file like navigation elements and such. I will also typically create other folders within _templates for things like system e-mails and the like.

Final Structure

That just about does it for our structure. I’ve listed the new structure below with just the new directories we should be left with and where they live.

- application
— views
—— _templates
——— layouts
- assets
— css
— images
— js
- system

At this point I typically move the files to the development environment and make sure the default CI welcome message is displayed. If your following along at home and don’t see the welcome screen you more than likely didn’t make the change to the index.php file I mentioned above when we moved the application folder outside system. Double check that and if all was done correctly you should be all set. If you continue to have problems, leave a comment and I’ll see what I can do to help.

Next up: Configuration

In part two of this series I’ll talk about configuring CI to load the common libraries we’ll need and creating a custom config file to keep information specific to our application.

Related posts:

  1. Building Applications using CodeIgniter (Part 2) – Configuration
  2. Building Applications using CodeIgniter (Part 4) – Code Templates
  3. Building Applications using CodeIgniter (Part 3) – Helpers
  4. Generating PDF files using CodeIgniter
  5. 10 Reasons Why CodeIgniter Rocks

CodeIgniter

If you enjoyed this post, please consider to leave a comment or subscribe to the feed and get future articles delivered to your feed reader.

Comments 

16 Responses to “Building Applications using CodeIgniter (Part 1) – File Structure”

Leave Comment

(required)

(required)