Developer Ergonomics

These are the slides for my PyCaribbean 2017 keynote on Developer Ergonomics where I talk about the current state of package managers in Python vs in other ecosystems like Node and Rust.

Juice Box

image

A month ago I decided to take another stab at proposing a solution to allow all of us to keep working on great programming workshops.

Personally, the biggest headache in each and every one of the workshops that I have organized or participated in is the time and effort it takes to configure and setup the attendees’ computers. This results in attendees and instructors loosing valuable time that can be spent actually sharing knowledge. Various other people have shared the same worries and feelings about this, so might as well try and do something about it.


Juice Box
is virtual machine with a common environment that every workshop attendee can download and use before ever getting to the actual workshop.

What’s installed by default in Juice Box

  • Git
  • Python 2.7 with pip, virtualenv, and virtualenvwrapper
  • io.js with nvm
  • MongoDB
  • Redis
  • PostgreSQL
  • Docker
  • Sublime Text 3
  • Google Chrome
  • Firefox

What this project is trying to accomplish

  • Provide the most simple instructions possible so that attendees at every level can get started easily.
  • Reduce the need of a great network connection during the event.
  • Guarantee that all attendees have the same environment, tools and applications, making the process easier for all.
  • Reuse the same virtual machine between different groups and workshops.

Distribution

We built OVA files for Juice Box which allows us to simply distribute one file that contains the virtual machine. This file can be imported to VirtualBox with few clicks. We’ll be building and uploading each release so attendees can just download the resulting OVA file.  We’ve optimized the size of this file to achieve the smallest size possible but I’m sure it could be better. It’s smaller than an MP4 movie “shared” on TPB. Organizers might now require attendees to bring their Juice Box already downloaded and imported. Obviously, we might still have users that couldn’t download it, so just have a few USB flash drives with VirtualBox downloads for different operating systems and Juice Box’s OVA file.

InstallFests

Technical workshops shouldn’t be about installing a development environment in Linux, Windows, OS X, or whatever else. Unless that’s what they are about, this takes way to much time from everyone and it’s a pain. I propose that we organize InstallFests, events that are specific to helping users install development environments into their preferred operating system.

Open Source

Juice Box is completely open source under The MIT License and everything used to create the virtual machine is available on GitHub. If you’re a workshop organizer, make sure you “watch” the repository, this way you’ll get notified of new releases.

Feedback

Go download Juice Box and try it out out. This project might not be the best or correct solution, but it’s a start. Thanks to everyone that has already provided feedback. I’d love keep the conversation going and to have more feedback on this, wether you’re a workshop organizer or usually an attendee.

Sponsor

This project is sponsored by Blimp, a software products design and development agency. Blimp also organizes community workshops like Ember.js Puerto Rico and private trainings.

Logo by Jomarie Alvelo. Website and design by Giovanni Collazo.

Update

Just released v1.2.0! Juice Box now has support for Ruby with RVM.

File Uploads + CORS + IE

image

Supporting Internet Explorer is always kind of a drag, but sometimes you just have to. Adding to the mixture file uploads via AJAX and CORS only make it that much more fun.

When dealing with AJAX file uploads I always seem to keep going back to jQuery File Upload. Making these file uploads work on IE require fallback to using an iframe, which is supposed to work automatically almost right of the box. I encountered some issues, maybe it was the slack of sleep, reading outdated Stack Overflow answers or simply not understanding the documentation that well.

If the origin domain is different than the file upload server domain, CORS comes into play and there are some known limitations and issues on IE 8 and IE 9. In Internet Explorer 8, the XDomainRequest object was introduced to allow safe AJAX cross-origin requests directly by ensuring that HTTP Responses can only be read by the current page if the data source indicates that the response is public. Responses indicate their willingness to allow cross domain access by including the Access-Control-Allow-Origin HTTP response header with value *, or the exact origin of the calling page.This blog post lists and describes the restrictions and reasoning behind them, but these two are the ones that bit me recently.

  • Only text/plain is supported for the request’s Content-Type header – This means that your API endpoint will have to be adjusted to be able to parse whatever data you send in the request. In my case I was returning a JSON response with an application/json content type, but after figuring this out I had to change the content type of that response to text/plain. On the client side that meant manually parsing the response data as JSON using  $.parseJSON.
  • Requests must be targeted to the same scheme as the hosting page – Once I thought I had everything working I was still getting hit by a couple of errors. Turns out I was generating a request from http to an https endpoint on different domain.
  • The target URL must be accessed using only the HTTP methods GET and POST

Now comes jQuery File Upload into play.

File Upload widget with multiple file selection, drag&drop support, progress bars, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

Cross-domain file uploads on IE 8 and 9 use the Iframe Transport plugin that requires a redirect back to the origin server to retrieve the upload results. The example implementation includes a result.html that works for this. The repository includes the jQuery XDomainRequest Transport plugin which is required to enable cross-domain AJAX requests in IE 8 and 9. Internet Explorer 10 and above supports CORS using XMLHTTPRequest.

The tricky part here for me was ;“requires a redirect back to the origin server”. I had the results.html file in place but nothing was happening. Taking a look at the sample server implementations I noticed that in order for this to work I had to redirect the response to the location of the results.html including the response JSON I would normally return as a response but as a query parameter. The results.html enables jQuery File Upload to access the results from the iframe.

Here are a couple of excerpts that might help understand.

Photo by John Trainor