Uploading static assets (CSS/JS) to S3 for CloudFront CDN

For a new Backbone.js + Flask project I’m using grunt + grunt-contrib, RequireJS’s r.js, Flask-Assets / webassets for static file (LESS/CSS, JS) compilation. But I needed a good way to get my nicely optimized static files onto a CDN and serving proper HTTP headers.

Using the excellent s3cmd tool, here’s what I came up with.

This example will break for browsers/proxies that don’t support gzip, but this is fine for my needs. Any other solution would either require a custom origin web server or writing different filenames in HTML depending on the request coming in. But since I want to use S3 as my origin this is the easiest/simplest solution.

Since all assets are “built” with a md5 version number hash in the file name, I want far futures headers to cache permanently.

Add A Comment

PhilFreo.com v3 (and past versions)

I setup my first personal webpage (philfreo.com) in 2004 when I was in high school. It’s had some server-side includes and a tiny amount of logic written in ASP. It looked like this:

I redesigned it once in 2006 during my Yahoo! internship, and it looked like this:

And there my website sat from 2006 until 2012. That’s forever in internet years!

So here we are in the summer of 2012 – time for a redesign! Nothing too fancy, just clean up the styles to be more modern and representative of the current web. It should tell people about the 2012 Phil Freo rather than the high school or college version of me. It should no longer focused on my freelance website design (where I once dominated SEO for terms like “gainesville web design” and “jacksonville web design”) and now more focused on my work with startups, modern full-stack web development, and my blog.

You’re probably looking at the new site now, but for archival purposes, here are some screenshots:

Homepage:

Blog article page:

Add A Comment

How to upgrade MacPorts to OS X 10.8 Mountain Lion

This weekend I upgraded OS X from Lion to Mountain Lion. Documenting steps I had to do to get all my development environments working with MacPorts.

Steps:

  • First installed the latest XCode via the Mac App Store
  • Downloaded/Installed Mountain Lion
  • Launched XCode one to so I could agree to license, etc.
  • MacPorts also requires the XCode Command Line tools which are a separate install. Inside XCode preferences: “Instead, they can be installed optionally using the Components tab of the Downloads preferences panel as shown in” (source)
  • Had to run “sudo xcodebuild -license” after getting “Error: org.macports.build for port libunwind-headers returned: command execution failed”. Run this, scroll down, type agree.
  • sudo port selfupdate
  • sudo port upgrade outdated
  • Everything finished and worked properly except MongoDB. Currently there’s a bug and the easiest/best work around seems to be just manually installing the latest stable OS X version from http://www.mongodb.org/downloads and manually copying the binaries into /opt/local

Comments (4)

Why is this so hard… Apple

It’s 2012 and the web and mobile devices are capable of amazing things, which is why it’s so surprising to me that some of the simplest things are still so hard.

I’ve got the latest iPhone with its 8MP camera and HD video camera, complete with iOS 5 and I pay for extra storage on iCloud. Apple’s supposed to be the best at designing simple user experiences across hardware and software – and I believe they are.

So when I want to take a bunch of photos and videos that I took from my iPhone and share those with some family members, it should be simple right?

Read the rest of this entry »

Comments (28)

Two Years at Quizlet

The last two years (2010-2011) I spent working at Quizlet were an incredible learning experience.

Like I did in Jan 2010, I wanted to reflect on some of the technologies I learned and things I did over the last 2 years…

Read the rest of this entry »

Add A Comment

Behind the scenes look at my work at Quizlet

I just wrote a pretty in-depth article on the Quizlet Blog: “How We Do Product Development at Quizlet: An Inside Look at the Making of Speller” which describes the process of how Andrew and I created “Speller”, the latest study mode on Quizlet.

…a behind the scenes look at how we created Speller, our engineering challenges and processes, and how we obsessed over the user experience and the educational experience.

Includes some technical details of how we programmed it (mostly JavaScript), the text-to-speech, development process and usability testing, and lots of screenshots of the different iterations we did in order to get the UI right.

It’s a little long, but hopefully worth the read!

Add A Comment

Wedding Website & Invitations

I launched my first new website in a very long time, and also designed some matching print work. This time the client was tougher than usual. But she was also cuter than usual so it was worth it…

Read the rest of this entry »

Add A Comment

Honestly.com – Not acting so honestly

I hate to have my first blog post after over a year be a negative one, but I feel like these guys need calling out.

I recently received an email from a company, Honestly.com, that got me quite curious. I looked up the website to see what it was all about, and I saw that they are a way of reviewing former/current coworkers and business partners. Their tag lines are “Get the inside scoop on your potential boss, coworkers, or business partners.” and “Candid community-created reviews of business professionals.” I sort of expected them to be a more extensive version of CubeDuel (which was quite fun for the first few minutes), but with full reviews rather than just ratings…

Read the rest of this entry »

Comments (23)

New Job with Startup: Old School Industries

I just accepted a full-time position at a small startup in San Francisco as a lead Developer and Product Manager.  The company is called Old School Industries LLC and is a combination of two businesses: Quizlet and Collectors Weekly.

Read the rest of this entry »

Comments (6)

Technologies I’ve worked with in 2009

One benefit of doing freelance development work is that I get the opportunity to get involved in many different technologies and frameworks in a short amount of time.

Since the year is over… here’s a quick list of 15 technologies/frameworks that I got to learn in 2009 alone, during my last year in college.

Read the rest of this entry »

Add A Comment

« Previous Page« Previous entries « Previous Page · Next Page » Next entries »Next Page »