Patrick Canfield, Software Developer in San Francisco, CA, United States
Patrick Canfield

Software Developer in San Francisco, CA, United States

Member since November 2, 2015
An engineer with a right-brain-hemisphere orientation (a unique combo), Patrick is good with lateral thinking, visual problem solving, green-hat thinking as well as the analytical reasoning that engineers typically rely on. He has a decade of professional experience, recently in front-end web tech (React.js, Redux, ES.Next, Webpack, Angular, Backbone.js, and jQuery). He's currently learning about the psychological foundations of UI design theory.
Patrick is now available for hire


  • EventRay
    React, Redux, Webpack, Babel, ES-Next, Sass, Git
  • Metromile
    Angular, Gulp, Git, Nginx, Sass
    Python, Angular, Ionic, Cordova, Jasmine, Protractor



San Francisco, CA, United States



Preferred Environment

Linux, macOS, Git

The most amazing...

...thing I've created is at


  • Co-founder | Front-end Engineer | Chief Marketing Officer

    2016 - 2018
    • Wrote code for hovering error feedback next to associated input on a form.
    • Contributed to the landing page design.
    • Built end-user help pages.
    • Developed a predicate logic-building UI.
    • Wrote code for responsive toolbars.
    • Wrote highly reusable code for building CRUD interfaces.
    • Helped fix bugs in an open-source library, React-Popper.
    Technologies: React, Redux, Webpack, Babel, ES-Next, Sass, Git
  • Senior Front-end Engineer

    2016 - 2016
    • Created rapid prototyping scaffolding.
    • Wrote the code for displaying a map showing recent trips.
    • Wrote a shimmer animation loading feedback Angular directive.
    • Contributed to a testing framework.
    • Significantly rearranged the customer-facing front-end code to fix race conditions.
    • Initiated a weekly company-wide front-end engineering sync.
    • Wrote an Angular directive for fading in a background image once it's fully loaded—eliminating an ugly distracting loading flicker.
    Technologies: Angular, Gulp, Git, Nginx, Sass
  • Software Engineer (Remote Freelance)

    2015 - 2016
    • Established an agile process using Pivotal Tracker, Google Hangouts, and Bitbucket pull requests.
    • Helped design a mobile app's API.
    • Implemented front-end Angular services for interacting with the API.
    • Wrote the first unit tests using Angular-mocks.js and Jasmine.
    • Wrote the first end-to-end tests using Protractor.
    Technologies: Python, Angular, Ionic, Cordova, Jasmine, Protractor
  • Senior Software Engineer

    2014 - 2014
    • Developed the ID verification step using the Jumio API.
    • Set up a JavaScript unit testing with Jasmine.
    Technologies: Rails, JavaScript, Backbone.js, Jasmine
  • Software Engineer

    2013 - 2014
    Constant Contact
    • Developed a Marionette.js-based social post scheduling interface.
    • Introduced Backbone.js to a young project in need of structure.
    • Helped implement unit testing with Jasmine.
    • Developed a sophisticated color picker using Raphael.js.
    • Created a new project yeoman generator.
    Technologies: JavaScript, Backbone.js, Marionette.js, Jasmine
  • Co-founder | Developer

    2011 - 2013
    • Developed a WYSIWYG conference badge design.
    • Constructed a D3.js-based graphing library.
    • Developed a conference-center-oriented event scheduling app.
    • Created the Prezi presentation that was submitted without a successful application to an incubator.
    • Wrote the landing page with HTML/CSS.
    Technologies: Python, JavaScript, Backbone.js, Marionette.js, D3.js, Sass
  • Software Developer

    2008 - 2011
    • Created a tool for viewing the current LCD output of a remote embedded system from my development machine.
    • Introduced a C++ unit-testing framework.
    • Developed an interprocess messaging service and an SNMP daemon.
    • Created a service for parsing and aggregating TV guide data.
    Technologies: C++, Linux


  • EventRay Logic Builder Documentation (Development)

    I wrote EventRay's logic builder as well as these documentation pages that use the logic builder's actual code to render examples inline with the documentation. I also conceived and implemented the technology to make that possible.

  • Music Streaming App (Development)

    I built the front-end of this music-streaming app using Backbone.js.

  • Photo Map (Development)

    This piece of software automatically places photos that I've taken on an interactive map using EXIF data, Mapbox, and a DBSCAN clustering algorithm library.

  • Boggle (Development)

    A web implementation of Boggle, a word-finding puzzle game


  • Calorie Tracker (Development)

    A simple app for tracking calories using AngularJS and Firebase. I'm most proud of the stylesheet which I created from scratch and the robustness of the app, thanks to significant automated test coverage.

  • (Development)

    I wrote much of the foundational front-end code using Ionic and AngularJS. I also put in place the unit and end-to-end tests.


  • Languages

    ECMAScript (ES6), ES7, JavaScript, CSS3, HTML5, Sass, Python, Ruby, C#, GraphQL
  • Frameworks

    Jest, Redux, Jasmine, AngularJS
  • Libraries/APIs

    React, Lodash, Backbone.js, jQuery, D3.js
  • Tools

    JSX, Git, Jira, Webpack, Pivotal Tracker, Nginx, Gatsby, Sketch
  • Paradigms

    Object-oriented Programming (OOP), Functional Programming, Responsive Web Design (RWD), Agile Software Development, Behavior-driven Development (BDD)
  • Other

    Front-end Development, RESTful APIs, General Agreements on Trade in Services (GATS)
  • Platforms

    Linux, MapBox
  • Storage

    PostgreSQL, MongoDB, RethinkDB


  • Bachelor's degree in Computer Science
    2004 - 2008
    University of North Florida - Jacksonville, Florida

To view more profiles

Join Toptal
Share it with others