Skip navigation

Category Archives: Web Development

A colleague of mine just sent me a couple links that were great tips if you work with git often. lifeon.biggerplanet.com talks about how to take advantage of customizing the prompt and using git-completion.bash script to auto-complete things like git branches and also display the branches in the prompt.

Points of interest…

git-completion.bash

export PATH="$HOME/bin:$PATH"
source ~/bin/git-completion.bash
PS1='[\u@\h \w$(__git_ps1 " (%s)")]\$ '

I wish I had a list of what to start with when first digging into Drupal, so I’m going to use this post as a place to list out a good starting point for users that have never used Drupal before.

Note: It’s geared towards a Drupal 6 project, BUT I believe most if not all of these will work the same on a Drupal 7 project.

When thinking drupal you have a few key terms / things…

First DON’T ALTER CODE OR PUT STUFF IN A FOLDER IF IT’S NOT UNDER THE ‘sites’ FOLDER. Just don’t, it’s tempting as a new-comer but don’t.

Node: Content is generally saved as node, there are different node types, and you can create your own. e.g. Page is a node type thats generally default. Nodes usually also have urls.

User: users are core to the site. Separate from nodes, users can own nodes.

Module: A folder containing php files and other things like css or js files to add functionality. Modules can be installed by placing them in the sites/all/modules folder, and

Now for a list of things to do to learn more.

Also: I’m going to skip the basic ‘download drupal and get the site installed’ stuff, this is after you get the site downloaded and you can see the first drupal page.

1. Set up 2 sites to run off a Drupal install locally.

Understanding the basics of multi-site Drupal installs is important. In our development team, we use it to allow multiple developers to commit their own local database connection settings at times to their own sites/ folder subfolder.

Use your hosts file to mimic this, pointing something like site1.local and site2.local to your apache server, then using a virtual host with a couple server alias’s settings to drive both urls off one site.

Doing that will force you to understand how the sites/url/settings.php is configured. Read the documentation in the settings.php file in the sites/default folder of a fresh Drupal download, and it will tell you how to name folders to do so.

2. Install and become familiar with Drush.

Drush is awesome because it allows you to update / install modules and do stuff like clear cache via the command line. It’s also a great way to interact with Drupal via the cron, if ever you need to do specific thing via cron.

Drush is not something you install per drupal build, it’s installed per computer. It just lets you use the command line to type “drush” and get the following to show up. From there you also see all the commands you can use through drush. Check out ‘cache-clear’, ‘sql-dump’ and other SQL commands to name a few.

$ drush
Execute a drush command. Run `drush help [command]` to view command-specific help.  Run `drush topic` to read even more documentation.

Global options (see `drush topic core-global-options` for the full list).:
 -r <path>, --root=<path>                  Drupal root directory to use (default: current directory)
 -l http://example.com:8888,               URI of the drupal site to use (only needed in multisite environments or when running on an alternate port)
 --uri=http://example.com:8888
 -v, --verbose                             Display extra information about the command.
 -d, --debug                               Display even more information, including internal messages.
 -y, --yes                                 Assume 'yes' as answer to all prompts
 -n, --no                                  Assume 'no' as answer to all prompts
 -s, --simulate                            Simulate all relevant actions (don't actually change the system)
 -p, --pipe                                Emit a compact representation of the command for scripting.
 -h, --help                                This help system.
 --version                                 Show drush version.
 --php                                     The absolute path to your PHP intepreter, if not 'php' in the path.        

...
...
...

3. Handy modules

Install these, they are generally hand. (Note, modules can be found at http://drupal.org/project/modules. And be aware of the version of Drupal you are using when searching.)

- (Drupal 6 only) is the Administration Menu: a handy interface for when your logged in with admin rights. Just adds a black-bar at the top for easy navigation.
- Backup and Migrate: (note the Drush commands added after enabling this.) Allows for very easy database dumps / imports via the Admin interface and Drush.
- Pathauto: Allows for very handy customization of node urls, keeping them automated. A must have for many sites.
- (Drupal 6 only, as it’s included with Drupal 7) Content Construction Kit (CCK): Allows you to add custom fields to your custom content node types.

Thats it for now.

This is very handy, it’s a great way to navigate the site as the admin.

I was introduced to Vagrant at DrupalCampWNY2011 by @darkoantic and crew, and since then I’ve had a goal to really grasp how to best use this tool in my daily process. I already used VirtualBox so it was a shoe-in to replace my existing MAMP setup for development.

The tutorials at the vagrant site use an Ubuntu setup (named lucid32 box,) and while Ubuntu is great, most of my code get’s deployed to CentOS, so I spent a weekend looking into building a base box from scratch. I learned a lot, but I could never get the damn thing to just work. Always a virtualtools problem, or a chef / puppet issue! When I used my base box, Chef or Puppet would always break down unless I did something to the box manually after a vagrant up… which is totally against the point of using this as a tool to version my environments.

Enter Veewee, it’s a promising way to package base-box scripts in a similar way that vagrant’s main purpose is to package the setups that run off base box’s… Plus I found a great walkthrough at Devops.me to get me started. And being that this article specifically talks about CentOS 5.7 I guess it was almost meant to be.

I have an hypothesis that I want to bounce around some, this seemed like a good crowd do to so… it may save someone time and it would be good to hear from somebody that may have had a similar experience.

Long story short, when adding a Facebook Like button to your site, if you want all users to consistently get the Post to Facebook popup after liking the page, you NEED to get an SSL Cert and enable HTTPS on your site.

I’m adding a Facebook Like button to a site, easy enough… I go to http://developers.facebook.com/docs/reference/plugins/like/ and get the code / instructions. Past the code to a page and we’re good.

Now… when I go to test it, the like button works fine, always… the like feature is NOT in question here.

I found in some cases after a user liked the button, they did not get the popup window to also post to their wall. I needed that extra window to show up (client wanted it) so I needed to dig in.

That Post to Facebook popup only appears consistently for users with “Secure Browsing” disabled (*currently* Account settings > Security.)

IF the user does not have Secure Browsing enabled, it doesn’t matter, the Post popup appears always.

So I would assume the fix is to get an SSL cert … even if you don’t actually transfer any secure data on your own site.

To prove this concept… take the following into account…
http://www.buffalonews.com/city/article588083.ece works.
https://www.buffalonews.com/city/article588083.ece does not work.
http://mashable.com/2011/10/10/facebook-friendly/ works.
https://mashable.com/2011/10/10/facebook-friendly/ works.

Because mashable has https enabled, the like button works despite the users Secure Browsing preference. However, for buffalonews viewers, the Post popup only shows up if the user has NOT checked the enable Secure Browsing preference.

I just wish that was documented with the like button.

I use MAMP on my Mac daily for most of my web development. It’s a nice sandbox’ed environment but also very easy to maintain. MOST of the libs that I need are pre-bundled with MAMP, but sometime its required that I need something thats not pre-bundled.

Here’s how to configure PEAR to work properly with MAMP on the Mac, so you can use it via the command line to add PEAR stuffs.

Configuring PEAR under MAMP

First open up terminal and make sure that you’re PATH is set to use the correct pear binary, that being the pear in the MAMP directory. If you don’t want to alter your pear path, you can manually call the pear binary. Anywhere you see “pear somethingoranother” below, just replace it with /Applications/MAMP/bin/php5.2/bin/pear somethingoranother” or cd into that bin dir and use “./pear somethingoranother”.

Also note: some older versions of MAMP did not have 2 versions of PHP installed, so take that into consideration. Newer versions have 2 php folders, and 2 builds of pear and other libs. I generally still use PHP5.2 daily, so thats what I’ll reference.

###
# setup the php5.2 vars for the mamp pear
# !! it is ASSUMED that before these are run, the users PATH is
# updated to use /Applications/MAMP/bin/php5.2/bin/pear before /usr/local/pear !!
# in your ~/.profile or ~/.bash_profile or somewhere...
###

# MAMP binaries should override others for Apache, PHP and MySQL
export PATH=/Applications/MAMP/bin/php5\.2/bin:/Applications/MAMP/bin/apache2/bin:/Applications/MAMP/bin:$PATH

Update the MAMP PEAR Configs to reference the proper files.

IMPORTANT: the extensions folder may be different for you, double the ACTUAL name of the no-debug-… folder first.

pear config-set bin_dir /Applications/MAMP/bin/php5.2/bin
pear config-set doc_dir /Applications/MAMP/bin/php5.2/lib/php/doc
pear config-set ext_dir /Applications/MAMP/bin/php5.2/lib/php/extensions/no-debug-non-zts-20050922
pear config-set php_dir /Applications/MAMP/bin/php5.2/lib/php
pear config-set data_dir /Applications/MAMP/bin/php5.2/lib/php/data
pear config-set php_bin /Applications/MAMP/bin/php5.2/bin/php
pear config-set test_dir /Applications/MAMP/bin/php5.2/lib/php/test
pear config-set sig_keydir /Applications/MAMP/conf/php5.2/pearkeys

###
# these were already set, but may need to be set manually still (if not already pointing to the correct place)
###

pear config-set Filename /Applications/MAMP/conf/php5.2/pear.conf
pear config-set www_dir /Applications/MAMP/bin/php5.2/lib/php/www
pear config-set cfg_dir /Applications/MAMP/bin/php5.2/lib/php/cfg

That should be it!

Install PHPUnit

Just to test it out, here’s what I was able to do to get PHPUnit installed. You SHOULD see the files installed in /Applications/MAMP/bin/php5.2/lib/php, e.g. after this you should see /Applications/MAMP/bin/php5.2/lib/php/PHPUnit exist.

###
# Install phpunit/PHPUnit with PEAR (a bit of a test run)
###

# need this first (not "stable" yet)
pear install channel://pear.php.net/Net_URL2-0.3.1

# need this second (not "stable" yet)
pear install channel://pear.php.net/HTTP_Request2-2.0.0RC1

# make sure channels are added
pear channel-discover pear.phpunit.de
pear channel-discover components.ez.no
pear channel-discover pear.symfony-project.com

# finally, install phpunit/PHPUnit with non-stable dependancies fulfilled
pear install phpunit/PHPUnit

HEADS UP: This is going to be cleaned up sometime soon… just too tired… Mainly, at the end, I kind of slap on the NAT network thing and the note on how to add users to the vboxsf group to properlly use the VirtualBox Shared File auto mount on system boot.

Use VirtualBox to host Ubuntu Server (64 bit) use as a web server. To ease daily / local development, we will need to make sure the files are saved to the host machine (in this case my Macbook) so that there is no need to share files through the network. The idea is that it’s not at all ideal to use a text editor like an IDE over something like AFP or SMB.

So… this is what we’ll be doing.

  1. Install VirtualBox (if not already.)
  2. Create a new Ubuntu virtual machine.
  3. Setup Ubuntu to be a very basic web server with Apache, MySQL and PHP.
  4. Setup the Ubuntu guest to have access to a shared folder on the host machine.

Stuff you’ll need, so download it all first…

VirtualBox (version 4.0.8 r71778 is used for this walk-through)
http://www.virtualbox.org

Ubuntu (ubuntu-11.04-server-amd64.iso is the version used for this walk-through)
http://www.ubuntu.com/download/server/download

Make sure you have VirtualBox installed

Just download it and follow the instructions.

After you install, it’s a good time to locate an ISO file you’ll need ONLY if your using the server edition (e.g. no GUI.)

- Under your /Applications folder locate the VirtualBox app
- Right-click the app, and select Show Package Contents
- Copy the file Contents/MacOS/VBoxGuestAdditions.iso somewhere (say next to the Ubuntu iso file.)

Later we’ll need this file, so just remember where it is.

Setup Ubuntu (Ubuntu Server 11.04)

I’m going to use the server edition. It’s a smaller download being that the GUI is not used and it’s not needed for development lots of times. This will however increase the complexity being that later when we go to setup the shared drive (step 4) we need to jump some hurdles a bit to install the VirtualBox Guest tools. BUT… go big or go home!.

Note: If you want the full desktop version of Ubuntu, go ahead and download the desktop version instead, the rest of the steps should be the same, but you will probably be able to figure out how to setup the VirtualBox Guest Tools yourself.

Now, create the virtual machine (this may vary per your hard drive requirements)

- open up VirtualBox and click New, you should be directed to a wizard
- name your vm something like "UbuntuServer - 64bit"
- make sure Linux and Ubuntu 64bit is selected under "os type"
- select maybe 512 or 1024 mb for ram
- create a new hard drive (vdi) image for your system, when you click next you'll get a sub-wizard
- name your hard drive image (vdi) whatever, I named it to be the same as my vm
- eventually you'll get a summary / confirmation page. make sure it's what you want and click Done

Now you could start your new VM, but first make sure you tell virtual box to mount the Ubuntu iso you just downloaded so you can install it. (Just like you would make sure a bootable CD was available to boot when installing an OS.)

To make the ISO available to the cd…

- Select the Ubuntu VM in VirtualBox
- Click "Settings" then go to "Storage"
- Click "Empty" under the IDE controller
- Next to CD/DVD Drive, click the little CD icon next to the drop-down
- Select "Choose a virtual CD/DVD disk file"
- Locate the Ubuntu ISO file you downloaded.
- Click OK

Oh, and it would be good to double-check that in Settings/System the CD/DVD-ROM is above the Hard Disk in the Boot Order!

In the menu under Devices/Network, I’m using NAT. Make sure you tweak your settings so your VM has network access also.

Thats it, the VM is setup, now we install Ubuntu. Double-click / start the UbuntuServer Virtual Machine and read on.

First Boot to install Ubuntu Server

When you first start the VM, you should be prompted to install Ubuntu. I’m going to skim through this for the most part, noting a few things that were important to the process.

IMPORTANT: Note the key you need to use to get out of the guest machine. After you click into Ubuntu, you’ll need to use left cmd button by default to get out of the VM!

- Language: English
- Install Ubuntu Server
- ...
- Hostname: ubuntuserver
- Partion disks: Guided - use entire + LVM (use whole disk...)
- Full Name of a user: Web Dev
- User/Pass: webdev / webdev (or change to a stronger / different password / username)
- Did not encrypt the drive
- No proxy
- No Automatic Updates
- Software Selection: I selected [OpenSSH, LAMP server, Mail server]
- MySQL pass: root
- Postfix Config: Local only, System mail name "ubuntuserver.mail"
- Installed Grub Boot Loader

Finally, after that, when prompted to remove the CD and reboot, click the CD icon in the lower right to eject the ISO. Then click “Continue”.

Configure the Guest Tools to get a Share working

After you reboot, you should be prompted to login. You need to shut down, so just close out / power down the vm.

Go back into the settings of the VM…

- Under Shared Folders click the green "plus/folder" icon to create a new share
- I'm using a folder in my Sites directory (/Users/chris/Sites/ubuntuserver), but you can use any folder.
- Name the folder and click OK, then OK (get back to the VM list)

IMPORTANT: The web server or other programs will probably need to write to that folder, so be careful to make sure you don’t select your whole drive or something. If something goes wrong on the guest machine, your host machine files could be lost! Just sayin.

Install / make sure some extra stuff is ready. This is so that VirtualBox can take more control over the linux kernal thus allowing for things like seemless shared drives form host to guest and vise-versa. (See the http://www.virtualbox.org/manual/ch04.html#idp5848336 page under Ubuntu)

In order to fully update your guest system, open a terminal and run

- Now, boot up your UbuntuServer and login
- sudo apt-get update
- sudo apt-get upgrade
- sudo apt-get install dkms
- sudo reboot

Boot up again then load the tools iso file (originally located at /Applications/VirtualBox/Contents/MacOS/VBoxGuestAdditions.iso via Show Package Contents on the VirtualBox app)

- Click Devices / CD/DVD Devices / Choose a virtual CD/DVD disk file and locate the VBoxGuestAdditions.iso file

Run a few more commands… you WILL get an error about not installing stuff with X Windows… thats fine.

- sudo apt-get install hwinfo
- sudo mount /dev/cdrom /media/cdrom
- cd /media/cdrom
- sudo ./VBoxLinuxAdditions.run
- sudo reboot

Finally…

- sudo mkdir /media/ubuntuserver
- sudo mount -t vboxsf ubuntuserver /media/ubuntuserver
- cd /media/ubuntuserver

BAM! You should be able to “ls” and list your files

Well, there is one last thing that may be very different for each of your dev environments. Network access to your VM.

For now, I can show you how to use NAT to access your server. I’m NOT a network guy… so there may be a better way. However, I believe that using NAT will keep you padded from the outside network (e.g. at home or at a coffee shot wifi, NAT should work the same in this case.)

- (sometime after NAT has been selected) with your vm running type 'ifconfig' and get the ip address for the the eth0 device
- shut down your vm if it's currently running (sudo shutdown -P now)
- in your VM's Settings, choose  Network
- select NAT, and under Advanced click the Port forwarding
- setup a new forward from 127.0.0.1 port 8080 (or 80 to replace your main webserver or any other port you want thats free)
- set the port forward to the ip address of the eth0 device in your vm port 80

When you boot up you should be able to go (on your Mac host) to http://localhost:8080 or 127.0.0.1:8080 and see the file served from /var/www/index.html on your Ubuntu guest.

Final Note: You can use VirtualBox to auto mount your share. That saves you the need to manually mount the shared drive every time you boot. HOWEVER, you need to add your avarage user to the vboxsf group so they have permission to that share. The perms on the automounted share are root / vboxsf, so this will fix your users… “sudo usermod -aG vboxsf “… e.g.

- sudo usermod -aG vboxsf webdev
- sudo usermod -aG vboxsf www-data

The www-data user is the default user apache runs as per your /etc/apache2/envvars file.

References:

When I develop sites I start on my local machine, and edit my /etc/hosts file to point to my local system. E.g. website.dev is the dev domain I might use to work on website.com locally. (This would be opposed to pointing all sites to localhost/folder/someotherfolder/website_dev or something. I just find it eaiser.)

It works great, but for WordPress sites the SiteURL and Home settings are in the database, so they need to be updated EVERY time you change domains (e.g. when I push code and database changes I was writing under website.dev to stage.website.com or something.)

A quick few lines you could add to your theme (or probably in a plugin too) to update the siteurl and home settings would be as follows.


// at top of functions php
update_option('siteurl', 'http://' . $_SERVER['HTTP_HOST']);
update_option('home', 'http://' . $_SERVER['HTTP_HOST']);

Placing that at the very top of your themes functions.php file would allow you deploy your site under a couple domains without going through the process of logging in or anything.

This one will be short, I’m writing it from the wordpress iPhone app. It’s nice, but I don’t know it could be used long term for quality blogs.

There’s no way to post audio/video. Picture support is nice though, it even optionaly resizes the image to be smaller and upload faster.

All-in-all though, the app offers a nice intuitive interface and makes light blog management on the road easy.