Local development server setup – PHP/MySQL

by Jon Trelfa Posted on 12/16/2009

One of the things that annoys me about website development is the need to prefix webpages running on my local server with localhost like:

http://localhost/site_name1, http://localhost/site_name2, etc

I don’t usually have the luxury of an external development server, but having an environment that closely mimics my site’s final destination is critical.  It was actually pretty easy to set up a local server on my computer.  Here is what my local development server addresses look like:

http://www.projectname.localhost, http://www.otherproject.localhost

Set Up

First, I create a public_html folder to store all of my websites.  I prefer to keep everything in my home directory, so my folder is /home/jon/public_html.  I also recommend that development occurs in the home directory for the simplicity of setting permissions and the ease of performing backups (you backup your home directory, right?)

Your “home” folder can be in any number of locations:

  • Linux – /home/<name>
  • OSX – /Users/<name>
  • Windows:
    • XP – C:\Documents and Settings\<name>
    • Vista/7 – C:\Users\<name>
    • In Windows, your home folder can be located using the %UserProfile% environment variable.

Moving on… let’s assume you’ve created <home directory>public_html

Now install the latest apache server, mysql, and PHP.  Use whatever installation packages suit your OS – it actually doesn’t *really* matter that much where everything gets installed.  I used synaptic package manager in Ubuntu and installed it all from there – took 10 minutes; 8 minutes of which were download times.  There are also some packages out there to make it even easier to set things up on your local computer.  I haven’t used any of them – but a quick google search will turn up several candidates.  Here are a couple:

  • WAMP – Windows Apache Mysql PHP
  • MAMP – Mac Apache Mysql PHP

Configuration

Here’s where the setup gets fun.  (The actual location of the configuration files are different depending on your OS, I will do my best to point you in the right direction)

  1. Configure Apache for virtual hosts:
  1. Edit the <path to server>/httpd.conf file (on some systems, this could be called apache2.conf.  If you have both, try the apache2.conf file first)
    1. Find the line (near the end of the file) that looks like this:
      # Virtual hosts
      # Include path/to/virtual-hosts/file/or/directory
    2. Remove the comment (hash mark) in front of the Include directive
    3. Save the file
  2. Edit the virtual-hosts.conf file (on my Ubuntu 9.10 system, it is the ‘default’ file under /etc/apache2/sites-available).  Additional configuration options can be found here: http://httpd.apache.org/docs/2.2/vhosts/
    <virtualhost *:80>
      DocumentRoot /path/to/public_html/site_folder
      ServerName www.sitename.localhost
      ErrorLog logs/sitename.localhost-error_log
    </virtualhost>
  3. restart apache
  • Edit your hosts file.  It can be in a number of locations on your system.  (mine is /etc/hosts  WindowsXP users can find it in C:\windows\system32\drivers\etc\hosts)
    #add a line like this for each site you want to run locally
    127.0.0.1 www.sitename.localhost
  • Open your browser and type in the full address: http://www.sitename.localhost
  • Done!

    • I really like this approach because:

    1. I can treat each folder in my public_html folder as independent websites
    2. I can set up each project up to mimic it’s production structure so that the FTP/upload process requires little or no additional configuration.
    3. I don’t have to worry about absolute/relative paths mapping to the wrong place.  The site root is no longer /public_html :)
    Posted in Code | Leave a comment

    Inserting a custom file path in vim

    by Jon Trelfa Posted on 12/13/2009

    OK – so I use CodeIgniter as my PHP framework and one of the things that (I kind of like) is the addition of a special PHP comment that they add to the end of their files:

    /* End of file welcome.php */
    /* Location: ./system/application/controllers/welcome.php */

    I keep all of my projects in folders like this:
    /home/jon/public_html/<project name>/<project files and folders>

    Apache is configured as a local server with virtual hosts (I’ll post on that later)

    For a CodeIgniter project, the controllers folder would be:
    /home/jon/public_html/<project name>/application/controllers

    So I wanted to have a quick way to add the code snippet to the end of the file with a quick couple of keystrokes.

    Rather than mess with insert mode mapping – I decided to use the snipMate vim plugin (VERY  handy, by the way).

    I added this snippet into ~/.vim/snippets/php.snippet

    snippet cifooter

    /* End of file `expand("%")` */
    /* Location: `substitute(expand("%:p"),"/home/jon/public_html/[a-zA-Z]*/",'.\/','g') ` */

    “What does it do?” You might ask…

    I’m sure you recognize the /* Comment */ delimiters and the “End of File” and “Location” text – the magic is what’s between the backticks ` `

    snipMate has this cool feature that allows you to echo the results of VIM functions (enclosed in ` `) as snippets.

    1. expand("%")

      this function spits out the current file name.  You can also achieve this in insert mode with

      <c -R>=expand("%")<cr>

    2. substitute(expand("%:p"),"/home/jon/public_html/[a-zA-Z]*/",'.\/','g')

      This is similar to the

      s//

      ex command – except it acts on an input string rather than the buffer.  I’ll break it down:

      1. substitute("input string","pattern to match","subtitute for pattern","modifier")

        takes the input, finds the pattern, replaces it with the substitue.  The ‘g’ modifier means to globally replace all pattern matches:

        substitute("/home/jon/folder","jon","blog","g") -> "/home/blog/folder"

        In this particular case, I’m replacing any instance of “/home/jon/public_html/<any number of alpha characters>/” with a forward slash “/” to produce the path in the code igniter file.

      2. expand("%:p")

        gives the full path of the file in the current buffer

    The end result?
    If my file is: /home/jon/public_html/foo/application/controllers/welcome.php
    I can type

    cifooter TAB

    in insert mode and voila!

    MUST faster AND easier than manually typing in all that stuff.  I can even shorten the snippet trigger – but I just prefer the more descriptive text.

    Posted in Code, Linux | Tagged , | Leave a comment

    Full CMS in 12 steps – is this the best CMS…ever?

    by Jon Trelfa Posted on 12/07/2009

    To some, their own flavor of CMS would be considered the “best” – but I’ve used a *couple* of CMS’s in the past.  Here’s a list of systems I’ve been using from just the past couple of years (in no particular order)

    • Joomla
    • Expression Engine
    • Ektron
    • CMS Made Simple
    • Drupal

    I had considered trying Plone, Silverstripe, and possibly MODx for a couple of projects.  I say had considered because of my recent discovery of concrete5.  All I can say is…WOW!

    It took me all of 1/2 hour to get a functioning CMS in place from an existing template – and another couple of hours to tweak the CSS (concrete has a way of putting it’s own spin on things like auto-nav – but I’ll get to that later)

    Here are the 12 steps I took to get the page from template to CMS (some steps are more complex than others – but you get the idea):

    1. Create a folder – ‘foo’
    2. Create a file – description.txt and save it under ‘foo’
      1. First line: “Foo Theme”
      2. Second line: “A description of Foo Theme”
    3. Grab my template page (I create all of my templates as static HTML first when I develop a new website) – copy it as ‘default.php’ under ‘foo’
    4. Copy CSS, JavaScript and image files under ‘foo’ into their respective directories
    5. Replace css href attributes to something like this:
      <link rel="stylesheet" type="text/css" href="./css/foo.css" />

      to

      <link rel="stylesheet" type="text/css" href="<?php echo $this->getStylesheet('css/foo.css'); ?>" />
    6. Do the same for images – but use
      $this->getThemePath()

      instead of the normal src path

    7. Replace the title in the header with:
      < ?= Loader::element('header_required'); ?>
    8. Here’s the fun part – put code similar to the following in all the places where you would want “editable” content (or possibly navigation or ad space, etc):
      <?php $left_nav = new Area('Left Nav'); $left_nav->display($c); ?>
    9. Take a screenshot of the image – save it as a 120×90 thumbnail.png file under ‘foo’
    10. Upload ‘foo’ into the root/themes directory where you installed concrete5
    11. Activate the template from the concrete dashboard
    12. Done – you will now see your template in a fully functional CMS!

    There’s a bunch of odd things that I adjusted after the fact – but probably could have been avoided if I had planned better.  For example, take this snippet of HTML code:

    <ul id="left_navigation"><li><a href="/">Home</a></li></ul>

    My stylesheet rule was:

    #left_nav { list-style-type:none; }

    When I told concrete that the id of my navigation was ‘left_navigation’, it applied the id to a surrounding div rather than the ul.  Not a huge deal, but something that I needed to fix nonetheless.

    There are a TON of ways to create custom content, custom data blocks, and well..pretty much anything.  It’s my new CMS of choice (other than wordpress for blogging, of course)

    Posted in Code | Tagged | Leave a comment

    Handy VIM keyboard shortcut

    by Jon Trelfa Posted on 12/02/2009

    One of the things I missed about using UEStudio (in Windows) when I switched to Linux is a simple little keyboard shortcut it has for C programming.  The shortcut allows you to type .. (two periods) that will be automagically replaced with the arrow -> operator for calling class methods (PHP uses the arrow operator).

    Try typing this (a CodeIgniter ActiveRecord db example):

    $this->db->get('table_name')->row(0)->field_name;

    Now type it using the shortcut from UEStudio:

    $this..db..get('table_name')..row(0)..field_name;

    MUCH faster when you have to use PHP methods a lot.

    As it turns out, you can do the same thing in VIM with a simple insert-mode keyboard map in your .vimrc file:

    inoremap .. ->

    Pretty nice :)

    Posted in Code, Linux | Tagged | 1 Comment

    Learning Vim

    by Jon Trelfa Posted on 11/25/2009

    My IDE post re-ignited my interest in learning Vim but “diving right in” has been a challenge – there’s just too much.  One of my favorite quotes about Vim  comes from the O-Reilly book, “Learning the vi and Vim Editors”

    One of the biggest advantages for an adept user of vi is that there are so many options to choose from. (One of the biggest disadvantages for a newcomer to vi is that there are so many different editor commands.)

    Vim really is a bit complicated to learn.  I think these curves represent what it’s like pretty well.  I’ve recently disovered Derek Wyatt’s Blog that has a ton of video tutorials for using Vim!  It’s really nice to have the video/narrative to follow along.  I typically use 2 monitors – so one monitor has Vim running while the video is playing in the other.

    Vim may just become my editor of choice soon enough…

    Posted in Code, Linux | Tagged | Leave a comment

    Just write, already

    by Jon Trelfa Posted on 11/23/2009

    I don’t think it’s writer’s block. For whatever reason, I feel the need to make sure each article I write is thorough and easy to read. I have all these posts in draft status and am losing interest in the topics!

    I think its more important to just write and worry about the rest later. That’s what the “edit” feature is for.

    Posted in Code, Productivity | Leave a comment

    Choosing an IDE

    by Jon Trelfa Posted on 11/19/2009

    One of the most frustrating things in the world (to me) is choosing an IDE for developing code.  It is frustrating because there always seems to be at least 1 or 2 things that annoy me with each of the hundreds of choices of IDE’s available.  I spend a majority of my time using an IDE; so I think it’s important to feel comfortable and happy with it.

    I’m generally pretty easy going when it comes to features and functions that I prefer in an IDE.  Here’s my list (in no particular order)

    1. Syntax highlighting
    2. Project management
    3. FTP/SVN integration
    4. Templates and/or code snippets
    5. Project/file system search
    6. Customizable color theme
    7. Code folding
    8. Customizable keyboard shortcuts
    9. Bracket highlighting
    10. Type-ahead/intellisense
    11. multiple file editing (“tabs”, for example)

    I’m sure you’re thinking, “Oh – <insert IDE here> does all of those things and more!”.  Chances are that I’ve tried <insert IDE here> and got annoyed by something.  Here’s a couple of examples:

    1. Eclipse IDE
      • Gigantic!  This program takes a huge amount of resources, leaks memory, and takes forever to load up.
      • I can customize my syntax highlighting and color preferences – it’s just a huge pain in the ass.
    2. gEdit
      • weird indentation – I waste too many keystrokes fixing indentation
      • no built-in FTP/SVN integration
    3. Aptana
      • Standalone or as an eclipse plugin – it’s freakin gigantic
      • They switched to PDT – bye bye color schemes, hello eclipse style color choices
    4. vim
      • Taking me way too long to learn all of the weird/cryptic keyboard commands to make it all work

    I think vim has the most promise.  I tried to force myself (by immersion) into figuring it out – but it seems like the learning curve gives me negative productivity for at least a month.  For now, I’m using Aptana – but I see myself switching to a more vim/gvim approach in the very near future.

    *Color Schemes:  I’m probably the most picky about color schemes because I’ve found that it is easier on the eyes when working long hours with dark background/light text versus white background/dark text – I have less of a headache at the end of the day.

    Posted in Code | Tagged , | Leave a comment

    Getting Things Done – or not

    by Jon Trelfa Posted on 11/18/2009

    Several months ago (closer to 18 months, actually) I read the book Getting Things Done by David Allen.  My eyes were opened to the notion that, “Hey!  I can finally get things done at work”.  The overall process is simple:

    • Work comes in
    • If I can do it in 2 minutes – just do it
    • If I can delegate it – do it
    • If I don’t have to do anything with it – save it or delete it
    • If it still needs to get done – categorize it and do it later

    On the surface, this looks pretty easy, right?  In my case, the answer is a very solid “No”.  It has NOT been easy AT ALL.

    There are a TON of resources out there to help people adopt the GTD process.  Google “Getting Things Done” and you’ll get over 100 million results.  I’m still not getting anything done.

    So here I am – I have the book, 100 million resources on the Internet, I made all the decisions, I did the stuff I could do in 2 minutes (well… I allowed 5 minutes), I delegated, I categorized.  Why isn’t anything getting done?

    Oh yeah – I left off the part where I actually do the other stuff.

    Turns out that my problem is in the “categorizing” part.  The book has all of these great ideas about projects, contexts, next actions, and other clever ways to categorize your tasks.  I spend more time deciding on how to categorize tasks that I forget what I’m supposed to do!

    Being the tech nerd that I am, I tried to use software to help:

    All of these ideas/tools are GREAT!  They provide excellent ways for me to categorize all of my tasks in an easy-to-find, easy-to-reference manner.

    Maybe something is wrong with me.  Maybe I spend too much time figuring out/configuring/getting used to <insert tool here>, thus preventing me from doing what the book suggests; get things done.  I’m going to stick with the old, “send me an email so I’ll remember to do it” process for now.

    Posted in Productivity | Tagged | Leave a comment

    So, you think you’re driving an “American” car?

    by Jon Trelfa Posted on 11/17/2009

    One of the most interesting aspects of living in Detroit is the number of Big 3 branded vehicles on the road compared to non Big 3.  On my commute to work today, my un-scientific count was around 30:1 in favor of the Big 3.  When I travel outside of Michigan, the ratio drops down (from what my unscientific eyes have seen) to about 1:1.

    First of all – I find it odd that I would even notice.  A car is just a car, right? I attribute my brand sensitivity partially to the culture of Detroit.  This is “The Motor City” after all.  I think another part of it is being witness to the collapse of the local economy surrounding me – a majority of which can be attributed to the massive loss of jobs in the auto industry.

    Reality Check

    Now it’s time for me to piss off my fellow Detroiters…

    Here is a simple of list of what driving American does NOT mean:

    • Your vehicle has a Ford, Dodge, or Chevrolet badge. 
    • Your vehicle is made by a company with headquarters in the USA.
    • Your vehicle is assembled in a plant employed exclusively by the UAW.

    Driving American is actually harder than it sounds.  Why is it hard?  Because there is no car that’s 100% “Made in America”.  In fact, many of the vehicles that have an American brand are only 60% or less domestic.  Drive the Chrysler Crossfire?  Made in Germany. PT Cruiser? Mexico. Chevy Aveo? South Korea.

    Cars.com maintains a top 10 list they call the American Made Index.  Vehicles make this list based on the % of foreign and domestic parts and labor used to produce the vehicle.  Here’s a surprise – 3 of the top 10 are NOT from the Big 3.  (gasp!)

    Stop Vandalizing Foreign Branded Cars!

    Despite the existence of facts, logic, and common sense, owners of foreign cars here in Detroit are frequently targeted by vandals.  Here is a prime example: http://www.mlive.com/flintjournal/index.ssf/2008/12/buy_usa_foreign_car_vandal_in.html

    How about the idiot that launched a website to boycott Alabama – with a disclaimer on the front page:

    To those hard working people in Alabama, we apologize for the boycott and the loss of income and future employment from this boycott but please understand that it is within your power to elect a representative who has America’s best interest in mind

    So – he’s saying he wants to boycott all products made by American workers to help “support” America?  I love and despise his public declaration of stupidity.

    It’s at the point where I prefer that my wife doesn’t drive downtown in her Mazda Tribute (assembled here in Michigan) because the Mazda badge attracts negative attention.

    Use your dollars smartly

    My point is that I think it’s important for me – and other Americans – to do our part to support our domestic economy.  It isn’t just cars and trucks!  Clothes, building supplies, food, toys, and many other things are available from US-based companies! There are a ton of ways to help pump up our economy.

    Posted in Musings | Tagged | Leave a comment