Posts Tagged webdev

Cloud enabled local web development using Dropbox et al

Posted by admin in Technology, Web design & development on February 6, 2010

or I *sync* my Mac Pro and MacBook Pro with Dropbox and Gmail

Cloud enabled local web development? That’s an oxymoron — right? Explain. I prefer to develop/design using MAMP as it’s quicker and doesn’t rely on a sketchy internet connection. While I have a main powerhouse of a Mac Pro under my desk I also use a very capable little MacBook Pro.*

Anyway

I was on the road today – and finally felt the full advantage of getting myself fully into The Cloud.

The main issue? Synchronising my digital self across more than one computer. Storage and email are the main issues…

While according to some Apple’s dot Mac/MobileMe may well be the current cream of cloud subscription services in North America – out here in backwater Europe performance is sh*te. Particularly iDisk. While Apple’s webmail is good – it’s trying too hard to be a desktop application and failing.

For storage I can’t recommend Dropbox enough and for e-mail there’s Gmail…

Dropbox

Now I’ve got my Sites folder (and  a few salient folders of Work In Progress) in Amazon’s S3 cloud via Dropbox. The free service is great (2GB) and the paid versions (50/100GB) are not expensive…

  • It’s easy.
  • It’s speedy. One of the technical features of the system is that files are stored as blobs of hashed deltas (wikipedia says it betterer )… popular files are recognized and appear online without having to be transferred – for example some reference books and software libraries that uploaded very smartly.
  • It’s nimble. As the thing works with deltas and blobs it’s also quick to mirror things when you’ve just been making minor edits or rearranging things.
  • 30 days of versioning for all your files - TimeMachine in the Cloud!

Syncing external folders (e.g. ~/Sites ) across multiple machines with Dropbox

Thanks to this post I found the answer…

[NB - your short user name needs to be the same on all your Macs! If not then go here and read part three "The Full Monty"...]

The steps to synchronising your ~/Sites folder (or any folder that you don’t want to move into the Dropbox watched folder ) between two or more Macs are:

  1. temporarily turn off Dropbox on both machines
  2. make your first sync manually between them (use a direct connection – or load up a USB stick/external HD)
  3. create symlinks into your Dropbox folder on both machines. Create the symlink by typing a command into a Terminal window… it goes a little something like this: ln -s  /path/to/folder/name_desired_folder ~/Dropbox/desired-folder
  4. then restart Dropbox on both machines

Now I’m coding on the go with hassle-free syncing and backup. That is nice.

Email

Well I’ve become a Gmail man. It may not be pretty but Gmail has threaded conversations done properly and labels. Took me a while to get used to threaded conversations [takes me a while to get most things!] but now I find them indispensable. Gmail’s generally very good at keeping quoted text out of your face making the threads very readable. Obviously threaded conversations aren’t so useful if people veer off-track or forsake the reply button in favour of the new message. Offline access was not robust in Safari and now it’s not an option as Mac OS 10.6 won’t have it.  So I still use Mail.app as a backup.

Still on MobileMe/dotMac

The missing links… I’m still on Mobile Me and using it for Address Book, Calendar and Keychain synching. [My FTP favourites too thank's to Panic's Mobile Me implementation in their FTP app Transmit]. Tied into this is Apple’s iSync application which is keeping my mobiles in step. Until Google’s address book improves drastically I’m not considering a move.

*Not just for the occasional bit Road Warrior stuff but also we do sometimes vacate this town for more than a couple of days plus mains power is also a bit of an issue round here! Sometime I need to use my laptop in the office (I do have a UPS but it doesn’t last very long with the beast.)

, , ,

No Comments

Display proper maintenance page with .htaccess

Posted by admin in Web design & development on June 8, 2009

Create a decent “sorry this site is down for maintenace” page with a “have a Nice day” message then when you do need to upgrade things use the following htaccess rewrite rule to forward all traffic to this page.

Adapted from Marco’s Webdev Notepad

RewriteEngine on
RewriteCond %{REMOTE_ADDR} !^83\.57\.178\.37$
RewriteRule !maintenance/index.html /maintenance/index.html [L,NC,R=302]

From Ask Apache (I like)

ErrorDocument 403 http://www.sub.domain.com/
Order deny,allow
Deny from all
Allow from 83.57.178.37

, , ,

No Comments

MAMP stacked (Mac OS X 10.5)

Posted by admin in Web design & development on June 5, 2009

UPDATE: I’ve upgraded to Snow Leopard (Mac OS X 10.6) and the following instructions are no longer entirely valid as Marc Liyanage’s PHP package hasn’t been upgraded to work in the Snow.

Want to get MAMP on Mac OS X 10.6?

If you’re on 10.5 you may read on…

Want to roll a MAMP stack of your own to enable proper local web development? Try these steps to getting you own development environment:

1. Swap the Apple package of PHP for Marc Liyanage’s package of PHP for Mac OS X. Read his notes – only takes a minute. His version has useful “extras” like the mcrypt extension that Apple doesn’t include: you’ll want that for phpMyAdmin. (If you’ve already started Apple’s version – you’ll know how to stop it by re-commenting the LoadModule php5_module line in your http.conf file )

2. Get yourself virtualhost.sh from Patrick Gibson. This little shell script will make the process of setting up proper virtual domains on your development server a cinch. I use “.dev” or “.live” as the TLD to prevent any conflict with the live sites. (Although now I’ve started using Git I may just drop the separation between live and development branch domains on my development box. I still put all my sites in my ~/Sites folder though.

3. Get a Mac OS X MySQL package – (not the latest build but v5.0.x) from the good folks at MySQL. If you’ve already got another version installed – here’s how to uninstal MySQL from a Mac (NB – this will delete your databases too!).

4. Give your MySQL root user a password; type the following into the Terminal:
/usr/local/mysql/bin/mysqladmin -u root password sniggle
…if you like sniggle as a passowrd that is.

5. Now you can administer your MySQL server with phpMyAdmin and the root user you’ve just defined.  (There are other tools too – eg MySQL Administrator – but I’m used to phpMyAdmin from the hosting packeges I use). You may want to virtualhost phpMyAdmin to, for example, “http://mysql/”. Love virtualhost.sh.

6. Then for each [dynamic] site you’ll probably want to add a user and then associate a DB with that user. Do this in phpMyAdmin in one step using the Privileges pane fill in “Add a new User”/then select “Create database with same name and grant all privileges”. Job’s a good ‘un.

Done and not long-winded at-all at-all!

[Originally posted as a reply in Panic's Coda forum... Lots of love for MAMP Pro - a serious contender - and for just 40€... ]

, , , , , , , ,

No Comments

More PNG transparency notes

Posted by admin in Web design & development on May 10, 2009

Via thinkvitamin and  tipster: a couple of notes that may resolve a couple of outstanding issues I’ve had with PNG24 transparency use…

Set width and height for the element/s containing the transparent background image [...] (also, bear in mind that the background images can no longer be tiled or positioned via ‘background-position’)

Apply  position: relative; to any contained links to ensure functionality

The first point means I’ll probably not bother trying to tile a drop-shadow background image to a variable length column again. Time to switch to progressive enhancement with Photoshop CS4/Fireworks/other tools’ ability to stuff alpha transparency into  regular PNG8 files.

The second point is probably the better answer to my last PNG problem post.

Main post about how to work with PNG24 alpha transparency and IE6 …

, , , ,

No Comments

DOCUMENT_ROOT trailing slash issues?

Posted by admin in Web design & development on April 28, 2009

Do you have a web server and a development server rendering different versions of the $_SERVER['DOCUMENT_ROOT'] superglobal?

Mmm, me too. I’d have pulled my hair out if I had any. Made me feel rather defeated after thinking I’d fixed things so that one DB connect call would work on two+ servers. Fancy that – PHP behaving unpredictably – anybody would think I was playingworking very hard with CSS.

[
I had finally got round to using substr to trim the public_htmlpart off a DocumentRoot path to get me an absolutely relative link to a safe place...
ie  (substr($_SERVER['DOCUMENT_ROOT'], 0, -12). )
ie keeping the DB connect information out of the public view
]

Anyway for how to fix the trailing slash problem you should point your google at the New Zealand PHP advocates or crib directly from here:

$_SERVER['DOCUMENT_ROOT'] .=
(substr($_SERVER['DOCUMENT_ROOT'],-1)=='/')?'':'/';

We *heart* Nathan Kennedy

, ,

No Comments

[MAMP stack] OpenGoo install in Mac OS X 10.5

Posted by admin in Web design & development on April 21, 2009

DON’T READ THIS! READ THIS.

Or How to setup a MAMP Stack on… Mac OS X: a proper write up.

Please disregard the gubbins on this post…

[OK - this was going to be a simple step-by-step account of how to install a particular project management system on a Mac OS X box. That particular project stalled but I learnt a few things about how to get a [M]AMP stack setup to the point a which I can continue… ]

Need a project management package. So far requirements and research lead to Open Goo.

  • Download package from OpenGoo.
  • Create a MySQL database for it.
      • [unstuff it and put the folder into ~/Sites/ , for example]
      • virtualhost it
    • fix socket error (?)
      • http://dev.mysql.com/doc/refman/5.0/en/mac-os-x-installation.html: edit (with TextWrangler of course) /etc/php.ini so that  ”mysql.default_socket = /tmp/mysql.sock”
    • Fix mcrypt error: “Cannot load mcrypt extension. Please check your PHP configuration”
    • Ditch the default OS X PHP install in favour of Marc Liyanage’s packaged instal of PHP for Mac OS X
      • If already set up the Apple version of PHP – make sure it’s disabled:  ”LoadModule php5_module“  in /private/etc/apache2/httpd.conf shoul commented out
      • Download and run Marc’s installer from the link above. RTFM mind – but it’s a cinch. The new PHP files will now be in /usr/local/php5.
      • Also ditch any previously installed MySQL
        • sudo rm /usr/local/mysql
        • sudo rm -rf /usr/local/mysql*
        • sudo rm -rf /Library/StartupItems/MySQLCOM
        • sudo rm -rf /Library/PreferencePanes/My*
        • edit /etc/hostconfig and remove the line MYSQLCOM=-YES-
        • sudo rm -rf /Library/Receipts/mysql*
        • sudo rm -rf /Library/Receipts/MySQL*
    • install to match the PHP  package to MySQL 5.0.77
  • Create a privileged MySQL user. (Any user may log in without  a password to get an anonymous session: “No Privileges”. Mac OS X user account – or _mysql. At this stage  log in without a password.)
  • Ye-har! Who’d of guessed… Apple’s MySQL documentation was where to find simple instructions for how to give the MySQL root user a password – and hence succeed to log inwith privileges. Terminal command: /usr/local/mysql/bin/mysqladmin -u root password sniggle. Where sniggle is your choice for a secure password.
  • For each DB user you should add that user with an MySQL query:
    CREATE USER 'user1'@'localhost' IDENTIFIED BY'pass1';

, , , , , , ,

No Comments

jQuery in anger

Posted by admin in Web design & development on April 17, 2009

[notes to self]

Shadowbox

Tooltip

highlightFade

http://jquery.offput.ca/highlightFade/old.php

jquery.validate.js

Lovely, lightweight carousel:
http://www.gmarwaha.com/jquery/jcarousellite/

http://www.noupe.com/jquery/50-amazing-jquery-examples-part1.html

http://www.jasonbradbury.com/

, , ,

No Comments