CodeKit's got a great feature called Browser Refresh that refreshes your browser window whenever it does a rebuild of your Sass, Coffeescript or whatever. This makes the write, compile, evaluate loop a lot quicker and can really speed up website development. It's particularly great if you've got enough monitor real estate to show both your text editor and web browser at the same time.
I use MAMP on my MacBook for running WordPress sites and I use CodeKit for compiling all the CSS and JS files in the themes I'm making. However, by default the Brower Refresh feature is only available using CodeKit's built in server, which only works with static files (not WordPress' PHP).
So how do you get Browser Refresh working with an external server like MAMP? It's surprisingly easy:
First, configure the external server setup in CodeKit's Browser Refresh settings:
You'll need to flick the "External Server Required" switch and enter the MAMP URL.
Second, click the preview button in the top right of CodeKit button to see the site. It's vital that you point your web browser at CodeKit's URL, not MAMP's.
That's it, you're done. Try updating some files and see the browser refresh before your very eyes!
