 Hi, everyone. Before I get started, I just wanted to tell you a little bit about myself. So up until a couple of years ago, I lived in New York City. And I was working for Bloomberg. And Bloomberg has been a big sponsor of the Python open source ecosystem for a few years. And I think we should all thank them for that and for these great venues and all the help that they've given to the community. And after Bloomberg, I actually moved back to France and studied a company called Quantstack. And what we do is build scientific computing open source software for corporations and laboratories, et cetera. So as an open source developer, I've mostly been involved in Project Jupiter. I'm a steering council member of the project. But I also work on other things, such as the extensor C++ tensor algebra library and some visualization libraries built on the top of Project Jupiter, such as BQplot, PyFugees, IPyLeaflet. So yeah. If you want to follow me on Twitter or GitHub, I am Sylvain Corley everywhere. And after my talk, you can ask me about Python, obviously, C++, JavaScript, and Project Jupiter as well as extensor. So yeah, I'm one of these people who like Python so much that I actually write code in other languages, such as JavaScript for Project Jupiter to let people make a better use of Python. So I spend most of my time writing code in other programming languages. A lot of what I'm going to show today is not just a one or two or three-person project. It was built upon work from a really big team. And so here I'm just showing the core developers team of Project Jupiter as of 2014. But we're missing a few folks on there, as well as other people who have developed some of the other things that I'll be showing and were not on the picture. And I thought I should really include them. So before I show even more, I should probably make a quick poll in the audience. First, can you all understand my Americanized French? You can, apparently. Second, who has used or knows about Project Jupiter in the audience? So pretty much everyone. And who knows about Project Jupiter interactive widgets? Maybe half of the crowd. So if you know about Project Jupiter, you probably have heard of the new frontend for Project Jupiter that I'm going to use. Most of this talk is going to be made of live demos, which is risky. But I like taking risks. But I'm going to start with something very simple. When I Python, which is the older name of the project, and the early versions of the notebook came out, some people didn't really see the point. They were essentially saying, Jupiter is merely a glorified replacement for the wrapper, for the console interpreter. And so what really happens when, for example, if I type 9 times 9 in the Jupyter Notebook, and it returns 81, is that I am modifying the Jupyter Notebook object model, sending an execute request to the kernel that may be running in another machine through a protocol that was fully specified. The kernel responds with the result of that computation, modifies the document model, and then you see the result. And even though there is a lot of things happening under the hood when you hit 9 times 9, it's fairly instantaneous. And as a user of the Jupyter Notebook, and as if I am learning how to program, and I want to explore how to write functions and write simple code, I am actually the bottleneck in that loop here, in the redevelopment loop. Every time I want to see the results of my computation with new values, I need to enter the new values manually. So for this purpose, I could try to be smarter and use a function instead, and only have to enter one value, but it's still fairly slow. To make this easier for beginners and people who are doing scientific computing, software such as Mathematica and Mapo had this, and Sage also had this interface called Interact that actually used the introspection features of the Python programming language to inspect the arguments of a function and build an automatic grease for you to interact with the parameters of a function and see what is the outcome of that function. So in that case, for the square function, if I call Interact with an x as an interval, what I get is a slider for the x parameter, and I see the output displayed, which allows me to go much faster and see how the square function behaves. So that ID actually works even for functions of more than one parameter, and depending on the type of the default value, I will have another GUI generated automatically. There you go. So this allows for building GUIs automatically for a function that you pass. So the first and initial purpose of Jupyter interactive widgets, and this is probably not the reason why you use them, was to enable that feature, something that people really loved and used a lot in the Mathematica notebook and other related software. But the way this works is using something called the interactive widget subjects, and widgets are actually special objects that when displayed in the Jupyter notebook, are replaced and are displayed in the form of an HTML-riched representation that you can interact with. So a slider is merely that, for example, is such an object, I can read its value, modify it manually from the code and see it reflected in the frontend, right? So what widgets are more than a bunch of controls also is a framework to communicate in a bi-directional fashion between the kernel, the part of the code that you're responsible for executing the code that you type in the Jupyter notebook and the frontend. And in order to do so, we follow the MVC pattern in that every time I display a new, when I create a widget object, a counterpart object is creating the frontend that is automatically synchronized and every time I display it, a new view is created. Well, more than just a collection of controls because we have lots of them, what this enabled is actually, is more than is really a framework upon which you could build. So a couple of years back, I was in a Python conference and there was a guest talk of a D3JS developer who was giving a tutorial about D3JS. So for those of you who may not know, D3JS is this great visualization toolkit that runs in the browser and he actually was going through the details of that example that runs on the D3JS website which is like interactive vulnerability solution. And so there are lots of these examples on the D3JS website where you have like a snippet of code of how you can reproduce that visualization. So I decided to, okay, just copy paste that thing into the Jupyter notebook, wire it into a new widget and make it, sorry, should probably re-execute that whole thing and make it an interactive widgets. The only difference with that, the example that I was showing in the D3JS website is that now that visual output is wired with the data that I gave from the Python backend and I can make use of that really nice interaction super easily. And well, that was very simple. In maybe 50 lines of code, I could enable that use case for Jupyter developers and Jupyter users. So I'm going to show a number of custom Jupyter widgets libraries. Some are meant for data visualization and other things but there is one aspect of it that I really want to emphasize is that if there is anything in the JavaScript ecosystem, a visualization library, or something that is not even meant for visualization, if you want to interface with MIDI controllers or game pads or whatever you want that works in the browser, it is really easy to wrap it into a Jupyter widget and integrate it into your Python workflows. If, so even if there is nothing in Bokey or BQplot or Pythogest that allows that data-driven pink rabbit that you found on the web, you can actually make a package for it fairly easily. Now, there are a few libraries that we've built upon iPyWidgets that I really wanted to show and the first one is BQplot. BQplot is a project that we started when I was a quant at Bloomberg and we got to open source. So it's on the Bloomberg GitHub organization and it's a 2D plotting library for Jupyter built upon the Jupyter widgets ecosystem and just like the sliders and the other widgets were meant to accelerate that redevelopment loop, these are not only meant for visualization, it's really also to take user input. So generating some data and you can use BQplot with an API that is very similar to that of Matplotlib but unlike Matplotlib where most of the rendering logic is in the back end and Matplotlib would generate an image that you would display in the Jupyter notebook here all of the logic for the rendering and the interaction lies in the browser so that now you can have something really and truly interactive in the Jupyter notebook. So we have other high level routines for all the types of charts, BQplot, scatterplots, histograms, et cetera. More importantly, even every single component of a figure in BQplot is a widget itself and you can compose your own figure by assembling the object model, including the scales, access, marks, et cetera with an object model similar to that of GDplot. So in that example, I'm putting together two lines and the axis and tick marks with linear scales. If I change the values for Y for that line chart I see the graph update in real time to reflect the new values and the same goes for everything. You could modify the data for scatterplot, change the minimum of a scale, set it back to none so that it's completely based on the data, et cetera. You can use BQplot as an input widget. So for example, here you can perform a selection of an interval in a BQplot chart and update another chart based on that and see what was selected. You could use it to draw so in that case, you could use it to draw, for example, just modify one of these curves. This is really useful if you are, for example, testing a model that takes a function as an input and you would really like to know what would be the outcome of your model if the function looked like that and doing this by entering in some arbitrary functions and signs and linear components and also that you sort of see the, reproduce the shape that you want maybe hard but here you can really fasten that, really develop print group again and have an input that is more complicated. You can also move points around. So, and here I have this really complicated machine learning model that computes the mean of the Y positions and as you move the points around the scatterplot so it's not meant for data temperance like really for experimentation, you can see how the model behaves but just for educational purpose if you were computing the median instead of the mean you would see how it behaves when you move a single point. So that's for BQplot, but there are lots of others. Beyond BQplot, so we can be like fairly complicated applications using BQplot. Py3js is a bridge between 3js, what's going on here? Yeah, there you go, sorry. So Py3js is actually a bridge between the 3js visualization package that runs in the browser and the Jupyter ecosystem. So in that case, I built a clickable 3D surface with markers for the position of the mouse and the way we built this is by composing the scene entirely including the position of the cameras, the lights and the different objects of the scene. So it's not really a library meant for high level visualization where you would just say plot or scatter and get something out of the box. It's much lower level but can be used to build pretty much anything. We actually put together a flight simulator using Py3js with 50 lines of Python in the Jupyter notebook that was demoed outside by a couple of years back. So it's very fast and yeah, you can do pretty much anything with Py3js. As I am in the 3D plotting world, I should also really mention IPyvolume which just like Py3js is built upon the 3js library but provides much higher level plotting routines. So that one is just a scatter plot in 3D with circle markers, serial markers. And since just like BQplot and Py3js, every single item of this object model is actually a widget itself and will reflect visually the changes in the model as you make them on the Python side. So for example, I could wire this with the IPyWidgets color picker and modify the color of the object in the scatter plot or the size or whatever you want. Really smooth. You can also show animations, et cetera. So if you want to check out any of these library, IPyvolume, BQplot, Py3js, you can check them out in Kanda or Pypy and to Peppin store, Py3js should work out of the box for the classic notebook. Leaflet.js, so is there anyone who in the room would know about the leaflet.js JavaScript library? So a small portion of the group. So leaflet.js is a JavaScript library for visualizing maps and we actually could wire, I mean, wrap this into a Jupyter widget so that you can enjoy all of these features in the Jupyter notebook. So here is a quick way to display a map with a given center position and zoom level in the Jupyter notebook. You can use this to draw on it, change the layers. Another interesting feature of it is that you can, for example, decide to right click on the output prompt and create a new view for the output so that the map would be displayed on the side in a different tab of the doc panel and so that you don't need to scroll back and forth all the time to see the results or the outcome of your executions of cells. There is also the sidecar widget which allows for using the right tabs to have a more rigid layout where you have a new single map displayed on the right. Well, I don't have so much time so I should probably just really mention quickly the, some of the applications or things that you could be building with BQplot and Ipi Leaflet. So that screencast here is an application that we built during a hackathon last year in San Francisco where we were analyzing the well-being of the population in different neighborhoods of San Francisco and we were measuring and trying to make the link between the self-assessment of the satisfaction depending on the neighborhoods and some other actual features of the neighborhoods in terms of average distance to restaurants and things like this. Since I only have three minutes, I guess, I really wanted to mention another initiative that we've been working on is that one of the main extension points of Project Jupiter is the kernel infrastructure where you can have, all of this is actually a language agnostic. It's not just for the Python programming language and over the past year, we've been working on a kernel for the C++ programming language making use of the Kling interpreter that comes out from CERN. So you can do pretty much anything that's valid in the C++ program language such as functional classes, polymorphism templates, C++ 14-11 support. We can do quick help just like with Python with question mark, STD vector is actually going to fetch the help for STD vector on CPP reference. It's not a gimmick that actually works for pretty much anything, the standard library, but also user-defined types if you declare them in the proper way. We can do rich display in C++, et cetera, but more than a kernel for C++, you have time more. It's actually a framework that, so Xus is actually a framework for building Jupyter kernels that should make the work of kernel authors much easier in a way that will enable them to use all of these features including quick help, autocomplete, interactive widgets, and whatnot. Yeah, so I'll be taking a couple of questions. Mm-hmm. So I think the classic notebook is used in production by a lot of people, so it's going to be maintenance mode for some time, for quite some time. In terms of when the 1.0 for JupyterLab is going to be released, I'm not going to give or make any promise for the date. We've released a beta version about two months ago. There are a few more things that the team wants to integrate into JupyterLab before it's released. I see a lot of requests for styling the widgets. It's like, oh, I don't like the dropdown. It's pretty ugly. I need to change the style. It's not easy. Any plans for the committee to make that easier rather than going to CSS like JavaScript? So in the past, we allowed custom CSS for pretty much anything and we decided to not allow that anymore because that was making the entire DOM structure of all the widgets part of the API because any time we would change it, people, it would break people's work. So we decided to enable a whitelist of attributes that you could style for each widget. And if you want more, open request to enable more, but it's more of a whitelist than like a full open access to the CSS of the widget. Yes. That's right. I'm not PDF at the moment. So the question was whether we could embed widgets in a way into PDF documents. Well, obviously you're going to lose the interactivity. So at the moment, it's possible to have a static embedded widgets in a web page. Although in order to use it, this is going to require access to internet to get the JavaScript from a CDN. You can put it on your blog and in the live documentation. If I go on the iPad leaflet documentation, you are going to see live widgets displayed. So you can embed them in static web pages, but not in PDFs. Oh, sorry, what do you mean? There is a one click solution. Yeah, in the classic notebook at the moment, in the widgets dropdown, you can do export to HTML. And you will see all of the widgets that are in the notebook displayed vertically in a vertical layout. Then you can arrange that layout as however you want.