How to install MySQL + configure PHP & MySQL to talk to one another OSX 10.7
I have this in Evernote and have come back to enough times to justify a blog post. Much thanks to good friend and former colleague, Miklos Janosi for his help on this. He did half of this.
This is for us PHP/MySQL web developers out there working on a Mac who want a local development environment.
I cut my teeth with server installs on Ubuntu Linux, where 1 command (tasksel), a strong and creative new MySQL root password and an "OK" confirmation will get you a fully functional LAMP stack in 2-4 minutes. I kept thinking that there had to be a simple way to do this in OSX and this about as simple as I can come up with... for me. As are many obstacles in the IT world, this cat can be skinned in many different ways, I invite comments on how I might simplify this.
I used Homebrew for my MySQL installation.
If you're resistant to or uncomfortable with the command line terminal, this tutorial may not be for you. If you're looking to get more comfortable with it though, fire up your terminal and let's do this!
- Install Homebrew
- Install MySQL w/ Homebrew
brew install mysql
- Copy mysql config file to /etc/ then rename it
- Copy
sudo cp /usr/local/mysql/support-files/my-small.cnf /etc/
- Rename
mv /etc/my-small.cnf /etc/my.cnf
- Copy
- Find the socket that the MySQL daemon is running on
- Open up your new /etc/my.cnf configuration file in your editor of choice, mine's vim. No need to open it up with root privileges, we're just reading at this time
vim /etc/my.cnf
- look for [mysqld], underneath you'll see the word socket with a path after it. In my Homebrew installation, it's /var/mysql/mysql.sock. We're gonna need that path in a minute, so copy it to your clipboard or paste it somewhere handy.
- Open up your new /etc/my.cnf configuration file in your editor of choice, mine's vim. No need to open it up with root privileges, we're just reading at this time
- A hidden fact: OSX 10.7 ships with Apache. If it's not activated, activate it.
- Point your web browser of choice at http://localhost/.
- If you see "It Works!", you're golden!
- If you don't: Apple (top left of your screen) > System Preferences > Internet & Wireless: Sharing > Web Sharing. Activate that checkbox, that's it! This is how you restart your web server too.
- We need a PHP configuration file. If it doesn't already exist, fire this command on your command line terminal.
sudo cp /private/etc/php.ini.default /private/etc/php.ini
- Point PHP at MySQL
- open up /private/etc/php.ini in your favorite text editor, again, I'm a vim guy
sudo vim /private/etc/php.ini
- In my php.ini, I'm finding what I need on line 1219, we want to point PHP at the socket that MySQL is running on. Execute a find command in your editor on the following
mysql.default_socket - Once you're at that line, update it too look something like this (if your MySQL daemon socket differs from mine in 4.2) your mysql.default_socket line is gonna look different than this.
mysql.default_socket = /var/mysql/mysql.sock
- open up /private/etc/php.ini in your favorite text editor, again, I'm a vim guy
- Restart your web server, see step 5.3 above.
Please share your questions via comments in case someone shares your question.
Gift Randomizer Using Underscore
This is version 2 of the gift exchange randomizer update for our family's Christmastime "Grown Up Party" (GUP) 2012. It assignes gifters and giftees to the party attendees.
My earlier version was a bit verbose and lacked the "cannot get for spouse" functionality. Additionally, I've fallen head over heels in love with the underscore.js library and am always looking for an excuse to tinker more with it.
var participants = [
["Casey","Amber"],
["Amber","Casey"],
["Joshua"],
["Joe"],
["Jeremiah"]
];
jQuery(document).ready(function()
{
jQuery("#btn_reassign").click(function()
{
thisBtn = jQuery(this);
thisBtn.attr("disabled", "disabled");
giftees=[];
participants = _.shuffle(participants);
jQuery(participants).each(function(i,v)
{
thisGifter = v[0];
thisSpouse = v[1];
console.log(thisGifter);
contains = true;
while(contains) {
thisGiftee = participants[_.random(0, participants.length-1)][0];
if(!_.contains(giftees, thisGiftee) && thisGiftee != thisGifter && thisGiftee != thisSpouse){
giftees.push(thisGiftee);
contains = false;
}
}
});
result = '';
jQuery(participants).each(function(i,v)
{
result += '
'+v[0]+' gets for '+giftees[i]+'
';
});
jQuery('#results').html(result).fadeIn('fast',function()
{
thisBtn.removeAttr("disabled");
});
});
});
Vim tip – capitalize first letter in a line with a regex switch
I looked all over the place for this one and couldn't quite find the answer. I was submitted a ton of field names to build a SQL query. I needed those field names to be title cased (first letter of a line is capitalized) and ended up mish-mashing the functionality of an online service called Text Fixer + some other vim regex search/replace switches to get to where I needed to be. It wasn't elegant or as concise as it could've been. My gut was screaming that there was one-line solution. Like all of my solutions though, the answer came to me while driving to and from work. I hope this can help someone:
:%s/\(^\w\)/\U\1/g
Google Maps api V3 various tasks
A work colleague, Brad Rice, and his wife are working on a video and needed to capture a Google Maps animated pin drop. I've done this a couple of times, and dug the code out to share with him. Since this code does a couple of other things, I thought I'd share.
function initializeMap()
{
<?= $jsBuildingArray; ?>
var i;
var myOptions =
{
center: new google.maps.LatLng(41.07663853500103, -81.51131740766186),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"),myOptions);
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i in arrBuildingBasedTickets)
{
marker = new google.maps.Marker(
{
position: new google.maps.LatLng(arrBuildingBasedTickets[i][1], arrBuildingBasedTickets[i][2]),
map: map,
animation: google.maps.Animation.DROP
});
google.maps.event.addListener(marker, 'click', (function(marker, i)
{
return function()
{
infowindow.setContent(arrBuildingBasedTickets[i][0]+" tickets = "+arrBuildingBasedTickets[i][3]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
We're writing JavaScript with PHP in this one, which is pretty cool. Powerful stuff. On #3 above, see the embedded PHP to write out a 2D JavaScript array? When the server spits it out, it looks something like this:
arrBuildingBasedTickets = new Array( ['Buchtel Hall',41.07592200269260,-81.51114106178284,7], ['College of Arts and Sciences',41.07774578109146,-81.51071727275848,13], ['Computer Center',41.07543470965410,-81.51544868946070,15], ['Kolbe Hall',41.07623338307453,-81.51003062725067,9], ['McDowell Law Center',41.07738992586513,-81.51589930057526,5], ['Leigh Hall',41.07631426085448,-81.51062071323395,18], ['Lincoln Building',41.08035397933900,-81.51266992092133,0], ['Olin Hall',41.07689657793272,-81.50901138782501,19], ['Ocasek Natatorium',41.07489079739069,-81.50752007961273,18], ['Polsky Building',41.07857071079749,-81.51936471462250,11], ['Schrank Hall (North)',41.07508086389763,-81.51375889778137,17], ['Simmons Hall',41.07828764784946,-81.51157557964325,18], ['Student Union',41.07546503920178,-81.51273429393768,19], ['Zook Hall',41.07643153345869,-81.51157021522522,0] );
- On #15 we iterate over the arrBuildingBasedTickets to build up Google Maps infowindow content and place markers.
- On #24 we bind a mouse click event listener to each marker to open an infowindow on a mouse click
- On #28 we populate the info window with dynamic content from the arrBuildingBasedTickets array.
Instead of hitting me up with questions/comments via email, Facebook or Twitter, please leave responses below to help future visitors who may share your perspective.
How to remove an item from a JavaScript object
jQueryUI is an amazing library. I'm still in learning mode with it. I'm using the autocomplete component to provide "search as you type" or "type ahead" functionality. It's great, but I found it required that I make use of a JS object I've not formerly employed. I'm providing auto complete with data represented by a custom object. I've built data like this in the past with a simple 2D array, but it needed to be this object. Here's an example.
var groups = [{
label: "Group #1",
value: "86bd676dd675120697785388a6ab4042"
}, {
label: "Group #2",
value: "4sdg432gwre2sdf2f5sadf24vr0trg7k"
}, {
label: "Group #3",
value: "798miyjhsdf90qwefd73eqvcad0qwefa"
}];
The task required that I wipe out an element of the object where value == "this_group_id". I hammered the #jQuery IRC room and stumbled my way to the solution. I hope this can help someone out.
groups = $.grep(groups,function(v){
if(v.value!=this_group_id){
return value;
}
});
To assist future users, please refrain from hitting me up on Twitter, Facebook or email. Instead, please post responses in comments.
How to list directories only on the unix/linux command line
Disturbingly, this was a difficult answer to find. I'm looking for the fastest most concise command to list out directories only. Here's what I found/came up with:
ls -d */
And then to list them vertically, throw a 1(numeral one) in your switches
ls -1d */
Protected: NW Dupes
Graphic Work: Ambassadors For Rebuilding
My brother is a fellow University of Akron employee and heads up the Ambassadors for Rebuilding program within the Construction Engineering Technology department. He and a bunch of able bodied and skilled students are headed to Nashville, TN this March to assist in the rebuilding of some underprivileged US veterans in the area all on a volunteer basis.
I was asked to help whip up a WordPress site and build some graphics. I was asked to come up with a logo and tshirt design. Below is the logo I came up with . I made use of Adobe Illustrator CS3, messing around with it's 3D capabilities for one of the first times. Very neat stuff!
University of Akron - Ambassadors For Rebuilding Logo
Site Work: icandothatdesign.com
My wife got a message over facebook from one of her good childhood friends that saw our photography site and inquired about my web services. She is a graphic designer in the greater Washington DC area and was looking for a way to showcase her services + build an online portfolio of her work. We made use of WordPress and a premium theme that had some portfolio management built in to it. We did a bit of code (PHP & JavaScript) and styling customization. The theme author made use of Contact Form 7 to collect contact information on a standard form on this one. SEO was achieved with Google XML Sitemaps.
As a graphic designer, it was really fun to put my own experiences to work here to help bring this one up. The work was fun and quick on this one. I look forward to the ongoing curatorship of this site.
icandothatdesign.com
Graphic & Site Work: iControl Automation
I am in the process of doing a s site for the folks over at iControl Automation. This is another WordPress site, making use of a premium them with some styling styling customization. We're plugging in form work with one of my favorite plugins, Contact Form 7 and SEO via Google XML Sitemaps.
They also asked for some graphical work, and we quickly (and I mean quick! 15 minutes) came up with this logo:
iControl Automation Corporate Logo