Archive for October, 2012


Setup Github and Packagist on Mac

Well, I think I’m going to try making an open source zf2 module, to see if I can ūüôā
Essentially a basic static page module for sorting out all your boring non-dynamic pages! (about us, privacy policy, terms and conditions, that kind of thing!)

Okay, so first up you need a github account. Github is free so long as any code you put up there is open source. Activate your account and create a repository. In my case it was https://github.com/delboy1978uk/static-content.

Now you need to set up git. The instructions on the website didn’t quite work and I had to IRC some guys at #github to get pointed in the right direction. But for the most part it worked, so follow these instructions:¬†https://help.github.com/articles/set-up-git

Next thing we clone the repository to your machine. go to whichever folder you want to keep your work in, and type the equivalent of this:

git clone git://github.com/delboy1978uk/static-content static-content
cd static-content

And we’re in our project. In order to use composer with our repository, we need a packagist account, so sign up at¬†https://packagist.org. And we create a composer.json file :

{
    "name": "delboy1978uk/static-content",
    "description": "Module for serving up static pages",
    "type": "library",
    "keywords": [
        "zf2",
        "static",
        "content"
    ],
    "homepage": "https://github.com/delboy1978uk/static-content",
    "authors": [
    {
        "name": "Derek Stephen McLean",
        "email": "delboy1978uk@gmail.com"
    }
    ],
    "require":
    {
        "php": ">=5.3.3",
        "zendframework/zendframework": "2.*"
    },
    "autoload": 
    {
        "psr-0": 
        {
            "StaticContent": "src/"
        },
        "classmap": [
            "./"
        ]
    }
}
So we add that file, and commit, and push.
git add .
git commit -a
git push origin master
If you get some error about cannot push, (I did, it said: You can’t push to git://github.com/delboy1978uk/static-content.git) then you need to go to your github page. You will see a text box with an https:// address. Copy the address, and then edit your .git/config replacing the git:// one with the https:// one you just copied. Then try pushing again, and it should work.
Go to your packagist account, and paste the repo address in there (click submit package). Once it’s been added you’ll see it doesn’t auto update. Click on your user name at the top right, it will take you to a page with an API key. Copy this key and go back to your github repo, and click admin at the top right. On the following page, click service hooks in the left hand side column. Enter¬†http://packagist.org as the host, your packagist user name, and the pi token you copied. Once thats done, packagist will now update when you push to github.
Okay, so now to test!
Go into one of your projects that use composer (in my case a Zend Framework 2 Application), and in the composer.json add the following (or similar) in the require part:
"delboy1978uk/static-content": "dev-master"
Finally, type in
php composer.phar update
And lo and behold, my package is auto installed into our application!! Awesome! Now I just need to make this package worth adding in the first place lol!
Have fun!

ZF2 is totally redefining PHP development, I love the direction they are going! Anyway, those who have shown interest will no doubt have played with Akrabats tutorial on the zf2 site. I for one have, and I also went and met the guys themselves at the PHPNW2012 Conference in Manchester at the start of this month! The ZF2 tutorial day was great! Thanks Evan & Rob! Anyway, i’m straying off topic here.

It’s all about the modules! Most sites have a login! A blog! A contact form! Facebook? Twitter? Whatever! Why reinvent the wheel? http://modules.zendframework.com allows you to choose from a growing number of modules, and installing them is a piece of cake (i should stop saying that, this is zend!) using the PHP Composer. So let’s have a look!

Completely starting from scratch, bung this in your Apache’s VirtualHosts config, tweaking the path to wherever your site is:

<VirtualHost *:80>
 ServerName zf2
 DocumentRoot /path/to/my-site/public/
 SetEnv APPLICATION_ENV "development" 
 <Directory /path/to/my-site/public/>
 DirectoryIndex index.php
 AllowOverride All
 Order allow,deny
 Allow from all
 </Directory>
</VirtualHost>

Now you’ve done that, time to install the Zend Framework Skeleton Application, by cloning it from the Git repository. Go into your sites folder, and say:

git clone git:/github.com/zendframework/ZendSkeletonApplication.git my-site
cd my-site
ls

You’ll notice a composer.json in there. Open this up, and you’ll see it depends on PHP and zendframework. In the command prompt:

php composer.phar self-update

This updates composer to the latest version, since it has updated its version since the SkeletonApplication was released. Then:

php composer.phar install

Composer kicks in, and downloads our dependency (zf2), after having made sure you have a sufficient version of PHP (>=5.3).

What’s this? ZF2 recommends installing more modules? Fine, lets do that, but first, lets choose even more modules to add! Change your composer.json to look like this:

{
 "name": "zendframework/skeleton-application",
 "description": "Skeleton Application for ZF2",
 "license": "BSD-3-Clause",
 "keywords": [
 "framework",
 "zf2"
 ],
 "homepage": "http://framework.zend.com/",
 "minimum-stability": "alpha",
 "repositories":[
{
 "type": "composer",
 "url": "http://packages.zendframework.com/"
 }],
 "require": {
 "php": ">=5.3.3",
 "zendframework/zendframework": "2.*",
 "doctrine/doctrine-orm-module": "dev-master",
 "doctrine/doctrine-module": "dev-master",
 "zendframework/zendpdf": "2.*",
 "zendframework/zendservice-recaptcha": "2.*",
 "symfony/yaml": "dev-master",
 "zendframework/zend-developer-tools": "dev-master"
 }
}

I’ve deliberately left two of ZF2s recommendations out of this, as they’re actually pecl extensions, not models, and I ain’t covering that just now, but I added Doctrine functionality. So, to get all this new stuff, we tell Composer to go update itself!

php composer.phar update

And bang, we now have the modules downloaded into the vendor folder. So! How to use them, I hear you cry? Well, the example I’ll show you is probably the best example to start with, and indeed, was the module we were shown at Evan & Rob’s ZF2 Tutorial day at PHPNW2012! ZfcUser.

Goto http://modules.zendframework.com
Scroll down to ZfcUser (formerly EdpUser) (that’s Evan btw) and click, which will take you to the github page.
Scroll down to Requirements. You’ll see you also need ZF2 and ZfcBase to use this module. We have ZF2, but not the ZFCommons base use Classes, so we’ll install both of these. Again, a simple case of adding the lines, then running php composer.phar update. Watch out for unnecessary tabs, brackets, and commas, or the json parser will take a fit!

"zf-commons/zfc-base": "dev-master",
 "zf-commons/zfc-user": "dev-master"

Great! All running smoothly I see! So jump in the ZfcUser module in the vendor folder and go into data, there you’ll get the sql for creating your user table. Run that on your MySQL in your database server, and you’re ready to rock! Now we just need to enable the modules (I’ll only show the relevent ones for the example, so I won’t be using the Doctrine stuff for now) and set up our db connection.

Stick your DB parameters in the config autoload local php file:

return array(
 'db' => array(
 'username' => 'user',
 'password' => 'pass',
 ),
);

and in the global file, we’ll put the meat and bones (the local php file is in .gitignore, which is why we keep the credentials there):

return array(
 'db' => array(
 'driver' => 'Pdo',
 'dsn' => 'mysql:dbname=my-site-db-here;host=localhost',
 'driver_options' => array(
 PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES \'UTF8\''
 ),
 ),
 'service_manager' => array(
 'factories' => array(
 'Zend\Db\Adapter\Adapter'
 => 'Zend\Db\Adapter\AdapterServiceFactory',
 ),
 ),
);

Now if you open the application config you’ll see an array called modules, where we register the modules our application uses. Change it to this:

'modules' => array(
        'Application',
'ZfcBase', 
'ZfcUser'
    ),

And that’s literally it! try browsing to /user/login! register and login! with Gravatars and everything!

The really great thing about all of these modules is that they are extensible. Is something not happening in a module quite the way you would like it? Write a module extending it!
For instance, my first thought about ZfcUser was ‘what about activating your account by email when you register? Well, guess what? There’s a module for that. Evan told me to go check out CdliTwoStageSignup! (extending ZfcUser)

Working in this manner really is getting to the stage where functionality is literally drag, drop, ‘n’ tell your app! And by studying a module’s code, especially a module extending another module, we can start to see how it all connects up through the service and event managers, and how it’s all tied together! But that’s for you to mess around with! Have fun!

CSS overrides for iPhone & iPad

Website looking great? Did you check it on your phone? Or your iPad?

Sometimes buttons and things are bigger and ruins your layout etc. Whatever your issue is, you might not need a completely separate CSS file. You can override rules using this kind of thing:

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
 input[type="submit"]
 {
 height: 36px;
 font-size: 16px;
 }
}
/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
 input[type="submit"]
 {
 height: 36px;
 font-size: 16px;
 }
}

Easy as that!