Just a quick post here with a tip that may help you if, like me, you’re struggling getting Laravel’s php artisan migrate command to work.

In my case I was receiving no output whatsoever - no error messages, no logs - and my app was able to write to the database so I knew the credentials were correct, which made the problem very hard to diagnose.

On a hunch I decided to try setting the socket manually as other people using MAMP have had success with it, and thankfully that solved the problem, despite my not receiving the same error message.

So, my .env now has an extra line:

DB_UNIX_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock

and my config/database.php has an extra element added to the MySQL settings array:

'unix_socket' => env('DB_UNIX_SOCKET', ''),

Those two additions tell Laravel to look in .env for a defined socket, or to leave the socket empty if one isn’t defined, which triggers the default DSN generation behaviour in the MySqlConnector class.

For me, this doesn’t affect the functionality of my app but does make the migrations work. Running the socket setting through .env means it can easily be modified on a per-machine basis without having to worry about source control etc.

Hope this helps someone avoid wasting a lot of time like I did!

I’m currently working on a side project (coming soon, hopefully!) that uses HTML5 audio. Working locally everything was fine but when I tested on the server I ran into a problem caused by the fact that the audio takes a few seconds to load properly and start playing. That made me realise I hadn’t considered what would happen on a slow connection.

Sure enough I fired up Slowy.app and my carefully-crafted user experience became more like listening to a collection of short audio clips punctuated by silence as the audio buffered. Clearly, something had to be done.

The HTML5 spec includes an event, canplaythrough, that the browser is supposed to fire when the media element is loaded and buffered enough that it can play through smoothly. Perfect, I thought, that should do exactly what I want.

Unfortunately, Chrome doesn’t play nicely with canplaythrough. It fires the canplaythrough event straight after loading the element rather than buffering it first, leaving me back at square one and looking at fixing the problem with some JavaScript.

So after a quick search I found some code by Denis Nazarov that looked like a good start. I adapted Denis’ code to remove the dependency on jQuery and added some extra functionality such as working around another Chrome issue and handling mobile browsers with their lack of preloading.

The result is the imaginatively-named Mediabuffer which is fully documented on GitHub. It’s MIT-licensed so anyone can use it and the lack of dependencies should mean it’s widely compatible.

Hopefully someone out there will find it useful!

If you’re working with JavaScript in the browser, sometimes the easiest way to know what’s going on is to use console.log to output variable values or other status updates.

But as the thing you’re working on gets more complicated you can have a lot of logging going on. It’s helpful to be able to visually differentiate the different messages and/or filter them by what type of information they are.

So I wrote a little helper function to make things a bit easier:

It’s intended as a partial to be used with something like CodeKit but can just be dropped in the old-fashioned way too. It has no dependencies so should be widely compatible, though right now I've only tested it as part of a jQuery project.

It’s pretty much self-documenting so I won’t repeat what the comment says. I’ve MIT-licensed it so you’re basically free to do as you wish with it, though contributing back any improvements is always appreciated!

Don’t judge me, but I’ve only just started getting to grips with SASS. To help with the process I’ve been using CodeKit and loving it. As well as compiling my SASS stylesheets I have it set to concatenate and minify my JavaScript too.

So my main JavaScript file looked like this:

/*! * * Example JavaScript * By Kris Noble * * @license Example license * * Original: /js/functions.js * * Includes: * - Library v2.1.1 | (c) 2014 Example Group | example.org/license * - Another Library v1.1 | github.com/dev/another-library | MIT license * */ // @codekit-prepend "library.js"; // @codekit-prepend "another-library.js"; $(window).load(function(){ // … });

Nothing special, just a normal doc comment, a couple of prepends for libraries and then my own code.

Getting CodeKit to keep the comment is no problem, the @license takes care of that. However, @codekit-prepend works differently from SASS’ @import - it doesn’t insert the file at the point of the comment, it takes the "prepend" part literally and sticks it right at the start of the file.

So from my file above, I’d get the prepends, then the comment, then my code - not exactly optimal. I thought about just adding the comment manually, but that feels kind of janky compared to the usual flow of CodeKit.

Then, I came upon a simple solution - move the comment out to its own file and prepend it, like this:

// @codekit-prepend "_doc.js"; // @codekit-prepend "library.js"; // @codekit-prepend "another-library.js"; $(window).load(function(){ // … });

_doc.js contains the comment and nothing else, and gets prepended as you would expect. In my example above the @license part stops the comment getting stripped out, but you can also use @preserve to achieve the same thing.

Isn’t Wikipedia amazing? Yeah, it’s the butt of jokes about people not researching stuff properly but if you stop and think about it, it’s an incredible thing. A repository of huge swathes of human knowledge, available to (almost) all, for free, any time of day or night, in a whole bunch of different languages and dialects. Truly awesome.

One area where it could do better, though, is its own design. The current design is functional and presentable but there is certainly room for improvement. We’ve all seen some beautiful unsolicited redesigns, but wouldn’t it be cool if you could just take the existing design and tweak it a bit to be more readable, or make the links a bit more obvious, or reduce some of the visual clutter?

Well, drum roll please… you can! Even better, it’s really easy.

Requirements

1. Either a Wikipedia account, or some way of adding user stylesheets in your browser. I’m going to proceed as through you’re going down the account route though, as a) it’s how I’ve done it, b) there are a bunch of other benefits to having an account, c) it’ll follow you wherever you log in and d) if you’re happy with user stylesheets, it should be trivial to get it working anyway.
2. Open Sans. It’ll work without, but Open Sans is just so lovely to read in my opinion. Also the text styles are based around it so you might need to tweak things a bit if you don’t use it.

Method

1. Sign into your Wikipedia account.
2. Go to the Appearance tab on the Preferences page.
3. In the list of skins, find Vector at the bottom, then click on “Custom CSS”.
4. Copy-paste the code below into the text entry box. If you already have a custom CSS file and you want to edit it, click the Edit tab at the top-right.
5. Click “Save Page”.
6. Enjoy your new, more readable Wikipedia!

The code

I’ve set this code up as a Gist so that a) it’s easy for you to fork it if you like and b) you’ll always see the latest version of the code, which I’ll tweak as I find other minor irritants.

Here it is:

Results

As you can see, there are a bunch of tweaks mainly aimed at improving readability and reducing visual clutter. The Wikipedia we all know and love is still there in spirit, though.

Some notes

I’ve deliberately written the CSS to be as unspecific as possible, the idea being that Wikipedia works pretty well as it is so I don’t want to break stuff. Some of the rules are a bit weird, but that’s mainly because I’m trying to work around the defaults as much as possible.

Note that although most text has plenty of contrast, a few small bits (for example reference markers) aren't very high contrast. This is to aid readability for most people but if you need to bump up the contrast, it's easy to tweak the CSS to suit your needs.

Also I have formatted the CSS single-line to save a few bytes - I know it’s a drop in the ocean but a few bytes here and there could save or cost the Foundation some real money.

Wrapping up

I really hope you find this useful and that it helps to make your learning experience that little bit more pleasant.

I’d love to hear your thoughts on this, so please get in touch via Twitter, email or a comment and let me know!

I’m sure I don’t need to extol the virtues of working locally via MAMP Pro. One thing that has always annoyed me though is that to test on devices other than my main box, I’d have to either upload the files to a server or fiddle with something like DynDNS.

Recently though, I discovered xip.io. It’s a neat little service that takes 99% of the hassle out of viewing your local sites on any other device that’s connected to your network.

How to use it

1. First things first, make sure your local server has a fixed IP on your local network. You can do this through the router config options. If you’re not sure how, just search for “[your router make/model] assign IP to computer” or something similar. This isn’t strictly necessary but it will save a lot of hassle down the line if you reboot your router and all the local IPs change.
2. OK, so let’s say your server has the local IP address 192.168.0.1, and the local site you want to use with xip.io goes by the hostname example.local. In MAMP Pro, click on the example.local item under “Hosts”, then click the + button under the “Aliases” box.
3. Enter the alias in the form [hostname].[server IP].xip.io. So in our example, we would enter example.local.192.168.0.1.xip.io. Leave the box ticked and don’t worry about the drop-down on the right.
4. Hit “Apply” and restart the servers to update the config.
5. On the network-connected device you want to test, navigate to the alias you just entered, and weep with joy at how easy it was.

That’s it! Bear in mind that anything that relies on the hostname in your code (cookies, for example) will be using the alias rather than the usual local hostname so be prepared to tweak some configs if needed.

Of course, you can still take advantage of the simpicity of xip.io if you dont use MAMP Pro, you’ll just need to set up the alias by hand. Personally though, I think the time saved with Pro is well worth paying a few quid for - it can often be found on those cheap software bundle sites for a hefty discount.

I’ve recently started using Bitbucket as a kind of off-site backup for my Git repos - it works beautifully with SourceTree as you can have all commits pushed to the “origin” repo by default. Lovely.

Usually I work locally with MAMP, pushing updates to a staging server if I need to show the client or something. Before now, I did that with good old FTP, but I wondered if there might be a way to have my commits pushed to the server via Git.

Thanks to Bitbucket’s “services”, there is. I discovered Brandon Summers' awesome post and managed to get it working with a minor change. The only problem that remained was that Brandon's script only worked with one repo, so if you wanted to use it with multiple repos on the same server, you’d have to have multiple instances of the script available at different URLs.

So, I came up with a solution, which I’ve added to GitHub as a gist so you can fork it etc.

Usage

The script is essentially the same as Brandon’s so follow his instructions for the most part, then set up your root directory and repo list.

As an example, if you have repos at /home/projects/example/htdocs and /home/projects/another_site, you’d set it up like so:

/** * The root directory where the repos live. * * @var string */ $root_dir = '/home/projects/'; /** * A list of repo slugs that the script is allowed to know about, and their * locations relative to $root_dir. * * @var array */ $repos = array( 'example-repo-1' => 'example/htdocs' 'another-repo' => 'another_site' );

If Bitbucket tries to push to a repo that isn’t defined in $repos, the script will fail gracefully and do nothing, so you don’t need to worry about accidentally updating the wrong repo. Just check your commits before you push them to Bitbucket!

If you use this, please let me know how you get on with it! Any forks or suggestions for improvements etc are very welcome - I will be using this daily so if I come up with anything myself I’ll add it to the gist.

Photo: Colorful buckets 2 by ivanmarn

Hello there. It’s been a while.

After a promising start to 2012, sadly my good intentions to post more fell by the wayside as other commitments piled up. After a while, I’d lost the momentum that I’d built up in the first quarter of the year, so even though I kept thinking to myself that I really should do a post, I also talked myself out of it by wanting to have something “good” to end the drought.

Well, enough is enough. I’m breaking the inertia of inactivity with this short and simple post, and I’m going to make an effort to follow it up and get back into the habit of sharing stuff.

I know that there are other people like me out there, who are full of ideas and want to share but are struggling to take the first step back. So this is a call-to-keyboards - find or make a clear half-hour for yourself and crank out a post. It could be a simple “I’m back” post like this, or it could be as simple as going into your drafts and giving an old idea a quick polish.

If you’re reading this, and I haven’t posted for a while, feel free to nag me! If you need a bit of help getting back into the swing of things yourself, let me know and I’ll badger you - post by post we’ll change the world, or at least our poor neglected blogs!

I've recently made the switch from Firefox to Chrome as my default browser and by and large I'm very happy with the decision.

One thing that was niggling me though was that when you have a lot of tabs open, it can be tricky to tell which tab is active. I tried playing with some of the available themes but didn't really like any of them - all I really wanted was the default theme but with slightly darker inactive tabs. So eventually I decided to just do it myself.

Confession time - I didn't do it from scratch all by myself, but instead used the excellent tool over at ChromeTheme.net, although on looking at the files generated it seems really easy to make your own themes if you're familiar with JSON.

Installation instructions

1. Download the theme
2. At the bottom of the window, click on "Continue"
3. You're done!

More info

Ironically, seeing as this theme is meant to enhance usability, there is one slight usability issue - the "close tab" buttons are quite hard to see on inactive tabs. Sadly Chromium and thus Chrome don't let you skin them yet so there's nothing I can do for now. However I think it's a minor loss for a big win - the buttons are in the same place as always and are perfectly visible on active or hovered tabs.

As the theme was made for personal use, I've only tested it on OS X Lion but as far as I can tell Chrome on other systems does a much better job of distinguishing inactive tabs anyway.

That said, if you find any issues let me know and I'll see what I can do to fix it up!

I love CodeIgniter. So when I found out there was a two-day conference dedicated to it in my home town, it frankly would have been rude not to have turned up.

Codeigniter Conference 2012 (or CICONF, from now on) featured talks from people like Phil Sturgeon, Jamie Rumbelow and Harro 'WanWizard' Verton, who should be familiar to anyone who's worked with CodeIgniter or visited the forums.

The talks were all CI related of course, but the overriding theme of the day was "how can we do cool stuff with CodeIgniter?" - there were talks about why CI is great for building APIs, how to use MongoDB with CI and how to get PHPUnit and CI running together for proper unit testing, as well as more generalised talks extolling the virtues of CI and sharing some useful hints and tips.

Talk Highlights

The talks were all interesting and useful, but the few I've picked out below were really the stars of the show for me.

Nick Jackson - API-Driven Development

If you haven't heard of API-driven development (aka "eating your own dog food") before, it's quite simple. Instead of building a cool web service and then tagging an API on later in response to user demands, the idea is that you build the API first, then build your application on top of it. That eliminates a lot of the gripes people have with APIs - unreliability, bugs, glacial development for example- because the API is automatically a first-priority concern.

It's not worthwhile for smaller projects obviously, but if you think you might need an API at some stage, it's probably better to bake it in from the start than try to muddle one together as an afterthought.

The reason CodeIgniter works well for API-driven development is that it has lots of useful libraries and helpers that take care of things like authentication, plus the MVC pattern already has you thinking the right way in terms of separating your domain logic, data handling and presentation.

Nick also shared a few useful tips, such as the fact that you can use CI's built-in form validation library to validate incoming API calls which saves a lot of development time over rolling your own validation.

John Crepezzi - Unit Testing with CodeIgniter

Unit testing is like exercising regularly and having a healthy diet - we know we should do it and that the benefits are numerous, but breaking the inertia of inaction can be very difficult.

John's talk was mainly a beginner's guide to unit testing with PHPUnit, peppered with CI-specific tips.

The thing I really liked about John's talk was that it made it feel very easy to get started with unit testing in CI - even if you have no unit tests on a big code base, you could start by just adding a few tests to your models, or you could just write a few very general "smoke tests" - does it work, yes or no?

Adding unit tests to my base (or "skeleton") project has been on my to-do list for a while now but John's talk has inspired me so when I get some time to do it I'll give it a try. It would certainly be a nice feeling to embark on new projects knowing the basics are in place so that I can add unit tests for important stuff without having to do a whole bunch of setup each time.

Alex Bilbie - Introduction to MongoDB

Before CICONF I'd heard of MongoDB but if I'm honest, wasn't quite sure what it was for or how I would use it in a project.

Luckily for me, Alex did a stirling job of explaining the concepts behind Mongo and its pros and cons for different systems.

Essentially Mongo bridges the gap between traditional relation databases and key-value stores. Instead of rows you have documents, and instead of tables you have collections.

One of the coolest things about Mongo (in my opinion anyway!) is that it is schemaless, which means you're not restricted to a certain set of fields. For example, if I run an online store selling books, DVDs and CDs, the data I might want to store that relates to a DVD won't map exactly to the data I want to store about a book or a CD. In MySQL I would either have to have separate tables and join them, or store them in a single table but with loads of fields, most of which would be empty. In Mongo, I store them in a single collection and each document would contain just the fields relevant for the item it represents.

Another nice thing about documents is that you can store arrays inside the JSON-style objects that actually hold the data, so you don't need link tables like you would in a relational system - for example if I wanted to store different tags that applied to the items in my store.

Mongo also makes it easy to replicate your database as a backup, or shard it if you need to load-balance.

It's not all gravy though. Mongo doesn't have transactions or joins so that automatically precludes it from being used for stuff like billing. There are workarounds, and you can even use Mongo and a traditional SQL database alongside each other, but obviously different projects will have different requirements.

Mongo looks like good fun to work with so I'm glad Alex's talk has helped me add it to my list of possible things to use.

Jamie Rumbelow - Who Needs Ruby?

Jamie is someone who's had a big influence on the way I use CodeIgniter so quite a bit of his talk was stuff I already knew or practiced, but it was great to see how passionate he is about what he does and he was probably the best "performer" of the conference.

One thing Jamie talked about that I hadn't thought about previously was the idea of having form validation rules in the model rather than the controller. It makes sense when you think about it, because the rules relate to the data, and putting them in the model keeps the data logic in the model. You have to use a slight hack to do it (manually map your data back to the $_POST server variable) but it's not a heinous crime.

Another thing Jamie talked about that I've "kinda" been doing for a while without realising was presenters. The idea is that you add an extra layer between the model and the view, so your view gets its data from the presenter rather than the model itself. What this does is cleans a lot of the logic out of your views and makes it easier to maintain down the line. It also means you're sticking to the "tell, don't ask" principle of telling your presenter what you want from it and letting it decide what to return rather than asking a whole bunch of questions about what it can give you.

The Social

As with any conference there was a healthy social scene as well as the "work" part. I missed the organised evening activities sadly but I managed to get a good bit of pub time in and hang out with people like Adam, Jamie, Ian and Andy which was great fun.

One thing that was nice was that we were already in central London so we could see a few sights in between pubs and restaurants - on the Saturday lunchtime I even managed to have a quick wander around an art exhibition!

Next time I'll have to make sure my calendar is clear and go the whole hog with the social, from the stories I heard the people who went out on the town had a whale of a time!

Overall

In my books CICONF 2012 was a very enjoyable experience - I managed to learn a lot and have a good time too. I would have preferred it to be in the week rather than on a weekend as I need to give my brain a bit of downtime but it wasn't as strenuous as a working day so it wasn't really a hardship.

I'm looking forward to seeing what Phil and co. can come up with for CICONF 2013!