Sharing responsive design breakpoints between CSS and JavaScript using SassyExport

Wouldn’t it be useful if you could define breakpoints in one place and your whole frontend code would update accordingly? That’s what I wanted a while back on a project. I came up with a way to automate this procedure using SassyExport, a Compass plugin used to export Sass maps to JSON files.

Continue reading

Posted in Web development | Tagged , , | Leave a comment

Automated Apache virtual hosts on Windows

Generally all web development should take place on a local development environment. Often usually this includes an AMP-stack. One great feature of Apache is the ability to set up virtual hosts using configuration files. After setting the virtual host configuration, changing the system’s hosts file to point a certain domain name to will allow http://localhost/projectname (which could be pointing to /path/to/www/projectname/ on the system) to become projectname.local for example.

This might get a bit frustrating though, especially if you constantly need to create new local development projects and each should be able to be accessed via *.local or similar development development domain names.

Continue reading

Posted in Web development | Tagged , , , , , , , | Leave a comment

Facebook plugins and AJAX loading

I ran into a small issue earlier today while developing a client website. I was trying to load an external page fragment using jQuery.load(), which worked just fine until the code broke the Facebook Like button plugin.

Continue reading

Posted in Web development | Tagged , , , , | Leave a comment

Beginner PHP: Custom array sorting functions explained

Custom sorting?

Many of you most probably are familiar with PHP’s built-in array sorting functions, such as sort, ksort and similar. The built-in sorting functions are quite straight-forward and easy to use. But what about situations where you need to use a custom sorting scheme to order your arrays properly? Say hello to usort, uasort and uksort (u standing for “user-defined”), a set of functions used to map a custom sorting function to handle the more complex ordering problems.

Continue reading

Posted in Web development | Tagged , , , , , | Leave a comment

Using CSS3 gradients to create text leading lines

The new CSS3 gradients are quite powerful and simple when in need of simple repeating background patterns. Although these will not work in older browsers and partly in newer browsers, they are an option to look for to lessen image usage for things that may work without the image file. This entry will guide you through to make leading lines for text (as has been for ages in notebook paper and similar stuff) using some CSS3. This effect can be useful for lines of code within <pre> tags and similar.

Continue reading

Posted in HTML/CSS | Tagged , , , , | 2 Comments