How to “Fake It Until You Make It”

Quick background: I spoke at the meetup DC Tech earlier this week, which is a monthly event that rivals the NY Tech scene with more than 1000 attendees. My brief talk was about how you can “fake it until you make it” when learning how to code. It was so well received, and so many people requested the presentation notes, I thought I would share a special screencast version of the presentation created just for this blog.

Also, the sound on this video seems loud to me, so you may want to turn down your volume a bit before watching.

Transcript of this video:

I am not a developer. No one would ever hire me as an engineer. But I do love to tinker.

I believe that anyone can build a site and in the process, begin to learn how to code. And I’m going to share with you how I’ve done that today.

For many of you, this will seem too simplistic, but I wanted to show the non-techies out there how easy it is to create a minimum viable product with little to no knowledge of code.

Last year, I tested several of my start-up ideas. One of the last ideas I explored was for a site called Design Pluck – a sort of Pinterest meets Craigslist. The idea was to help design enthusiasts discover design one-of-a-finds in their local neighborhoods. It’s not something I’m pursuing, so feel free to steal the idea. It’s gotten great feedback.

I used three different approaches to “fake” my way into building Design Pluck with only rudimentary knowledge of code:

1. The Search Approach.

I used Google to find a pre-made theme that I could just download and install on my WordPress site. WordPress only takes a quick ten minutes to set up and allows you to change and interact with your site without looking at or touching the code.

Now if you’re not familiar, WordPress themes are completely useable out-of-the-box, but I specifically searched for a theme that was fairly plain and simple, so that I could treat it more like a paint-by-number canvas and customize it the way I wanted.

Most of the differences between the original theme and my site are purely stylistic, or what the web world calls CSS (Cascading Style Sheets). If you had a set of boxes in your living room, you could fairly easy paint them different colors, and that’s exactly what I did.

What was once mostly white and pink on the original theme is now mostly gray and blue on Design Pluck.

CSS isn’t difficult. You just replace one color code with another, and like switching out lipsticks, you’ve just given your site a makeover.

2. The Ctrl-C, Ctrl-V approach (i.e., Copy-And-Paste).

When I wanted to have the search bar functionality follow the user as they scrolled down the site, similar to how Pinterest’s navigation bar follows you, I found a Java code snippet via search that I copied and pasted into the site’s documents. And let me back up and say, I had no idea what I was doing or where to put this Java snippet. I just tried many different places until it worked.

The lesson here is that you’re allowed to experiment. You won’t break anything. A voice in your head may tell you, “no, don’t touch that!” but you can and you should. Your site is your sandbox.

(Just make sure to copy or back-up the existing code before you do anything so you can go back and reference the original if need be.)

So as you’re browsing, the Java snippet allows the search bar to follow you, so when get overwhelmed and decide there are too many choices and you only want to see red items, you can tell the search bar just show me red items in my neighborhood, and voila!

Now, the Java snippet allowed me to have this search bar follow the user, but it didn’t create the custom search in the first place. The way I created my custom search was through my third and final approach.

3. The Download/Upload Approach.

It’s very easy to find different plugins that again, similar to themes, allow you to create the functionality you want on your site out-of-the-box. You simply download them from the many repositories out there, and upload them to your site.

Plugins are modules that allow you to completely bypass the overwhelming process of coding everything from scratch.

Like legos, plugins are out-of-the-box blocks that play nicely with others, and as you fit more and more together, you can create something very complex and very powerful.

The plugins on the Design Pluck site include the custom search boxes, the sign-up form, custom fields, custom posts, the like button, which allows users to like their favorites which will then show up on a favorites page – also a plugin – location maps, an email plugin and more.

All of that functionality is as easy as clicking download, and then clicking upload.

Learn to Code
Of course, eventually you will hit a wall, and will want to do more than these three approaches will allow. In the process, you’ll begin to learn how to code. For this site, I learned a ton about PHP, a bit about JQuery Masonry, and a whole lot more.

I ended up writing some simple code, but what I’m most proud of is that I wrote several of my first functions simply by mirroring  the code I saw in other places.

Just one example of those functions is on the individual store pages. I wanted a store’s products to show up below their store information, and wrote a function to make that happen.

So if you click on a store page like Miss Pixies on 14th St, you would be able to see their store information at the top of the page, and at the bottom, you’d find all of their current inventory to shop.

To you, it may seem like a minor win, but to me, when I figured this out, it felt like I had literally changed the world.

I hope you enjoy changing the world in your own way with these approaches.

Have you ever used any “fake-it” approaches in building a website, or just in business and life?