A Year of Pyxley: My First Open Source Adventure

A Year of PyxleyMy First Open Source Adventure

What’s Pixley?A Stitch Fix Exclusive

Brand

Designed By Data Scientists!

http://multithreaded.stitchfix.com/blog/2016/07/14/data-driven-fashion-design/

What’s pyxley?

https://github.com/stitchfix/pyxley

Helpers and Widgets for Building Flask and React Powered Dashboards

Who Am I?

Data Scientist@ STITCH FIX

(Not a Front-End Engineer)

I Used to Kaggle…

Algorithm Development & Feature Engineering

In This TalkWhat Led to pyxley…

Lessons LearnedWhat I Thought Was Going To

Happen…What Actually Happened…

What’s next?

Stylists Pick 5 Items

Items Are Shipped to Clients

Clients Keep What They Want

and Return the Rest

How Stitch Fix Works

Stylist

Merch Algorithms @ Stitch Fixhttp://multithreaded.stitchfix.com/algorithms/

What Should We Buy?

When Should We Order More?

Do We Have the Right

Mix?

What Do We Throw Away?

So Many Web AppsWe Provide Insights to our Business Partners Through Web Applications

An Overview of Pyxley

Please Don’t Make Me Write

R

My First Flask AppReact UIFlask Application

React-BootstrapButtons

NVD3

@app.route(‘/get_data/’)

jsonify(data_as_dict)

PandasDataFrame

My First Flask App After Feature RequestsReact UIFlask Application

@app.route(‘/get_data/’)

jsonify(data_as_dict)

@app.route(‘/get_data/’)@app.route(‘/get_data/’)@app.route(‘/get_data/’)@app.route(‘/get_data/’)@app.route(‘/get_data/’)@app.route(‘/get_data/’)

jsonify(data_as_dict)jsonify(data_as_dict)jsonify(data_as_dict)jsonify(data_as_dict)jsonify(data_as_dict)jsonify(data_as_dict)

NVD3

React-BootstrapButtons

My Code Quickly Became a Mess

Inspired By Shiny ui.R defines

UI

Specify Filters

Specify Tables

…but I didn’t want to use Shiny

React UI

Filters

Flask Application

UIComponent

A Simple Abstraction

jsonify(data_as_dict)

PandasDataFrame

@app.route(‘/get_data/’) Charts

Components Handle Flask StuffSpecify JSON Output Format For Charts

Just a Bunch of WrappersOver the Course of a Week…

Decided on a JS

Pattern

Wrote Python

Wrappers

…but I Didn’t Write Any Documentation or Tests

Lesson #1: Don’t Plan For Zero Interest

No Docs, No Tests,

No Problems!

Releasing pyxleyWhat I Thought Would

Happen…

What Actually Happened…

So Many IssuesLots of Dependencies = Lots of Installation

Troubles

Lesson #2: Read Some Guides First

Python Open Source Basics

Did You Know PyPi Has a Test

Server?

What’s PyPi?

Conda Environments http://conda.pydata.org/docs/using/envs.html

or use virtualenvhttp://docs.python-guide.org/en/latest/dev/virtualenvs/

PyPI Quick and Dirtyhttps://hynek.me/articles/sharing-your-labor-of-love-pypi-quick-and-dirty/

Open Sourcing a Python Package The Right Way (https://jeffknupp.com/blog/2013/08/16/open-sourcing-a-python-project-the-right-way/)

Manage Package Dependencies

PyPI Tutorials

Lesson #3: Make Straightforward Examples (and Documentation!)

The code is the documentation,

right?

Datatables + Single UI Component +

Custom SVG

Multiple Charts

Custom React + NVD3

Datamaps + Slider

My Thought Process:

Show As Much Functionality In As Few Examples As Possible

User: How Do I Make a Table?

Why Are These Different?

Lesson #4: Make Sure It’s Something You Love

What’s “Free Time”?

Open Source = Collaboration, Right?What I was Hoping For…

Design Feedback

Widget Contributors

New Use Cases

Maintain pyxley

Hobbies

Exercise

Free Time?

pyxley often loses

The Bigger PictureAn Example Stitch Fix Web App

Flask Application

React UI

pyxley

S3

Spark ETL

Most of My Time is Spent Preparing Data(and Dashboards are a Small Part of My

Job)

Python (sklearn)

Recommendations

Raw Data

Features

JavaScript Skills After a Year of pyxley

Integrating With JavaScript Requires Constant Attention

In the last year…React has gone from version v0.13.x to

v15.3.0PyReact was deprecatedOther libraries have had big API changes

Summary and Next Steps

It’s Both Awesome and OverwhelmingThere will always be bugsThere will never be enough docs /

tests / examples

The Future of pyxleyTry to keep up with React (and JS in

general)Simplify the flask side of things

Maintaining an Open Source Project is an Adventure!

Nick KridlerTwitter: @nmkridlerGithub: nmkridler

github.com/stitchfix/pyxleypyxley.readthedocs.org

Images Taken From Final Fantasy VI & XIVSquare Enix & Yoshitaka Amano

Contact