5 Free Tools I Use for Web Development on Mac

Sometimes it’s hard finding the right tools to get started with as a web developer.  Here’s a short list of tools I use on my Mac, though the majority of them aren’t Mac specific:

MAMP – stands for Mac + Apache + MySql + PHP.  The standard version, which is free, gives you everything you need to run a local development server — and it’s easy to set up and run!

Mockingbird – A web-based wireframing service.  For those of you who don’t know, wireframing is what you do before you build a mock-up.  Allows you to build a general framework with placeholders for pictures, videos, and other design elements; also allows you to type out all the text, links, etc. that you plan on putting in your website.  Extremely useful for building a website quickly and efficiently.

Firebug – This is basically the reason I use Firefox in development.  Firebug allows you to inspect elements of a website (especially useful while you’re developing one) by putting your cursor over the actual part.  It’s basically like shining a flashlight on a certain part of a website to see the code that makes it work.

Cyberduck – Cyberduck is a free FTP client for Mac. Slick interface and integration with the OS, and, of course, allows you to upload files to your off-site server.

Forrst – Currently in beta, Forrst is a great place for web designers and developers to share the stuff they’re currently working on and critique others’ work.  Very useful when you get closer to finishing a design up and want to crowd test your work.

  • Share/Bookmark

Post Information

Published on April 20th, 2010 by Jay Margalus

Tagged as , , ,

Sorted under web development

View Comments

Gmail Accounts and Import with Mac Mail

I have 6 different e-mail accounts filtering into my Gmail box through the “Accounts and Import” feature. This is really handy for me. I own one company, help run a non-profit, and run a blog. I like being able to access e-mails for all of these ventures in one area, read them, and respond from the address they were sent to (automatically).

On the other hand, I also like having offline access to my mail, and generally like the Mac Mail program’s design interface more than Gmail’s (sidenote: I know I can get offline access to my Gmail account through Gears).

My Problem: I needed a solution to integrate Gmail and Mail, while not losing the functionality of my integrated accounts.  This would give me the best of both worlds, with online and offline e-mail access.

The Rub: On setting up my Gmail account to integrate with Mail, I realized that while I’d be receiving all imported e-mail from my Gmail box, I wouldn’t be able to reply to them using the appropriate e-mail address (i.e. mail sent to jay@thisotherserver.com would get a reply from jaysemail@gmail.com).  Testing confirmed this — Mail does not realize that the e-mails are from different accounts.  Additionally, I couldn’t simply add the imported e-mail addresses to Mail — I’d end up receiving duplicates (i.e. Gmail would be forwarding me the same “imported e-mails” that Mail had already received).

The Solution: A little-known feature (at least to me) in Mail.  In Mail, go to Preferences>Accounts and select the Gmail account you should’ve already set up.  Under the E-mail Address field in Account Information, simply add the e-mail addresses that you use in Gmail.  Be sure to comma separate them.  That’s it!  Now Mail will respond to e-mails, by default, with whatever address they were sent to.

Click for a larger image

Now I have the best of both worlds: Access to e-mail from several different addresses in one spot, anywhere I can get internet access, and offline from my Mac.  Neat, huh?

  • Share/Bookmark

Post Information

Published on March 30th, 2010 by Jay Margalus

Tagged as , ,

Sorted under Computers

View Comments

Bad Experience at Gas City

This probably seems like a ridiculous post, but the experience I had at Gas City today was almost comical.  After I swiped my credit card, I went through a Monty Python-esque set of bridge crossing questions before I was able to even select the grade of gas I wanted.  The questions:

Do you have a gold card? (Yes/No) No.

Would you like a gold card? (Yes/No) No.

Would you like a car wash? (Yes/No) No.

Would you like a receipt? (Yes/No) No.

What is your Zip code? XXXXX

This is a perfect example of a company that just doesn’t get it.  You don’t make the customer jump through hoops before they buy your product; it’s annoying, and makes them think twice about using you again.  Here’s a few suggestions that cut down the questions, and places the unnecessary ones after the transaction:

1) Receipt and car wash questions don’t need to be done before I select my gasoline. Maybe there’s some research out there that shows that people buy more car washes if they have to answer the question, but it’s just annoying.  Put these questions after I make my purchase, and if I don’t answer them, then I obviously don’t care.

2) Trying to sell me your credit card at the pump was a put-off, but if you have to ask a customer to get a gold card at the pump, and it can’t be done after the transaction, then why not condense the two questions into one?  Would you like a gold card? (Yes/Already Have One) or (Yes/Already Do) or (Yes/No).

3) Don’t ask for my Zip.  I honestly don’t see how this protects my credit card, as my name’s on it and my information is freely available online.  You’re just wasting my time.

Now you have a transaction that goes like this:

Would you like a gold card? (Yes/No)

I buy my gas

Would you like a car wash? (Yes/No)

Would you like a receipt? (Yes/No)

Transaction takes less time, customer does not become frustrated, leaves happier, and comes back again because of the good experience.

  • Share/Bookmark

Post Information

Published on March 25th, 2010 by Jay Margalus

Tagged as ,

Sorted under Random

View Comments

Get the_post_thumbnail direct path for Wordpress

I wrote this fairly simple code snippet to extract the direct path of a post thumbnail from the_post_thumbnail in Wordpress. This must go inside The Loop.

1
2
3
4
5
<?php
	$thumbnail_id=get_the_post_thumbnail($post->ID);
	preg_match ('/src="(.*)" class/',$thumbnail_id,$link);
	echo $link[1];
?>
  • Share/Bookmark

Post Information

Published on March 19th, 2010 by Jay Margalus

Tagged as , ,

Sorted under Wordpress

View Comments

Removing the < p > tag from the_excerpt in Wordpress

I couldn’t find anyone else who had put this online yet, but I thought it might be useful. This should take out all instances of the paragraph tag in the_excerpt for you in Wordpress.

1
2
3
4
5
<?php 
	$x=get_the_excerpt();
	preg_replace ('<p>','',$x);
	echo $x;
?>
  • Share/Bookmark

Post Information

Published on March 16th, 2010 by Jay Margalus

Tagged as , ,

Sorted under Wordpress

View Comments

Creating a Dynamic Navigation Menu for Wordpress

I wrote a dynamic navigation menu for Wordpress.  This puts any Wordpress “Page” name in the linkbar, and sets a background color to the link if it corresponds with the current page using the CSS class “onlink” while ignoring the class “nolink”. Be sure to give the “onlink” class a background color in your CSS.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
	$menu = get_pages('parent=0');
	$dir = get_bloginfo('url');
			if (is_home())
		echo "<li class='onlink'><a href='" . $dir . "'>Home</a></li>";
	else
		echo "<li class='nolink'><a href='" . $dir . "'>Home</a></li>";
			foreach ($menu as $pages) {
		$linktitle = $pages->post_title;
		$link = $pages->post_name;
		if (is_page($link))
			echo "<li class='onlink'><a href='" . $dir . "/" . $link . "'>" . $linktitle . " </a></li>";
		else
			echo "<li class='nolink'><a href='" . $dir . "/" . $link . "/'>" . $linktitle . "</a></li>";
	}
?>
  • Share/Bookmark

Post Information

Published on March 3rd, 2010 by Jay Margalus

Tagged as ,

Sorted under Wordpress

View Comments

What is a Hackerspace?

This is a question I’ve been asking myself a lot lately.  I did a podcast interview on Evadot today for Hackerspaces in Space with my friend Greg.  During the interview the host, Michael Doornbos, asked us this question: “what is a hackerspace?”  We gave Michael several half-answers about what we do at a hackerspace, but in the end, came up a little short of a real explanation.

The problem, I think, is that we were trying to explain what hackerspaces do, when we should have been talking about the people who join hackerspaces.  That is, hackerspaces are defined not by what they do, but by the people they are comprised of and the ideals they embody.  I’d like to borrow some language from the free culture movement:

A free culture is one where all members are free to participate in its transmission and evolution, without artificial limits on who can participate or in what way. The free culture movement seeks to develop this culture by promoting four things:

  • creativity and innovation;
  • communication and free expression;
  • public access to knowledge;
  • and citizens’ civil liberties.

I think that’s pretty spot on.  Hackerspaces are communities of people who seek ownership of their culture through creation.  The key is, when someone asks you what sort of things a hackerspace builds, the answer is basically: anything.  We build anything.  The idea is to build, and in doing so, to take back a little piece of culture from McDonalds or Walmart every time.  How refreshing, especially in a world of credit cards, the “toss it and buy a new one when it’s broken” attitude, and mass production.

  • Share/Bookmark

Post Information

Published on February 23rd, 2010 by Jay Margalus

Tagged as , , ,

Sorted under Random

View Comments

Facebook, Google Buzz, and the Problem with Social Media Today

With Google jumping deeper into the social platform arena, and Facebook into e-mail, news organizations have begun to talk about, but don’t seem to understand, what’s going on between the two tech companies.  Among some of the more troubling themes emerging from this discourse, we hear buzz words like “game changing”, “cutting edge”, and “second coming of Christ”.  Okay, maybe not the last one.

You’d get the impression from reading a lot of these articles that something major has happened in the past couple weeks.   In reality, nothing could be further from the truth.  Let’s take a look at two emerging themes:

Google Buzz/Facebook e-mail are game changers. No, they’re not.  Insofar as you consider each company’s business model, or the state of social platforms for at least the past five years, nothing’s changed.  Platforms similar to Google Buzz were around well before it came out, and Facebook isn’t going to change e-mail.  What each company is trying to do is bring additional functionality — already offered elsewhere — into their products to keep users inside their service net.  The reason?  Both companies are in the business of taking your information and using it for targeted ads.  Less users, or less eyeball time from users, leads to less information.

This is a major problem with tech companies today.  They aren’t creating anything, but rather, are either feeding off or ripping off services that other companies already provide.  Why?  Because, in the end, they’re all in the same line of business: data. They’ll continue to consolidate existing services under their umbrella to get as much of that commodity from you as possible.

Google/Facebook are the future of social. Let’s hope not.  The predominant business model for social networks right now offers free service in exchange for a user’s information — a drastic change from the paid-for services model normally used by businesses.  The differences between the two models creates an excellent argument for a paid social network.  Let’s take a look at the existing model:

Social networks are dominated by companies that make their money off data collection for targeted advertising.  They’re looking for the largest user base they can get, and seek that by growing continuously and at the fastest rate possible (remember, more users means more eyeballs and more money).  On top of this, free services inherently have a low entry level — you don’t pay anything.  This creates customers who can participate in business transactions freely and without monetary risk, and companies with unchecked growth. In the end, this gives you a bloated community with no identity, which is no community at all.

A paid model: Unlike the free service model implemented by Facebook and Twitter that relies on fast paced growth to reach profitability sooner, services you pay for monetarily allow a company to grow at a sustainable rate, be selective with their customers, and provide a better product.  Customers, in turn, are more cautious of joining the service because it has an immediate cost.  A social network that implemented this model would inherently have a better community, because it would be in a better position to offer the things that create one, namely: additional boundaries before entry, slow growth, and a medium catering specifically to social networking without the restrictions that come along with data collection.


Fin. The value of one paying customer is far greater than that of a customer giving you data.  The problem with social media today is that each user, each customer, has less value than that of a traditional paying customer.  Because of this, companies need more customers to be successful, and they create more uses for their products to get those customers.  But more people, and additional functionality, don’t create a community or a good social networking tool.  A well made tool, focused on networking — not data — does.  The state of social networks today just doesn’t allow for that.

  • Share/Bookmark

Post Information

Published on February 11th, 2010 by Jay Margalus

Tagged as , ,

Sorted under Featured

View Comments

What were they thinking?

Insert implicit pornographic reference here

Posted via web from Jay’s Posterous

  • Share/Bookmark

Post Information

Published on January 19th, 2010 by Jay Margalus

Sorted under Random

View Comments

Getting Ruby on Rails Working with MAMP (Mac)

I just spent about two hours trying to set up Ruby on Rails on my Mac with MAMP. Here’s a quick and dirty of how to do it for those of you who don’t feel like going crazy.

Follow the installation steps for RoR here: http://wiki.rubyonrails.org/getting-started/installation/mac

Edit your MAMP MySQL installation using the steps provided on this website: http://boonedocks.net/mike/archives/175-MAMP-and-the-Ruby-MySQL-Gem.html

After you’ve created your first Rails project, locate it on your computer, then go to config/database.yml and enter the following:

development:
 adapter: mysql
 database: XXX_dev
 username: root
 password: root
 timeout: 5000
 socket: /Applications/MAMP/tmp/mysql/mysql.sock

# Warning: The database defined as "test" will be erased and
# re-generated from your development database when you run "rake".
# Do not set this db to the same as development or production.
test:
 adapter: mysql
 database: XXX_test
 username: root
 password: root
 timeout: 5000
 socket: /Applications/MAMP/tmp/mysql/mysql.sock

production:
 adapter: mysql
 database: XXX
 username: root
 password: root
 timeout: 5000
 socket: /Applications/MAMP/tmp/mysql/mysql.sock

Finally, follow the steps provided here to create your MySQL DB for the project.

Good luck.

  • Share/Bookmark

Post Information

Published on January 7th, 2010 by Jay Margalus

Sorted under Computers

View Comments