React UI Components2015-2019
Designed and developed countless React Native touch based UI components for mobile. Created a wide range of interfaces and worked to deliver a great deal of functionality while still keeping things simple and elegant. Encountered various challenges across the life of the project.These UI clips were all recorded running live React Native code on an iPhone 6S. Backed primarily by a serverless GraphQL API on AWS. Designed and developed all elements.
Cross component communication - Utilized a number of different React patterns to share logic and gesture state between components: Prop Drilling, Callbacks, Higher Order Components, Composed Components, Render Props, etc. User interfaces for app layout, navigation, and content creation all required the most complex coordination across components. Ultimately had the most success with Contexts, but, thankfully, most problems addressed by these patterns can now be solved painlessly using Custom Hooks. 🎉
Gesture tracking - Often the best solution required utilizing invisible views for intercepting touch interactions. When rendered higher up in the view hierarchy it allowed multiple descendent or sibling components to easily track the gesture state. To improve responsiveness and performance in the native environment, often it would benefit to encapsulate some imperative logic within a declarative component that ultimately hooked back into the React lifecycle. This was useful in cases where state reconciliation caused jank or hindered responsiveness.
Styling limitations - Also true of the web, with React Native, certain types of styling attributes and transforms are optimized on the native thread, while others are not. Worked within these constraints to achieve 60fps interactions and animations. Over time, several different patterns emerged. Used duplicate elements and other techniques to simulate animation effects that aren't supported natively.
Cloud Infrastructure and Services2016-2019
Serverless Cloud Architecture - Designed, developed, and deployed a serverless cloud infrastructure on AWS using CloudFormation templates (via serverless). Ran into some nuanced networking issues with connecting Lambda functions inside a VPC for communication with Redis and ElasticSearch. Also implemented multi-region automated database backups and event sourcing.
GraphQL API and Services - Designed and implemented a GraphQL API using DataLoader for batching requests. Researched best practices and experimented with a developer friendly natural language schema as well as server hashed and cached queries (this feature later arrived in Apollo server as Automatic Persisted Queries). Built numerous backend services typical of a social networking platform.
GraphQL Subscriptions over AWS IoT - Developed an unconventional use of AWS IoT to support GraphQL subscriptions over MQTT. Required some complicated AWS service, signing, and policy coordination, but resulted in a hassle free persistent "serverless" websocket connection to each user.
NoSQL Data Modeling - Worked extensively with both DynamoDB and Cassandra. Learned about different patterns for modeling data with each. Cassandra loves writes and benefits from explicitly denormalizing data. DynamoDB enables querying across many keys through the use of indexes. Arrived on a particularly elegant solution with DynamoDB by modeling graph data in two tables of nodes and edges.
Authentication and OAuth - Built authentication system for web service using a Redis hash table for token management. Implemented OAuth identity provider server and custom "Sign in with..." feature. Researched and followed best practices and OWASP guidelines.
Unique ID Microservice - Created a service for generating roughly ordered unique numerical ids based on twitter's `snowflake` methodology. Tried various implementations, wrote a very performant Node.js service but settled on a Redis based Lua script in order to better accommodate the serverless architecture. Learned a bit about working with binary data and different techniques for ensuring uniqueness in a distributed system.
Added configurable delay timings to React Native's core touchable components. Upon release and initially evaluating React Native, noticed a shortcoming with the timing of the touchable components. There was a hardcoded unconfigurable 100ms delay enforced on all buttons, which made things feel unresponsive. Also, the length of time before a button's longPress event fired wasn't customizable. On iOS, some buttons have different touch delays in order to emphasize a certain action. Felt this would be a useful addition to React Native core and submitted a pull request.
First took an approach that was too high level, refactored after receiving feedback. Met with some opposition, questioning the value of the additional feature, hesitant to grow the API. Presented examples and a sound argument which eventually won over the team's approval. Learned quite a bit about contributing to an open source project of that scale.
Baby Name Rating App2015
Created a mobile app for selecting baby names on iOS and Android using Apache Cordova. Users were presented with different names to vote on and favorites or "winners" emerge through the use of an ELO ranking algorithm.
Users also had the ability to filter the dataset based on a range of years and name popularity within that span of time. This feature presented some challenges. With the naive implementation, where all sorting happened at runtime, the CPU time required to filter the dataset on the device was totally unacceptable. Ended up striking a balance between app bundle size and CPU demands by including partially presorted data. This dramatically improved the filtering time and user experience.
Infinite Scroll with View Recycling2014
Created a high performance infinite scrolling list of large resolution images for mobile and desktop browsers. Used DevTools to profile performance issues and surface potential optimizations. Conducted extensive research on creating jank free experiences and implemented many techniques.
Utilized several loading states as images passed through the viewport. From initially loading and blurring low resolution thumbnails to repositioning DOM nodes and recycling views, many considerations were made to deliver an optimal end user experience.
Also addressed complexities with properly handling touch and mouse events, as well as simulating expected rubber band scroll effects.
Custom CMS Themes and Plugins2007-2013
Worked on various content management system implementations, primarily Drupal and Wordpress. Mostly websites and plugins for photographers, galleries, schools, and personal blogs.
Often handled projects from conception to completion. Learned a lot about working with clients and managing expectations, but also spent countless hours hand coding custom templates.
Really started to appreciate module/plugin systems and their benefit of reuse and encapsulation. Worked extensively with media on the web.
The Ohio State University
BA in Art - Relevant coursework in web development, design, robotics, 3D modeling, animation, color theory, public speaking, and sign language. Aug 2007 - 2010, Spring 2014
Gamers, Inc - Social network for gamers. Find games with others by navigating your social graph. Ongoing side project. Apr 2016 - Present
Buildry, Inc - Engineering effort to build a common core of open software that serves independent developers across the entire span of a creative project or company. Ongoing side project. Jan 2016 - Present
Freelance - Designed and built many gallery and portfolio sites, primarily for artists and photographers. Also worked on angular and node applications. 2011 - 2015
Ohio State Department of Humanities - Worked on custom modules and themes for public facing content management system. Fixed bugs in existing code and content. 2009 - 2010
Oregon Eagle Learning Center - Independently developed and maintained a custom Drupal installation tailored to the offerings of an online charter school. 2008 - 2012
- React Native
- UI design and development
- Cloud computing and architecture
- Full stack web
- API design and development
- Async programming
- Data modeling
- User experience
- Attention to detail
- User interviews
- Connecting and empowering people with software
- Democratization of software development
- Advancing technology and creative industries
- Future of the web and work
- Community involvement, meetups and conferences, public speaking
- Collaborative problem solving, First principles thinking, Creative systems and processes
- Elegant high impact user experiences, Inventive UI solutions, Prototyping
- Jank-free interactions, High performance animations, Memory-efficient applications
- Cross platform development solutions
- Globally distributed scalable systems
- Streaming data and real time communications
- Infrastructure design, Data modeling, Event sourcing
- API design and documentation, Developer experience and tooling, Design systems