My blog app: separation of concerns
Published on Sunday 24 April 2016. Tagged as General.
These are the basic principles of my Blog application: In the browser, clear separation of content, presentation and behaviour. On the server: a basic model-view-controller concept.
To have clear separation of content, presentation and behaviour in the front end 'page' of a web application, each part has to be put in a separate file:
- The HTML page contains only the content and it's semantic structure. The content is mostly tagged with semantic tags like
<article> <h1> <p> <li> <code>. Tags that have no semantic meaning like
<div> <span> <b> <i>
- Right at the top of te page there has to be a single stylesheet link to an external CSS file. This file holds all the presentation rules. When necessary, code in the backend can be used to join and minify multiple CSS sources into one.
PHP: separation of site and admin
For everyone except me, my blog should only be read, so only the list of posts and the rendering of each individual post is necessary. For myself, there is a separate admin part. Each part follows a simple MVC structure, with the admin classes inheriting from the blog app part. Since there is no interaction other than to read, the public part of my blog offers no security risks. The admin part has enhanced security built in.
PHP: a simple model-view-controller
- The controller is a PHP class containing the router to distribute the requests. Each request modifies or collects data from the model and redirects to a page or calls the view to render the data. The controller never interacts with the data other than via the model object. It also never does any output other than via the view object.
- The model is a PHP class to manipulate and retrieve the data. My models use PDO to interface with a MySql database.
- The page view is a PHP class to render all the HTML. For the blog itself, this class uses a simple templating system to make it even more easy to rebrand or add analytics code. The admin part uses pure HTML rendering. All the data necessary for the rendering is passed trought a single data object.
The entire blog app
The entire application I've written so far weights a mere 50K in total, that's 10 times less than the weight of an average single web page nowadays. For another comparison: an average WordPress installation needs a whopping 50MB. That's more than a 1000 times more. I'll publish the sample code I've produced so far on github later.
The Blog app project on GitHub