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…

Backend:

• Learned tons about scalability! Scaled Quizlet to serve 11 million visits per months (60 million pageviews, 5 million uniques), serving mostly UGC content with an average page response time of < 50ms.
• Got very comfortable with understanding and tweaking advanced configuration options of Apache, PHP, & MySQL for desired functionality and scalability requirements
• Went from a command line beginner to feeling very comfortable in Linux and Solaris, frequently writing bash/shell scripts for common sysadmin tasks, and trying to automate as much as possible.
• Worked with large data sets: our database had several hundred million rows and was in the dozens of gigabytes in size.
• Played a dev-ops role and helped transition all production servers to use Puppet for configuration management. Focused on having a process for all server related changes and created the ability to have over a dozen different servers recreate-able in very little time.
• Learned how to make MySQL fast on a high-trafficked and large database, do replication and have a quick recovery plan. Dealt with configuring databases, designing schemas, and optimizing SQL statements. Also managed our relationship with Percona’s consultants (leading MySQL experts) and learned from them.
• Automated backups and ensured we had quick access to them in the right places plus securely storing them off-site to Amazon S3 for safety. We had people relying on their data being accessible for studying and thankfully were able to recover quickly from incidents without losing any data.
• Sphinx Search is a very powerful open source search server good for indexing and quickly searching over MySQL. I learned how to configure it for our purposes and use its various features to power search on millions of rows of Quizlet content in a couple hundred milliseconds.
• Implemented and used several performance monitoring tools to keep tabs on a heavily trafficked website: Nagios, Munin, New Relic, etc.
• Learned all about (and implemented) email deliverability best practices: SPF records, DKIM, rDNS, Feedback Loops, IP address reputation, etc.
• Used several cloud service providers (Joyent, Slicehost, Amazon AWS). Setup reverse proxy CDNs for optimal performance of static files.

Frontend:

• Major focus on serious performance optimizations across entire stack. Spent time obsessing over how to get an extra 20ms out of a page load from our backend while keeping code clean. Resulted in an average page load of < 50ms across Quizlet.
• Also became extremely good at front-end performance; Did JavaScript profiling, proper handling of static files, caching headers, etc. Attended Velocity Conferences; Kept tabs on PageSpeed and WebpageTest waterfall results.
• Used Google Analytics Event Tracking for tracking client-side user events via JavaScript. Good for error detection and user behavior analysis.
• I already knew PHP well, but I’d say now I’m more of an expert at properly structuring object-oriented PHP5 on a large codebase.
• Learned all about and then implemented website localization & internationalization (i18n) for Quizlet, helping create a framework for user-generated translation submissions that launched in 7 languages.
• Got deep into Unicode and character encodings and implemented a language detection system in PHP based on n-grams and character encodings.
• Spent time optimizing with AdSense - A/B tested with different ad placement, targeting, and IAB ad sizes for better inventory.
• Wrote a very fast A/B testing framework and used it to optimize our upgrade page for better monetization
• Went very deep on the MooTools JavaScript library using it to build complex study games. In the past, jQuery has been my JS library of choice, but MooTools is very nice at being object-oriented and not afraid to extend native objects.
• Used Google Maps & Geocoding  API heavily (JavaScript and PHP) to build an events directory on CollectorsWeekly.
• Used the Stripe API to accept credit card payments (replacing our previous PayPal solution).
• Lots of cross-browser CSS – making things look good in browsers both old and new.

Dev Processes:

• Helped lead the development team with best practices and good processes for coding and communication.
• Became really good at Git and transitioned our team from SVN/Trac to Git/GitHub. Used git submodules to manage many of our dependancies and became a better open source citizen by submitting pull requests and bug reports in more projects.
• Did a lot of code reviewing on trac and GitHub with peers and new hires / interns.
• Introduced unit testing in both PHP (via PHPUnit) and JavaScript (via Jasmine); did some test-driven-development (TDD).
• Created a safer deployment process which first runs unit tests, PHP Lint, and other sanity checks before deploying.
• Started daily standups with the eng team to keep everyone up-to-date and on track.

Product:

• Along with development work, I was doing a lot of Product Management: feature triage and prioritization, tracking roadmaps, deciding among tradeoffs, etc.
• Huge focus on the user interface: tried to make every new feature high quality and easy to use. Spent a lot of time redoing the user flow of features that already existed to improve their ease of use. Removed clutter and made features that “just work”.
• Used Photoshop to work on visual improvements — designing or redesigning almost all the main pages and many shared UI components on Quizlet.
• Brainstormed and implemented game mechanics and other ways to make studying on Quizlet more fun and social.

Business+Management

• Focused heavily on recruiting other developers, helped create a process for finding potential candidates and putting them through a funnel. Did a lot of technical interviewing by phone/Skype and in-person. Helped build a great team of full-time people and interns.
• Team building. Helped manage and guide new employees, getting them up to speed and supporting their projects.
• Did a fair amount of biz dev as well. Negotiated deals for licensing software, worked out details of contracts. Talked with potential partners.
• Managed projects that other developers were working on, pushing for both code quality, fast completion, and a high quality user experience.
• Wrote a bunch of Quizlet blog posts about product announcements.

I’m sure I’m missing lots of stuff, and I should probably take even more time to write down some higher level lessons learned about startups. But for now this will do: startups are awesome and the best way to learn a lot of stuff really quickly by doing it. And if you’re lucky like I’ve been, it will be with an awesome team working on a great product used by tons of people.

I’ve recently moved onto a new opportunity that I’m very excited about. But I’m really glad to have been at Quizlet the last two years and I look forward to seeing it continuing to succeed widely!

(P.S., they’re hiring…)

…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!

I present to you, philandkristin.com! I built it in Rails 3.1, though it’s mostly all static. It was my first time using Ruby on Rails which I have mostly enjoyed, and hosting on Heroku so far has been quite nice.

And our closest friends and family (man it’s hard to not invite everybody!) will be getting wedding invitations that look something like the left one from my drafts below:

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…

Seeing this email (“Someone created a profile for you…”) after seeing what their company does instantly made me think that someone left a public review about me. Naturally, I was quite interested in seeing what it said, so I clicked through.

Bringing me to the site…

Step 1: Their only option is to Login with Facebook and give them your Facebook info and a list of all your friends. Kind of annoying, but I login with Facebook lots of places online, so whatever.

Step 2: Get your email address

Step 3: Try to get your email contacts

Step 4: Try to get your LinkedIn contacts (your Facebook friends weren’t enough apparently)

Step 5: At this point I think to myself that I’m done with all the “let’s try to make this web app viral by gathering as much info as possible” crap. Nope… the next screen is the best one yet.

As you can see, I’m so close to being able to see all these reviews about myself. See look – they’re right there on the screen already, just dimmed out and they say “Review text will be available after you like us on Facebook.”  It looks like there are already several reviews/rankings for me and as soon as I click “Like” I’ll be able to see them.

I don’t want to “Like” Honestly on Facebook. I don’t like them so far (they haven’t done a single positive thing for me at this point) and I certainly don’t want to broadcast to my friends that I like them. But as I’d also not like to connect my LinkedIn and leave reviews, I “Like” them knowing that I can fix this on Facebook immediately after.

So finally, the big moment of getting to see my reviews!!…

WHAT?!?! All that for nothing! So they sent me an email saying “Someone created a profile for you on Honestly.com” and there’s nothing there — what a bait and switch. Sure, you can debate the semantics of someone “creating a (blank) profile” vs. someone “leaving a review”, but they are clearly taking advantage of both me and whichever of my Facebook or LinkedIn’s friends that “created a profile” for me (a.k.a., probably just imported their contacts with no intention of all of them getting a deceptive email).

Bottom line: I think the idea is good and I have plenty of respect for investor Joshua Schachter of del.icio.us… but with a name like “Honestly” and a tagline of “Truth in reputation”, they should drop the sleazy and spammy tactics. If you’ve got a startup then by all means: use Facebook, Twitter, and LinkedIn to grow. But please, do it in a respectful and honest way.

I’ve been working with the founders, Dave Margulius and Andrew Sutherland (student at MIT), for around 6 months remotely and on short term trips as a contractor, and have now decided to accept an offer with the team full-time.  I’ll be responsible for developing new features on both websites, improving user experience, increasing monetization, and overall growing the businesses.

Quizlet.com is a studying website that lets students make flashcards online and study in a more effective and more fun way.  The site serves over a million students each month, has over 750,000 registered users, and has over 50 million user-generated flash cards.  As only the second developer on Quizlet, I’m excited to grow the website in huge ways and spend most of my time helping make studying better for a lot of people.

Collectors Weekly is a resource for all things collecting, antiques, and vintage.  It’s a combination of great original content and providing tools to browse eBay in a better way (SuperBrowse example).  I just helped launched its new geo-targetted events section and will spend about one third of my time developing new features for this site.

Both websites run on the LAMP stack.  I’ll be working heavily with Apache, PHP, JavaScript / Ajax, MySQL, Memcache, Sphinx, etc. to help grow traffic and features in a scalable way.  A decent number of the interesting technologies that I used for the first time in 2009 were a result of working with these guys.

This is an exciting time and a big opportunity for me as I’ll be able to significantly impact the growth and success of the startup.  It will also nice to be able to focus all my work attention in one direction rather than juggling many projects, as I’ve just graduated from UF and won’t be continuing freelance web work.  And of course, moving to San Francisco from Florida will be a big change and I’m excited, although I’ll still get to fly back every so often.  Wish me luck!

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.

1. Learned PHP optimization techniques, such as using APC and Memcached
2. Worked with the Twitter API to create a Twitter bot
3. Learned advanced Google Analytics tools and did multivariable testing of conversion rates with Website Optimizer
4. Work with the PayPal Payments Pro API
5. Created a simple Facebook App (using FBML)
6. Learned some Objective C and worked with XCode and Interface Builder
7. Created a basic iPhone App that interacted with an XML web service
8. Worked heavily with Magento customization and theming work
9. Wrote a WordPress plugin to make deploying multiple sites easier, along with plenty of other WordPress development
10. Wrote an ExpressionEngine module to save people time, and other EE work
11. Learned about various MySQL performance with different storage engines
12. Built a Google Wave Robot at a Google hackathon and demoed it at a WordPress Dev Day
13. Worked with the YouTube API to build an automatic video status checker
14. Geo-targeting by IP address
15. Automatic language detection of text with Google’s Translation API

Hopefully 2010 will bring its own interesting technologies and opportunities to learn!

Chapter 1: Introduction & Overview, Chapter 2: Quick Tricks – Good chapter to teach beginners to both JavaScript, jQuery, and PHP the differences between client-side and server-side code, and how the jQuery framework fits into it all.

Chapter 3: Tabs and Accordions – At first this chapter looks to be nothing more than glorified examples of jQuery UI Widgets, but later it actually does a nice job showing how PHP can be used with these widgets to do server-side management of the tabs.

Chapter 4: Forms and Form Validation – Interesting and insightful way of validating forms (both on the client and server side, which is necessary) without having to duplicate all the validation rules.

Chapter 5: File Management, Chapter 6: Calendars – Very specific examples, but Ch. 6 uses the very nice jquery-week-calendar plugin to create an interface very similar to Google Calendar and shows how to link it up with PHP managing the events server-side.

Chapter 7: Image Manipulation – Another nice example of bringing using both PHP and jQuery plugins (treeview and jcrop) to create something really useful.  In this case an image browser, resizer, rotator, and cropper.

Chapter 8: Drag and Drop – Standard sorting/dragging examples + persisting data.

Chapter 9: Data Tables – Using the DataTables jQuery plugin with PHP on very large data sets.

Chapter 10: Optimization – A few helpful tips regarding caching, automatically merging .js source files, JavaScript code optimization, perceived user load times, etc.

Overall, if you’re a programmer not super familiar with PHP or JavaScript, this book does have some very helpful explanations with good examples.

One small gripe about the book: while I do know that black and white books are much cheaper to produce, reading code without syntax coloring makes it unnecessarily harder to understand.

To learn more or purchase: “jQuery 1.3 with PHP” by Kae Verens.

I thought it’d be worth mentioning the classes at UF that, looking back, had the greatest impact on me.  I’ve taken a bunch of classes over the past 4.5 years, but these were the ones that I really can appreciate the most…

It wasn’t until this class that I really understood how computers worked.  I started this class as a freshman who could barely count in binary.  In one jam-packed semester, we learned all about: number systems, logic gates, mixed logic, k-maps, multiplexers, flip-flops, ALUs, RAM, ROM, etc.  We also learned how to design hardware components using Quartus and VHDL, and program them onto our PLDs to watch different LEDs on our breadboards react to various switches and buttons (see picture of my breadboard wired up after programming a PLD).

All in all, we started with simple logic gates and designed an entire (basic) 8-bit CPU – and then programmed it by writing and hand-compiling assembly code.  What a great learning experience!

This was also a great example of where it was completely worth taking the class with the harder professor who gives more homework, because he was very passionate about the subject and knew how to teach it well.  I don’t remember every detail of what I learned 4 years ago in this class, but because I had a great professor, I can still explain most of the major concepts and would feel comfortable diving back in if needed.

This OOP class has had a greater influence on me as a developer than anything else ever has.  Heavily based on both in-class lectures (with reading assignments) and very large get-your-hands-dirty team programming assignments, the course was a great mix of theory and practice.

We went over many important topics such as encapsulation, inheritance, composition, cohesion, encumbrance, type conformance, Law of Demeter, Tell Don’t Ask, Open-Closed Principle, Liskov Substitution Principle, and MVC.  We also became deeply familiar with reading UML diagrams and sequence diagrams and used these to express complex software object models.

The real value from this course, though, came from the programming assignments.  We worked in groups of 7-8 people throughout the semester on three different iterations of a real-time role playing rage (RPG) in Java based on proper OO design based on what we had learned at that point in the semester.  We actually started from scratch for each of the 3 iterations, and, for each iteration, I spent about 90 hours outside of class working with my group on a solid UML design and implementing our design in Java.

These group assignments, even though they were very time consuming, had a huge amount of value in helping us turn abstract OO concepts into practice.  They were also very rewarding as we were creating a pretty cool game

A side effect was that I also learned a lot about teamwork and leadership, and working with a group of people under high-stress work environments.  They also were what caused me to really know Java well.

• Design Patterns in OOP (CIS 4930) – Dave’s other class.  I’d highly recommend it to anyone wanting to become a better programmer/designer.
• Business Finance
• Intro to Financial Accounting

Common advice is that for the 1024 resolutions you have a maximum width of around 960 or 980px to work with. But if you really need to get every last pixel in, I can confirm test results from Windows XP running at 1024×768, with Internet Explorer 6.0 fully maximized, gives you a width of 1007px to work with.

* Of course, fluid layouts are also nice.

[Jump to Download/Installation Link]

Each time you set up a website with ExpressionEngine you probably want to install several different modules, extensions, and plugins. Doing that usually involves downloading a .zip file for each add-on, then individually unzipping and uploading each file/folder to the corresponding modules/, extensions/, plugins/, language/, and themes/ folders. Then each time any add-on is updated, you have to repeat the process across all your websites.

With my module, installing other add-ons is basically a one-click process. You just visit the module page (shown below) and then either upload a .zip/.php file, or give it the URL to the source from the developer’s website. Hit one button and my module takes the source file, extracts, and searches through the files and determines where each file/folder goes.

Screenshot:

For example, if you just upload a .zip file that contains a folder for a module, a pi.someplugin.php, and a lang.someplugin.php, all of the files will get extracted and moved to their proper locations. If it comes across a file it doesn’t understand, it will let you know.

Requirements:

• ExpressionEngine 1.6.8
• PHP cannot be in Safe Mode
• You may need to change permissions for a few folders if instructed

These likely would only be a problem with some shared hosting companies. (If you need good ExpressionEngine hosting let me know).

Installation:

1. Download freo_addon_installer_1.2.zip and unzip
2. Upload the freo_addon_installer/ folder to your system/modules/ folder
3. From the Modules page of your EE Control Panel, click “Install” next to “Freo Add-on Installer”
4. If you’re running a version of EE older than 1.6.8, copy freo_addon_installer/language/english/lang.freo_addon_installer.php to system/languages/english/
5. Please donate to support development of this and future add-ons.

Changes:

• v1.2 – Bug fixes (Oct. 25, 2009)
• v1.1 – Fixed problem when URLs redirect, like on github download zip URLs.  Added better support for installing fieldtypes for Brandon Kelly’s FieldFrame extension.  (Oct. 7, 2009)
• v1.0 – Initial Release. (Oct. 7, 2009)

Ideas & Plans:

• Create a long list of known add-ons to choose from so that installing will truly be one-click and not require looking up a source .zip URL.
• Integrate with LG Addon Updater so installing updates will be more of a breeze.

Feedback & Support:

If you encounter any problems or have any ideas for improvement at all please let me know. Leave a comment below and let me know how you like it. This support thread in the forums is the best place to resolve any problems you may have.

Please donate to support development of this and future add-ons.