Web revamped

It's been a while since the last time I published anything, but I have been busy redesigning the web, and tweaking many things.

Frontend

It no longer uses Bootstrap. I was only using it to have a grid and achieve some responsiveness, and also some of the form styles, but I have decided that it is not worth it.

I have written tests for the (so far) two HTML5 games and some common libraries I have developed for them. Improving the games having those tests backing them has been a very nice experience. I use Mocha and Chai for the tests. Since I wanted them to be automated and the games divided in modules (manageable by require() calls like in Node.js) like Browserify for them.

Now, the build process is automated with Gulp, which manages Browserify (using Watchify for development) and SASS.

I feel much relieved to have a design that (far from being good) is at least something pleasant to look at.

Backend

I have decided that my presentation layer was too coupled to my pages logic. Moreover, I noticed that my pages were a lot of boilerplate and some code, even with the code reuse practices I was already using.

So, I set Twig as a dependency and I coded a very simple Page class which manages the page "meta information". One of my .php files now may look something like the following:

<?php
namespace Whatever;
session_start();
require 'autoload.php';

// Logic, operations, database accesses...

$page = new Page();
$page->title = 'Kevin Montalva - Title';
$page->addStyle('thispage.css');
$page->setTemplate('thispage.twig');
$page->setMenuActiveItem('thispage');
$page->setVars([
    'collection' => ClassX::getAll($connection),
    'flag' => ClassY::isThatAvailable(),
    'object' => $object
]);

$page->render();

And that's it, no <div>s (they are in .twig files), no path to .css files (which are live compiled SASS files) and no manually including .php files (thanks to Composer's autoloader).

I feel this is a much more sensible way of coding a page than what I had before. I only need some {{ object.member }} in the .twig files and very simple if conditions to have a very reusable template which works for all I need.