Install ImageMagick with PHP on Debian</h1> <article> <h1>Install ImageMagick with PHP on Debian</h1> <p>Mon, 22 Apr 2013 00:00:00 -0400</p> <p>I've been working on an app lately that involves some image manipulation. Most of the time I use <a href="http://php.net/manual/en/book.image.php">GD</a> for image manipulation but there are a lot of things it just can't do easily.</p> <p>When I run into prolems GD can't solve, I turn to <a href="http://www.imagemagick.org/">ImageMagick</a>.</p> <p>ImageMagick is great, it's powerful and easy-to-use. Unfortunately, it's an enormouse pain to install and set-up.</p> <p>It was far from easy setting it up on Debian / Ubuntu -- so here's how I did it. I hope it helps.</p> <h2>1. Install ImageMagick</h2> <p>You can get ImageMagick and its dependencies from the apt-get repository.</p> <pre rel="Terminal"><code> sudo apt-get update sudo apt-get build-dep imagemagick </code></pre> <h2>2. Get The PHP Dev Package</h2> <p>In order to use PHP to interact with ImageMagick you'll need this package.</p> <pre rel="Terminal"><code> sudo apt-get install php5-dev </code></pre> <h2>3. Get the PECL Imagick Package</h2> <p>Now that you have the PHP Dev tools and ImageMagick, you just need the Imagick package to interface between PHP and ImageMagick.</p> <pre rel="Terminal"><code> pecl install imagick </code></pre> <h2>4. Write Some Sweet PHP / ImageMagick Code</h2> <p>Now you can use a ton of great tools, check out <a href="http://php.net/manual/en/book.imagick.php">a list</a> here!</p> <pre rel="PHP" class="prettyprint"><code> <?php $thumb = new Imagick(); $thumb->readImage('myimage.gif'); $thumb->resizeImage(320,240,Imagick::FILTER_LANCZOS,1); $thumb->writeImage('mythumb.gif'); $thumb->clear(); $thumb->destroy(); ?> </code></pre><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=Rovg_R5W7cw:sO9Rb-cNDvE:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=Rovg_R5W7cw:sO9Rb-cNDvE:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=Rovg_R5W7cw:sO9Rb-cNDvE:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=Rovg_R5W7cw:sO9Rb-cNDvE:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=Rovg_R5W7cw:sO9Rb-cNDvE:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Vim Has Ruined Text Editing For Me</h1> <p>Thu, 18 Apr 2013 00:00:00 -0400</p> <p>I've been using vim as my full time code editor for about 4 months now.</p> <p>It was not an easy journey but it was definitely worthwhile.</p> <p>This is not a tutorial on how or why to use vim. If you're looking for something like that you should check out:</p> <ul> <li><a href="http://yannesposito.com/Scratch/en/blog/Learn-Vim-Progressively/">Learn Vim Progressively</a></li> <li>Run 'vimtutor' in your terminal</li> <li><a href="http://vim.wikia.com/wiki/Vim_Tips_Wiki">Check our the wiki!</a></li> </ul> <h2>Vim Makes Things Easy... Eventually</h2> <p>Starting out using vim is extremely difficult. Eventually though I began to realize that a lot of the things that were tough at first led to better ways to edit text.</p> <p>I'm not going to get too specific but there are a few things that vim offers that I've come to expect whenever I'm editing text. I find myself getting more and more frustrated when I don't have these tools available and it's caused me to use vim for more and more of my non code editing.</p> <h2>Things I Need</h2> <ol> <li>Jump to the beginning of a line with <code>^</code></li> <li>Jump to the end of a line with <code>$</code></li> <li>Delete a word with <code>dw</code></li> <li>Delete text till the end of the line with <code>D</code></li> <li>Cut or Copy an entire line with <code>dd</code> or <code>yy</code></li> <li>Jump to the top of the page with <code>gg</code></li> <li>Jump to the end of the page with <code>G</code></li> <li>Repeat the last task you did with <code>.</code></li> </ol> <h2>My Solution</h2> <p>Lately I've been looking into vim plugins that make doing other text related tasks like email, blog posts and journaling better.</p> <p>It seems like the easiest solution is just to use vim for everything.</p><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=eNBbqSXW43I:IfOHyL3gGdM:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=eNBbqSXW43I:IfOHyL3gGdM:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=eNBbqSXW43I:IfOHyL3gGdM:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=eNBbqSXW43I:IfOHyL3gGdM:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=eNBbqSXW43I:IfOHyL3gGdM:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Terminal-Fu</h1> <p>Wed, 20 Mar 2013 00:00:00 -0400</p> <p>Recently, I started working for <a href="http://www.barracudanetworks.com">Barracuda Networks</a>.</p> <p>I spend <em>a lot</em> of time in the terminal at work now, which is totally awesome.</p> <p>I've been learning some great pro-tips lately and I think they're worth a share!</p> <h2>1. Jump To The Beginning / End of the Line</h2> <p>Say you've got a long line in your terminal</p> <pre><code>Username$: vim /path/to/a/super/long/file.txt</code></pre> <p>Then you realize you mispelled something at the beginning of the line! No worry, just use</p> <p><code>Ctrl + a</code></p> <p>to jump to the beginning of the line and then you can just type</p> <p><code>Ctrl + e</code></p> <p>to jump back to the end!</p> <h2>2. Search Your Terminal History</h2> <p>So often you'll need to re-use a command that you used recently, or maybe you just can't remember how a certain command goes.</p> <p>It's pretty cool that you can just type <code>history</code> like this:</p> <pre><code>Username$: history</code></pre> <p>in the terminal and it will give you a list of the last commands you used.</p> <p>Way cooler, however, is the interactive, fuzzy search through your history by hitting</p> <p><code>Ctrl + r</code></p> <p>Then just start typing something you need from your history and it'll find it for you.</p> <p>Some cool notes on <code>Ctrl + r</code> are that you can:</p> <ul> <li>Hit tab to bring the search result into your current line ( for editing )</li> <li>Hit Ctrl + r again to find another appropriate selection</li> <li>Hit Ctrl + Shift + r to go back if you pass the result you want</li> </ul> <h2>3. Escape Period</h2> <p>Ever find yourself needing to type in the same long string twice? Maybe a file path or a long program name?</p> <p>Commonly I find myself doing something like this:</p> <pre><code>vim ~/.bashrc source ~/.bashrc </code></pre> <p>Imagine the time I waste typing <code>~/.bashrc</code> twice!</p> <p>Here's a cool trick. At anytime in your terminal hit <code>Esc + .</code> ( that's escape period ) and it will automatically paste in the last string you typed. It's not 100% accurate but it's pretty great!</p> <h2>4. Multiplex Like a G™</h2> <p>If you're a terminal champion -- eventually you will run out of screen space. I tried to make it work for a while but eventually you need more than will fit on 2 ( or 3 ) screens!</p> <p>What's the solution?</p> <p>Have tons of terminals inside each terminal!</p> <p>Terminal Multiplexers, namely Screen and Tmux, allow you to have a bunch of terminal sessions inside one terminal ( think internal tabs ) and navigate between them with ease.</p> <p>Both Screen and Tmux are pretty sweet, but screen hasn't been supported in forever so just save yourself some pain and go with tmux. I'm going to write a tmux post soon with install instructions and some basic usage but just know it's sweet for now!</p> <h2>Use the Amazing Tools in Front of You</h2> <p>Last thing. If you're using the terminal a lot, you should really check out all of the amazing tools sitting in front of you -- they'll make your life way better! I recommend reading about and regularly using:</p> <ul> <li>Grep</li> <li>Htop</li> <li>Ack</li> <li>Ps</li> <li>SSH</li> <li>Scp</li> </ul> <p>Just look them up with a quick 'man grep' and start living better!</p><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=7cjl0q7hbG0:_NBnKg7JiTg:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=7cjl0q7hbG0:_NBnKg7JiTg:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=7cjl0q7hbG0:_NBnKg7JiTg:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=7cjl0q7hbG0:_NBnKg7JiTg:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=7cjl0q7hbG0:_NBnKg7JiTg:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Deploying Your Website</h1> <p>Sun, 17 Mar 2013 00:00:00 -0400</p> <p>This weekend I gave a presentation at the <a href="http://www.meetup.com/ann-arbor-php-mysql/">Ann Arbor PHP Meetup</a> on website deployment.</p> <p>We covered three basic methods:</p> <ul> <li>File Transfer Protocol (FTP)</li> <li>Rsync</li> <li>Git</li> </ul> <h2>File Transfer Protocol</h2> <p>Built in the early 70's, File Transfer Protocol ( or FTP ) was designed to transfer files from one host to another over the internet.</p> <p>Today there are many great ( and free ) tools that make FTP the easiest way to move files from your computer to your web server. We took a look at <a href="http://filezilla-project.org/">FileZilla</a> as it's cross-platform and completely free.</p> <p>You can download FileZilla from the companies website and have it installed within minutes. From there, you just need to know the hostname, username and password necessary to access your website.</p> <p>Typically the hostname is ftp.yourwebsite.com and often times the username and password are the same as what you use to log in to your hosting provider's control panel. If you don't know the specific credentials for this, contact your web host for details.</p> <p>Once you're set up, you should see something like this:</p> <div class="img-wrap"></div> <p>On the left is a file broswer for <em>your computer</em> and on the right is the same browser view for <em>your server</em>. From here, you can move files from the left to the right to put them online, or from right to left to download them to your computer.</p> <p>The one major caveat with deploying your website this way is the lack of versioning. It's difficult to tell where the most recent copy of a file is and if two or more people are working on the same project, you will almost definitely run into problems with code being overwritten.</p> <blockquote><p>Example: Let's say you and a coworker need to make changes to the same file, you both start out with a copy of the file locally. You make your changes ( say changing the title ) and when you're finished, you open up FileZilla and push those changes live to your server. Just then, your coworker finishes their changes ( say adding a list to the page ) and they push their changes. Since they never saw your title change, and there is no versioning, their copy of the file will overwrite yours and your changes will be lost.</p></blockquote> <h3>FTP Pros</h3> <ul> <li>Easy to setup</li> <li>Fast</li> </ul> <h3>FTP Cons</h3> <ul> <li>Collisions</li> <li>Data Loss</li> </ul> <h2>Rsync</h2> <p>Created in the late 90's, Rsync is a tool that synchronizes files from one host to another. Note the significant distinction of synchrinization vs. transference. Rsync is very capable of dealing with collisions and collaboration as it will recognize differences between the two locations.</p> <p>Rsync has a great deal of options, and checking out it's man page is definitely worthwhile. This can be done by typing this in your terminal:</p> <pre>man rsync</pre> <p>on a UNIX machine.</p> <p>It's simplest usage, however, can be seen here:</p> <pre> rsync file_to_copy.txt username@yourwebsite.com:/path/to/your/directory #Real life example to move all files in deployment folder to the deploy folder on my host rsync deployment/* root@a2lamp.com:/var/www/a2lamp.com/deploy </pre> <p>The only real issue I have with Rsync deployment is it's lack of versioning. Although you can specify things like overwrite with the newer file, it's hard to see a deployment log with valid data in it unless you write something yourself.</p> <h3>Rsync Pros</h3> <ul> <li>Fast</li> <li>Highly Configurable</li> </ul> <h3>Rsync Cons</h3> <ul> <li>Lack of versioning</li> </ul> <h2>Git Deployment</h2> <p>Released to the world in 2005, git has quickly become the de-facto startard in version control. Git does a great many things including:</p> <ul> <li>Keeps a version log of all changes to your codebase</li> <li>Gracefully handles merges and merge conflicts ( see example above )</li> <li>Allows easy script automation through hooks</li> <li>Lets you peel back your code to any point in time</li> </ul> <p>Git comes pre-installed on Mac's and most linux distributions but is freely available on all operating systems. There are tons of advantages to using Git but most of them fall outside of the scope of this blog post.</p> <p>There are three common methods for deploying code with git.</p> <h3>The push and pull</h3> <p>Perhaps the simplest way to deploy with git is to have copies of your repository both on your computer and on your web server. You can make changes locally, push them to master, and then log into your server and pull them down. I've done this before and it's far superior to FTP but we can make it even better!</p> <h3>The direct push</h3> <p>You can simplify the above process by setting your web server as master and directly pushing your code to deployment with a:</p> <pre>git push origin master</pre> <p>This works well for some projects, but sometimes you need only a subset of your codebase to go public, which brings us to step three.</p> <h3>The bare repo</h3> <p>Git offers these things called bare repositories. They are great for having a central place for your codebase although they don't provide editable files like a full repository. One thing that's commonly done is to set up three copies of your codebase:</p> <ul> <li>A local repository on your computer. This is where you write code.</li> <li>A bare repository on your server but not public facing. This is where you push code.</li> <li>A folder on your web server where you want your public code to go.</li> </ul> <h4>Git hooks</h4> <p>Once you have this setup you can use a git post-recieve hook. These are easy to customize and can be found in your .git/hooks/ directory of your repository. Essentially what you do is write a script that runs whenever code is pushed to the bare repository. This code can grab just the public facing files and send them to your public directory. Here's an example of a post-recieve hook I'm using for this website ( which is running Jekyll ).</p> <pre><code> #Add these commands to the file echo "********************" echo "Post receive hook: Updating website" echo "********************" #Change to working git repository to pull changes from bare repository #cd /var/www/insitedesignlab.com || exit #unset GIT_DIR #git pull origin master #End of commands for post-receive hook GIT_REPO=/home/m1ck3y/insite.git TMP_GIT_CLONE=$HOME/tmp/myrepo PUBLIC_WWW=/var/www/insitedesignlab.com git clone $GIT_REPO $TMP_GIT_CLONE cd $TMP_GIT_CLONE jekyll --no-auto $TMP_GIT_CLONE $PUBLIC_WWW cd $HOME rm -Rf $TMP_GIT_CLONE exit </code></pre> <p>Basically this code just takes my public directory of my codebase ( the code I want the world to see ) and only moves that to my public folder.</p> <h3>Git Pros</h3> <ul> <li>Fast</li> <li>Secure</li> <li>Versioning</li> </ul> <h3>Git Cons</h3> <ul> <li>None, this is seriously an awesome way to deploy!</li> </ul><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=CTsQM_AffDY:YltH5fo5c_E:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=CTsQM_AffDY:YltH5fo5c_E:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=CTsQM_AffDY:YltH5fo5c_E:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=CTsQM_AffDY:YltH5fo5c_E:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=CTsQM_AffDY:YltH5fo5c_E:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Lessons Learned From Startup Weekend</h1> <p>Sun, 03 Feb 2013 00:00:00 -0500</p> <p>This weekend I attended my first <a href="http://annarbor.startupweekend.org/">Startup Weekend</a>.</p> <div class="img-wrap"></div> <p>The event went from Friday at 6pm until the following Sunday at 3:30pm.</p> <p>The days were broken down like this:</p> <h2>Friday</h2> <p>Gather for orientation at 6pm. We checked in and had pizza and drinks in a big meeting room. <a href="http://www.twitter.com/dtrenz">@dtrenz</a> and some other friends from my Meetup group were there and it was fun to catch up while we ate.</p> <p>After we were all done eating, we were brought into the large auditorium for the 'pitchfire' event. Before we got started -- the people at <a href="http://rapt.fm/">Rapt.FM</a> showed us their new KickStarter video and gave a pretty inspiring presentation.</p> <p>Their CEO, Erik Torenberg, gave a really inspiring speech about his experiences with Startup Weekend events. He talked about his first event, driving down to Chicago with some of his friends, and the mistakes they made. He told us that his pitch was well received and he ended up being in charge of his our Startup Group. He talked about how the group completely fell apart and jokingly (I hope) said his team didn't even get the free point from the judges for participation.</p> <p>After that the 'pitchfire' began. Anyone that wanted could get in line and give a 60 second pitch for their startup idea. I think all in all there were 54 pitches on Friday. The ideas largely consisted of:</p> <ul> <li>Mobile Applications</li> <li>Crowdsourcing / Crowdfunding Websites</li> <li>Educational Websites</li> <li>Games</li> </ul> <p>When the pitches were finished, each person who pitched got a piece of paper with their startups name on it and we moved back into the meeting room to vote on our favorites.</p> <p>This is the first thing I think should have been done differently. The people who pitched were awkwardly wandering around the room with their sheet of paper, trying to get votes ( sticky notes that every participant received three of ). There were a few problems with this:</p> <ol> <li>It was really hard to find a specific startup as they wandered around the room.</li> <li>It was hard to talk about your favorites with hopeful pitchers standing over your shoulder.</li> <li>It was pretty awkward when a good 70% of them got no votes.</li> <li>Things got really awkward when <a href="http://www.twitter.com/aiwdesign">@aiwdesign</a> and I ended up some of the last people with all of our votes left.</li> </ol> <p>If I were in charge I would have had all the pitchers stand at the front of the room giving out more details of their startup. Then I would have had a nice web application that allowed for anonymous voting.</p> <p>When the voting was done the group in charge picked the 10 most popular and the rest of the startup ideas were tossed.</p> <p>Then came the second most awkward part of the evening. With the 10 groups remaining the rest of us had to decide which group to join.</p> <p><strong>Everyone wanted mobile developers</strong></p> <p>I think <a href="http://www.twitter.com/dtrenz">@dtrenz</a> was one of the few lucky enough to end up in a group with one.</p> <h3>Our First Big Mistake</h3> <p>We overcommitted ourselves. We found a group that wanted to make a mobile application for the popular game Assassin. We (despite having no experience) volunteered to use PhoneGap to publish a native app that would help facilitate playing the game.</p> <p>We ended up in a group of 9, sitting upstairs talking about the game and how much more fun it would be if we could add:</p> <ul> <li>Automatic target assignment</li> <li>GPS tracking</li> <li>In-app purchases</li> <li>Facebook integration</li> </ul> <h3>Our Second Big Mistake</h3> <p>We didn't understand our Minimum Viable Product. We got it into our heads that the MVP was a functioning mobile application. The <strong>real</strong> MVP was a great presentation and perhaps a bit of a tech demo. Unfortunately it took us until Sunday morning to realize this.</p> <h2>Saturday</h2> <p>Honestly, Saturday was a pretty stressful day for our group. Things kept going wrong and I think we all started to feel the stress of a failing project. We met with a few really cool mentors but overall spent our time poorly and didn't get as much as we should have done.</p> <p>I think a few things I would have done differently are:</p> <ul> <li>Split off from the non-developers. They had a lot of great ideas but ultimately were very distracting.</li> <li>Divied the work up better. Too much time was spent waiting on someone else to finish something.</li> <li>Kept it cool. I tend to get anxious when things aren't going well. The other two devs I was working with did a much better job keeping it together than I did. Thanks you guys!</li> </ul> <p>We had an OK day and I left wishing I can gotten more accomplished.</p> <h2>Sunday</h2> <p>This was the day we really pulled it together. I think we realized how little time we had left before presenting and for the first time really got down to what it was we needed to present.</p> <p>Kelly really stepped it up and made some great looking screenshots for us. Ian did a great job and put together a demo of our game. The rest of our team really pulled it together with some great slides and a killer presentation.</p> <p>In minutes I watched our group turn from failed mobile app to excited entrepreneurs.</p> <p>Our group leader -- Chening -- got up on stage and just knocked it out of the park with a presentation.</p> <p>We nailed second place.</p> <div class="img-wrap"></div><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=ztLm6Z5OBkY:4vd-Bbao3UY:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=ztLm6Z5OBkY:4vd-Bbao3UY:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=ztLm6Z5OBkY:4vd-Bbao3UY:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=ztLm6Z5OBkY:4vd-Bbao3UY:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=ztLm6Z5OBkY:4vd-Bbao3UY:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>My Git Cheat Sheet</h1> <p>Wed, 09 Jan 2013 00:00:00 -0500</p> <p>Hopefully this isn't too confusing to everyone. I've been learning a lot about git lately and have decided to use this post as a dumping ground for all the cool git tricks I pick up along the way.</p> <p>Want to add a trick or have a better way? Just leave it in the comments.</p> <h2>To Add all 'modified' files and commit at the same time.</h2> <pre> git commit -a -m 'Commit message' </pre> <h2>To Undo a commit and put committed files back in staging</h2> <pre> git reset --soft HEAD^ </pre> <h2>To unstage a file</h2> <pre> git reset HEAD filename </pre> <h2>Blow away all changes since last commit</h2> <pre> git checkout -- filename </pre> <h2>To add a file ( or files ) to the last commit</h2> <pre> git add filename git commit --amend -m 'new commit message' </pre> <h2>Blow away the last commit entirely</h2> <pre> git reset --hard HEAD^ </pre> <h2>Article about not having to enter username / password everytime</h2> <pre> https://help.github.com/articles/set-up-git </pre><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=LiaeRe4bkY4:gFBKzB3ModQ:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=LiaeRe4bkY4:gFBKzB3ModQ:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=LiaeRe4bkY4:gFBKzB3ModQ:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=LiaeRe4bkY4:gFBKzB3ModQ:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=LiaeRe4bkY4:gFBKzB3ModQ:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Choosing A Text Editor</h1> <p>Sun, 06 Jan 2013 00:00:00 -0500</p> <div class="img-wrap"></div> <h2>It Doesn't Matter</h2> <p>Bet you weren't expecting that, but it's really the truth.</p> <p>As programmers, we use text editors to write code. A good text editor will help you do that more powerfully and efficiently. The thing is, 90% of text editors on the market today do both of those things magnificently.</p> <p>What really matters it that you identify the features you need in a modern text editor and then choose any of the dozens of editors that offer those features.</p> <h2>Must Have Features</h2> <ol> <li>File Browser</li> <li>Syntax Highlighting</li> <li>Automatic Indentation</li> <li>Line Numbering</li> <li>Search</li> <li>Find and Replace</li> <li>Fun Plugins</li> </ol> <p>This is what I've come up with so far as my must-haves. 'Fun Plugins' is a bit vague but I just mean your editor should have a good developer community adding great features and keeping up with new ones.</p> <h2>My Suggestions</h2> <p>I think you should try as many editors as possible until you find one that just clicks with you. Also, I think trying a lot of editors is good because you never know when you're going to find yourself in a situation that requires the use of a particular editor.</p> <p>That being said, I think you should try:</p> <ul> <li>vim</li> <li>emacs</li> <li>Sublime Text 2</li> <li>Netbeans</li> <li>Gedit</li> <li>TextMate</li> </ul> <h2>Try Them All</h2> <p>I find it quite enjoyable to play around with multiple editors. They each offer something unique and I think you'll find yourself with multiple favorites.</p> <p>Any other editor suggestions? Leave 'em in the comments!</p><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=6kuBSQOpszo:k66dL422tUk:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=6kuBSQOpszo:k66dL422tUk:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=6kuBSQOpszo:k66dL422tUk:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=6kuBSQOpszo:k66dL422tUk:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=6kuBSQOpszo:k66dL422tUk:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Wrapping Up 2012</h1> <p>Wed, 02 Jan 2013 00:00:00 -0500</p> <p>It's been a crazy year.</p> <p>I know January is a bit late for an end of the year wrap-up but the end of the year came and went so quickly.</p> <p>Last year, I wrote <a href="/2011-review-a-thank-you/">an article</a> wrapping up the first year of this blog and highlighting some goals for 2012. Looking back on my goals I'm surprised both at how few I achieved as well as how much my priorities have shifted.</p> <h2>Goals For 2012</h2> <p>My goals for this past year were to:</p> <ul> <li>Write an e-book and give it away to my readers. Preferably something on Search Engine Optimization or Online Marketing.</li> <li>Write guest posts for at least 5 blogs more popular than mine.</li> <li>Make friends with other starting bloggers, it gets lonely sometimes :)</li> <li>Write at least 100 articles. ( Twice as many as this year )</li> <li>Start posting video screencasts as an alternative way to deliver information.</li> </ul> <p><strong>Publish an Ebook</strong> - This has fallen completely off my radar. I like the idea of publishing work longer than a blog post but I'm not so interested in SEO and Internet Marketing right now.</p> <p><strong>Guest Posts</strong> - This still interests me, but I wrote a whopping 0 guest posts last year.</p> <p><strong>Make Friends</strong> - This has proven quite successful! I've become involved ( now teaching ) at my local <a href="http://www.meetup.com/ann-arbor-php-mysql/">PHP Meetup Group</a>.</p> <p><strong>Write 100 Posts</strong> - I didn't even make sixty. Still, more than last year...</p> <p><strong>Start with Screencasts</strong> - Still on the to-do list.</p> <p>Pretty depressing at first glance, but I've accomplished quite a bit in other areas.</p> <h2>Accomplishments In 2012</h2> <p>All in all this has been a pretty incredible year. In January I started a paid internship with a <a href="http://wojodesign.com/">great web design firm</a> which helped push my skills to the next level. Working for Wojo Design really helped my figure out what I want to do for my career ( despite it being different from what I was doing for them ).</p> <h3>PHP</h3> <p>I really thought that front-end design and WordPress were the tools for me. Then, this year, I started to develop PHP applications pretty heavily and fell in love. Back-end development has become my obsession. I've built Social Networks, Photo Sharing Applications, Blog's, Content Management Systems and I'm just getting started!</p> <h3>New Technologies</h3> <p>I recently migrated both my <a href="http://www.jonkuperman.com/">personal blog</a> as well as my company blog from WordPress to <a href="/getting-started-with-jekyll/">Jekyll</a>. It's been a really fun project and the results are amazing!</p> <h3>PHP Meetup Group</h3> <p>Our local <a href="http://www.meetup.com/ann-arbor-php-mysql/">PHP Meetup Group</a> has gained a lot of traction this year. It has become one of the things I most look forward to and I hope it keeps going at its current pace.</p> <h3>A Job</h3> <p>In a strange twist of fate, I landed ( my first ) full-time job at the end of this year. I've started working for a <a href="http://www.medhub.com/">Medical Software</a> company and so far it's pretty cool.</p> <h2>Goals For 2013</h2> <p>I'm going to try and outline a few general goals for the upcoming year. As long as I learn a lot in my field and have a ton of fun I'll be satisfied but having a written list of goals seems like the right thing to do.</p> <ul> <li>Gain proficiency in PHP, JavaScript, Git, and CSS.</li> <li>Write more.</li> <li>Teach More.</li> <li>Actually start making screencasts.</li> </ul> <h2>Conclusion</h2> <p>Thanks to everyone who reads and leaves comments on this blog. It's really become a huge part of my life and I can't tell you how much readership and feedback means to me!</p> <p>And now, the ubiquitous end of the year post is over. Thanks for bearing with me!</p><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=u52KX7RdH-g:5Z52qykuSGI:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=u52KX7RdH-g:5Z52qykuSGI:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=u52KX7RdH-g:5Z52qykuSGI:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=u52KX7RdH-g:5Z52qykuSGI:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=u52KX7RdH-g:5Z52qykuSGI:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Getting Started With Jekyll</h1> <p>Tue, 01 Jan 2013 00:00:00 -0500</p> <p>I've been really interested in checking out <a href="http://jekyllrb.com/">Jekyll</a> for a while now.</p> <p>According to their website:</p> <blockquote><p>Jekyll is a simple, blog aware, static site generator.</p></blockquote> <p>Yeah. That didn't clear things up for me either.</p> <p>Basically, Jekyll is a great little ruby program that allows you to make a blog with all the bells and whistles you're used to, and then export the entire thing into fast, secure, cachable HTML files.</p> <h1>Getting Started</h1> <p>I found the actual Jekyll install a bit confusing. So I started with this <a href="https://github.com/danielmcgraw/Jekyll-Base">Jekyll Base</a> project that Daniel McGraw has been working on.</p> <p>You should see something like this after you download it:</p> <pre rel="File Structure"><code> | _layouts | _posts | README.md | _config.yml | index.html </code></pre> <p>And that's it.</p> <p>Download that project from github and stash it in a folder. Next we need to install Jekyll.</p> <h2>Installation</h2> <p>Fire up that terminal ( I know it can be scary but this is pretty painless! )</p> <pre> sudo gem install jekyll </pre> <p>Assuming you already have ruby installed that should take care of that. Otherwise you might have to install ruby manually but that's not for this tutorial.</p> <p>Next step, and this is totally optional is to install RDiscount so we can use Markdown to make blog posts.</p> <pre> sudo gem install rdiscount </pre> <p>We're good to go!</p> <h2>The Setup</h2> <p>Let's move to that folder where you put Daniel's Jekyll Base.</p> <p>Pop open your terminal and change directory to that folder.</p> <pre> cd ~/path/to/that/folder </pre> <p>Then type:</p> <pre> jekyll --server </pre> <p>In order for Jekyll to update files as you edit, the terminal running jekyll --server either needs to be left on or turned on after each change and before you expect to see anything in the browser.</p> <p>Then open up your favorite browser and navigation to:</p> <p>http://localhost:4000</p> <p>and there you have it!</p> <p>If you look back in your file directory, you'll see that Jekyll added some more files and folders. For more information on what those are and why they're important, check out Daniel's post <a href="http://danielmcgraw.com/2011/04/18/The-Ultimate-Guide-To-Getting-Started-With-Jekyll-Part-2/">on his personal blog</a>. We're just going to jump right in!</p> <h2>Writing Your First Post</h2> <p>Open up your favorite text editor and use it to open _posts/1985-10-26-Test-Post.md. You should see something like this:</p> <pre rel="Markdown"><code> --- layout: post title: Test Post --- This is a test post writen in markdown. To learn more about markdown check out the [documentation](http://daringfireball.net/projects/markdown/) on [Daring Fireball](http://daringfireball.net/). </code></pre> <p>Like the post says, if you want more information on Markdown, check out <a href="http://daringfireball.net/projects/markdown/">Daring Fireball</a></p> <p>Go ahead and get your hands dirty! Use that Daring Fireball post to figure out the syntax of Markdown. Feel free to just use regular HTML if you prefer although I think you'll find Markdown very elegant. If you want to change the 'date' of the post, just change the date in the filename. When you're ready to see your post, just head over to the browser and refresh.</p> <h2>Deployment</h2> <p>I'm going to do a whole series on Jekyll deployment. For now, just know that you can take the entire contents of _site and stick them on the web via FTP. They should be all good to go.</p> <h2>Common Pitfalls</h2> <ul> <li>Remember that jekyll --server both compiles all your Jekyll code into HTML and is needed for local viewing.</li> <li>Before trying anything tricky, check if there is already a <a href="https://github.com/mojombo/jekyll/wiki/Plugins">plugin</a> for what you're attempting.</li> <li>Make backups before trying to export your current blog format to Jekyll ( there are good tools but it can get messy ).</li> </ul> <p>Also, if you're moving from a more robust platform like WordPress here are some things you'll need to figure out that Jekyll doesn't offer out of the box.</p> <ul> <li>Custom 404 page ( use htaccess )</li> <li>sitemap ( Jekyll plugin )</li> <li>RSS Feed ( Jekyll plugin )</li> <li>Pretty Permalinks ( edit _config.yml )</li> </ul> <h2>Good Luck Out There</h2> <p>Let me know in the comments if any of this was unclear or just isn't working. I'm planning on doing <strong>a lot</strong> more posts on Jekyll so check back soon!</p><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=zMq7zEQdBbI:s_4Znahal_c:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=zMq7zEQdBbI:s_4Znahal_c:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=zMq7zEQdBbI:s_4Znahal_c:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=zMq7zEQdBbI:s_4Znahal_c:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=zMq7zEQdBbI:s_4Znahal_c:-BTjWOF_DHI"></img></a> </div> </article> <article> <h1>Passing Parameters in Javascript onClick Event</h1> <p>Thu, 13 Dec 2012 00:00:00 -0500</p> <p>I ran into a problem today.</p> <p>I was trying to generate a bunch of input buttons with JavaScript and have each of them do something unique onClick.</p> <h2>The Wrong Way</h2> <pre rel="JavaScript" class="prettyprint"><code> <script type="text/javascript"> var temp; var myArr = new Array(); myArr[0] = "Peter"; myArr[1] = "Paul"; myArr[2] = "Tony"; myArr[3] = "Adam"; function display(name) { alert(name); } for(var i = 0; i < 4; i ++) { temp = myArr[i]; document.write('<input type="button" onclick="display(temp)" value="Display">'); } </script> </code></pre> <h3>The Problem</h3> <p>The issue is in JavaScript global variable. Since temp is a global variable, the onclick trigger sends the content of temp after the loop is all finished. Since Adam is the last value to be stored in temp, that's what all buttons alert. The trick is to use input name as a non-global and then pass the whole input tag to the function like so:</p> <h2>The Right Way</h2> <pre rel="JavaScript" class="prettyprint"><code> <script type="text/javascript"> var myArr = new Array(); myArr[0] = "Peter"; myArr[1] = "Paul"; myArr[2] = "Tony"; myArr[3] = "Adam"; function display(object) { alert(object.name); } for(var i = 0; i < 4; i ++) { document.write('<input type="button" onclick="display(this)" name="'+myArr[i]+'" value="'+myArr[i]+'">'); } </script> </code></pre><div class="feedflare"> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=jR-wEEUcc58:zOUO09lUgvw:yIl2AUoC8zA"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=jR-wEEUcc58:zOUO09lUgvw:V_sGLiPBpWU"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=jR-wEEUcc58:zOUO09lUgvw:qj6IDK7rITs"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=jR-wEEUcc58:zOUO09lUgvw:gIN9vFwOqvQ"></img></a> <a href="http://feeds.feedburner.com/~ff/insitedesignlab?a=jR-wEEUcc58:zOUO09lUgvw:-BTjWOF_DHI"></img></a> </div> </article> </main></body></html>