069 - Flutter and PWAs with Chris Sells

Jeremy speaks with Chris Sells, who is a Senior Product Manager at Google with the Flutter team. They discuss progressive web apps, Flutter, and online backgammon over Telnet.

If you enjoy this episode, please consider leaving a review on Apple Podcasts or wherever you listen.

Please send any questions or comments to podcast@pluralsight.com.

Jeremy:

Hello, and welcome to All Hands on Tech. I'm Jeremy Morgan. One of the biggest benefits of a web application is the fact that it should behave reasonably similar no matter what platform you're using it from. The look, feel, and functionality are all basically the same, except on mobile devices. Progressive Web Apps tackle that problem head on. They are web applications, but they run on your mobile device. They live on your home screen and can access hardware, communicate with a server and sometimes even run offline. Flutter is a UI toolkit that is thriving in this space. While some Progressive Web App frameworks generate code that's almost as fast as native, Flutter generates native code. Yes, Flutter apps can compile directly to machine code or JavaScript depending on the application. This means you can build performant applications for Apple or Android platforms with the same codebase. It's pretty awesome. Today I'm talking with Chris Sells, a senior product manager on the Flutter team at Google. We're going to talk about Progressive Web Apps, Flutter, and how he learns and publishes his own skills. Let's welcome Chris Sells.

How are you doing today, Chris? 

Chris Sells:

I'm good, Jeremy. How are you?

Jeremy:

Doing fairly well. So how's the weather where you're at? I know you're not far from me.

Chris Sells:

For your listeners, I'm in Portland, Oregon, and it is typical Pacific Northwest weather. Meaning it is cloudy and rainy, and chilly, and generally terrible. It's not cold enough to snow, which being from the Midwest, I would actually prefer, and it's not warm enough for the plants to be growing in green and lush. And in fact, summer in the Pacific Northwest is the best ever. We are in winter, which is the worst. So that's a really long way to answer your question.

Jeremy:

That's what I tell everybody about our weather. It's nine months, it's miserable, but the summers are the best summers anywhere in the world, I think. 

Chris Sells:

Yeah, I agree. I had a friend of mine bragging about, he lives in San Diego. He was bragging about sunshine all the time, and the weather is fantastic. And I actually prefer the weather in general in the Pacific Northwest. And I'm like, "Dude, you got that annoying super bright ball in the sky all the time in San Diego. It's the worst." Whereas importantly, we have this cloud cover that provides sunglasses for the sky all the time. [crosstalk 00:02:38].

Jeremy:

It's definitely one way of looking at it. So tell us a little bit about yourself and what you do.

Chris Sells:

Sure. So I am a product manager at Google, and I am responsible for bits and pieces of Flutter. I work on a team of product managers, very talented people, takes a village to manage the product that is Flutter. And I'm responsible for primarily the end to end developer experience, which means I touch on a lot of... For example, I work a lot with our top customers and clients and partners, making sure that they have a great experience. I spend a lot of time working on the general ecosystem as a whole, all our packages and plugins, making sure that the quality there is always increasing, that the size and coverage is always increasing. I am the product manager for our line of desktop platforms that we support, that kind of stuff. That's the kind of stuff I do in my day job. 

Jeremy:

Nice. And so how did you get started in tech in general? Was it something that you always loved to do or was it something where you started out as a anthropologist and got pulled into tech?

Chris Sells:

Well, it's funny. I am somewhat lucky in that I've always been very passionate about what it is that I was going to do in my life. My earliest memory was I was going to be, I was maybe four, I was going to be a magician. Slide hand tricks and pulling rabbits out of hats. I don't know why that stuck with me. And then my father was a draftsman, so I wanted to be an architect. [inaudible 00:04:33] architecture classes in high school. I dearly, dearly loved it. And then I got my hands on a friend of mines Apple II Plus, and that was it. I was all done. I've been doing computers pretty much full time since my parents bought me my own Apple II Plus, just like my friends when I was 14, and I haven't looked back since then. 

Jeremy:

Nice. I think there are some parallels between magic and development, but I've never met another person that wanted to be a draftsman. That's what I wanted to do when I was in high school. I was pretty set on becoming an architect, and I took all of the civil architecture, even mechanical drafting classes, like that's what all of my electives were in high school, and I helped with the first AutoCAD implementation back in 1992. And that's what got me into computers actually, was I started playing with AutoCAD and then started getting into computers more, but I've never met another person that was in to drafting. I still use AutoCAD, believe it or not.

Chris Sells:

What's funny, AutoCAD is... Well, at least I haven't found the consumer version of AutoCAD, if there is one. I picked up SmartSketch the other day, and I used to use Visio a lot. I have actually remodeled pretty much every home I've ever purchased. And at this point, I know I'm going to do it. So I actually look for houses that are weird in a certain way. Right? I look for good bones, I look for good qualities of the house, but I don't want to pay full price for a house. So I always look for things that need updating, and then that allows me to update it and do it, redo it in the way that I want. So it works best for me by the time it's done. I get to put my own stamp on it. But I do all the interior design, the space planning myself. I generally get the help of a professional to make sure I'm not missing any cool ideas. But I'm there in smart sketch, making sure I have all the right measurements. And in fact, I always get professional measurements so that I know exactly how big everything is, then I start arranging things and tearing down virtual walls. And yeah, I still do all that stuff, because I still love it. It's still really fun. 

Jeremy:

That's pretty cool. I'll have to check out that SmartSketch, because there's an AutoCAD LT that's available for consumers, but it's somewhat expensive. So I find myself drawing up things to justify the monthly cost of it. Several drawings that are sitting around that things that I haven't built yet, but I feel like I have to-

Chris Sells:

Sure, totally.

Jeremy:

... To justify that, but that's pretty cool. So what do you think prepared you best for being so good with development and developing things? 

Chris Sells:

Well, I won't judge my own quality, but the way I never have approached knowledge is that I've always considered myself a lifelong learner. Even before I was playing with my friend's Apple, my mom was a single mom, and she was a librarian. And so my daycare was coming to work with her and being at the library. And there's just nothing cooler than just hanging out the library all day. And I just read everything, it was fantastic. But they also had an old, it was an old teletype machine, had 120 column in feed paper, the alternate green and white strike, and I'm sure it was connected to the local university, some PDP 10 or something, and I would type in maze and it would regenerate mazes for me, I would play on the Wampus, I would play on the Oregon Trail, and I was maybe eight or 10 when I was playing with this computer. And boy, that really got the bug in me and I would just do all that, and then by the time I got my own, I considered myself a full time programmer who just went to high school because I had to, right?

Jeremy:

Yeah.

Chris Sells:

It was funny, but I started my career when I was 14. I was writing interactive forums for data visualization and management, and then I wrote a report generator that used escape codes on my own Epson printer for bold and different font sizes and things. And it's all really fancy way of saying, I wrote a database program to track my D&D characters. Then I used my printer to print up the character sheets to play while we were playing. 

And so I guess the key, and I do this all the time, and I'm working on several projects right now along the same lines, but I always am building something that I care about. It's not my day job, it's evenings and weekends, but I'm always writing some software that matters to me, that I really use in my daily life. And there's nothing better for learning a technology for real, then using it for real. Right now I've got a couple of Flutter projects, that I care about, Flutter projects. And I have to care about not only how do I make the Flutter project run, but how do I manage multiple platforms, how do I pick the right back end data management solutions that work well for Flutter, how do I do distribution, how do I manage the costs if there's backend storage involved? All of the concerns that a software engineer really has to deal with, of which Flutter is a major piece because I'm using Flutter, but it's Flutter in context, if that makes sense, Flutter in the real world.

Jeremy:

Yeah, absolutely. 

Chris Sells:

And I've done this my whole career, starting when I was 14. And that is a fantastic way to actually learn technology in a real world context. 

Jeremy:

Yeah, that makes absolute sense. I have a silly project that I've rewritten in 10 different languages. And it's pretty much just something to gather food items for my family, because I have a giant family. So when we have get togethers, or when we had get togethers, previous to last year, everybody would bring something, bring some kind of dish. So it's basically a potluck application that I first wrote in PHP, I don't know, 15 years ago, and it's evolved. And yeah, it's the same thing. I need to build this, I need to gather the concerns, and I need it to not break when my family members use it because they're going to make fun of me. 

Chris Sells:

Yeah, totally. That's huge, right? This is a real world app, you care, it matters to you. That's a fantastic way to learn whatever technology you happen to have written in it.

Jeremy:

Yeah, absolutely. So lately, there's been a lot of buzz within our company, and people talking about Progressive Web Apps. And I remember you gave a presentation on Progressive Web Apps. Did you explain for the people listening what a Progressive Web App is.

Chris Sells:

Sure, so a Progressive Web App or a PWA or PWA, as how it relates to people's [inaudible 00:12:45], is the idea that when you search a website, you're inside of the browser, and it's very clear you are inside the browser. You see the address bar, you see all the bookmarks. It's a browser, but you really want people to be able to focus on your app, you want them to think about it as an app. And so what you can do is you can provide a manifest that goes along with your website. And it's just a JSON file that provides a bunch of configuration data, but that configuration data then can be used to signal to the browser, hey, I would like to provide the user the ability to think of this as an app. Yes, it happens to be built with HTML, yes, it happens to be distributed over the internet, but I really want to give them an icon and here's the icon I want them to use that... And put it on the homescreen on your phone or stick it in the list of browser apps on your desktop, but really think of it as an app.

And when people install your website as an app, as a Progressive Web App, using either your desktop or your mobile browser, then they have much more closer to an application experience when they run it. For example the address bar is gone, the bookmark bar is gone, it's essentially the browser that just impersonates the smallest possible frame around your content. So it looks and feels more like a real app. And operating systems have been adding more and more support for these over the years and the manifest is getting more sophisticated in there. Over time, we've added things like servers workers, for downloading content in the background and allowing your [inaudible 00:14:44], to be something that is completely offline. Even if you're not connected to the internet, you've cashed the resources you need, you can provide an experience that runs on your device without even having a connection. So that's the idea of a PWA in a nutshell. 

Jeremy:

Very nice. And so what is Flutter for, and I imagine that a lot of the people that are tuning into this will be tuning into it because it's Flutter, but for those who aren't familiar with Flutter, which is one of the ways you can do Progressive Web App, among other things.

Chris Sells:

Yeah, so Flutter is, it's really a UI toolkit or an app framework that is also an open source project. And it's an open source project that was started and largely managed to this day by Google, although we have hundreds of external contributors, because it is an open source project. And it allows you to build applications that have several interesting qualities. One, you can take a single set of source code, and target multiple operating systems with it. And right now, we support six operating systems in varying degrees of production readiness. We've been at production readiness for Android and iOS for more than two years now. We released our 1.0 in December, 2018. We are quickly following on web is in beta right now. So if you want to take your Flutter source code and target and distribute over the web, you absolutely can. And then we also in alpha have Windows, Mac and Linux support. 

So those are more experimental right now, but we're moving both web and desktop towards stable over time, so that it matches the quality and production readiness of Android. So that's one quality, single source code base targeting multiple operating systems. 

Another quality is that the developer experience has been optimized for a tight edit debug test loop that you want. And we do that using a technology called hot reload. So the typical developer experience is I write some code, and then I run my app to see if that code worked, and then I write some more code and so on. With Flutter, the typical developer experience is, I start up, I load my app at the beginning of the day, and I run it immediately before I've changed anything. And then I start changing my code, and the changes are immediately reflected in your running app. Because every time you save some changes, that we hot reload those changes in your app, which considerably shortens the development lifecycle. 

At the same time that we do that, we also, when you're ready to release your app to Android, or iOS, or the web, or Windows or wherever, we give you native code for that platform. So on Android and iOS outcomes, optimized native arm code on web outcomes, optimized JavaScript and on desktop outcomes optimized x86 code. 

And this is native code. This is a native app like any other app on the platform. All the Dart code you write, which is Dart is the language you write Flutter apps in, has been generated into native code. And at the bottom, there's calls into a small Flutter library to do the actual rendering. And those calls are essentially a wrapper around the underlying access to the GPU. So you have optimized fully native, full, whatever the native frames per second that the device provides 60, 90, 120 scrolling, that smooth and matches the platform, animation that's junk free, the high speed video playback, all of those things you want, the native experience as a native app, like any other native app for that platform.

Jeremy:

Yeah, which is really cool, because that's usually... That was the trade off. As you know, earlier, a lot of different companies and organizations have tried to make the one code run anywhere type model work, and a lot of times it'll run in this runtime and don't build games with it. I can remember hearing that quite a few times with certain frameworks years ago, like don't try to build games with it. If you're going to do games, you better go back to native on each device. And so that is really cool that it's generating native code to run. So I'm assuming the answer to the question, can you develop games with Flutter is, it's got to be absolutely.

Chris Sells:

Well, it is interesting you say that because the closest real analogy that Flutter has, is in the gaming world, which is Unity. Unity is it provides a similar developer experience in a similar library, but it provides native apps. And of course, Unity apps are known for being really fast and native, and you build high speed 3D twitch games with Unity apps, but it's the same model. It's an underlying rendering library, and then higher level code that is then compiled down to native code and makes calls into that library. In many ways, you can think of Flutter as the Unity of apps. And of course, as you mentioned, there is a set of people, a growing set of people that are starting to build casual, 2D kinds of games in Flutter. And they work great. There are a couple of gaming libraries for building games specifically with an event loop and the whole kind of thing that you would normally see when you're building games, but you can just build games directly in Flutter too, and people do, absolutely.

Jeremy:

Yeah, that's really cool. And you mentioned Dart. And Dart is a really cool language. I don't know a lot about it, but when I first dug in and discovered it years ago, when it was going to be the JavaScript killer, I believe is what I thought at the time, but I remember digging into it and thinking this is really cool. And do you think that Flutter has evolved Dart into where it seemed like Dart at first, like this was going to be the web language? Do you think that Flutter has changed that trajectory a little bit to where maybe now it's going to be the Flutter language, and Flutter has repurposed it or am I totally off base? 

Chris Sells:

Well, here's the way I think about it. Flutter the engine came first, and all the widget libraries and the design languages, and layout and the rendering, and all of that came second. But it was really this optimized drawing engine that came first that worked in a multi platform way. And then the Flutter team at the time said, okay, well, what is the right language for people to write Flutter apps in that we can then translate into calls to this underlying library at runtime? And they looked at a lot of languages, and they settled on Dart for some very important reasons. One is, it has a JIT mode, just-in-time compilation mode, which enables hot reload. I write my code in Dart, and we're using the Dart JIT and hot reload capabilities to give us that optimized developer experience. But also, Dart has a bunch of native targets that it supports. So when we're ready to release, we take that exact same source code, and instead of using the JIT compiler, we use the ahead-of-time compiler to get the native code. 

And there just wasn't anything that did that. You could either have just-in-time compilation, which meant you had a great developer experience, but a poor runtime experience, or you could have ahead-of-time compilation, which means you had a great native runtime experience, but a bad developer experience or less, not necessarily bad, but not as optimized as you would get with hot reload and such like. And so Dart provided the best of both. It was really the combination of this native runtime library, this optimized drawing library and Dart, and all of the stuff built with Dart, the combination really makes Flutter, Flutter. Dart is a very important part of Flutter. 

Jeremy:

Okay. Yeah, that makes perfect sense. And that hot reload is like it's impossible to undersell how important something like that can be. I know as a beginning developer, I did what probably a lot of people do, and you just lay down as much code as possible, and now I'm going to compile it. Now I'm going to run it and see what's going on and then spend maybe twice as much time figuring out why it doesn't run.

Chris Sells:

Right.

Jeremy:

And so that short feedback loop and the short iterations, I think, is one of the first things that developers figure out over time, like, I'm going to just change this one thing and check it, and check it over and over. So the hot reload, I could definitely see how that would make for a really smooth, fast developer experience. I'm sure there's times where you're still working on something for an hour or two and then checking it, but...

Chris Sells:

Yeah, absolutely. I tend to be a test driven development kind of fellow. So when I'm building anything that's not UI based, I build up my unit tests one at a time and make them work as I add new functionality to my app, and that's how I drive the logic of what I'm building, whatever it happens to be. And then combine that with being able to iteratively build up my UI, and I can see it develop interactively as well. The combination is fantastic. And it's hard to imagine going back to anything else.

Jeremy:

Yeah, absolutely. So what big projects are out there that you can talk about that are using Flutter right now?

Chris Sells:

Oh gosh, there's a bunch. There's eBay, built a whole new vertical for buying and selling automobiles, and they did it all in Flutter from scratch, they're using the same back end as the website that has been around forever, as long as the internet has been around, as far as I can remember. But what they do is they built a brand new app, optimized on automobile buying and selling. So when you're selling an automobile, you pull up the Flutter app, and you can take a picture of your license plate, and it'll go from there, it'll look up what the VIN number is. And of course, Vin numbers are enormously long and hard to enter properly. And from the VIN number, it will figure out the make and model and fill all that data in for you, then you start taking pictures of your interior and exterior of your car and the engine. And it will use machine learning algorithms that they trained to be able to say, oh, that's exterior, that's interior, that's the engine, and then be able to categorize them for the people trying to look at your particular automobile. 

And at the same time if you want to buy, then you can now search all of this stuff. And they built it all in less than a year from scratch, and they had a fantastic experience there, eBay, so that's one. Nubank, one of the largest financial technology companies in South America, built their app with Flutter, and had a really good experience. We at Google, the Stadia Companion App was all built from scratch in Flutter, and it's supported Android and iOS out of the box with the launch of Stadia and of course, recently announced with G-Pay, who actually rewrote their entire app in Flutter. And that was more than a million lines, almost 2 million lines of code that they brought over to Flutter. And then, of course the same source code runs on Android and iOS, all of the apps on Google's smart devices. Smart device is the ultimate expression of our Google Assistant, which as you know is a big part of the Google experience. All of those apps on this marketplace, those are all Flutter apps. That's just a handful.

Jeremy:

Yeah. So it's safe to say it's out there and being tested, for sure.

Chris Sells:

Goodness, absolutely. We have more than 100,000 apps on the Android Play Store alone, that are built with Flutter. We have 500,000 developers building Flutter apps. We continue to be surprised at how fast the developer community is growing and how fast the number of apps are growing, that are built with Flutter.

Jeremy:

Yeah, that's pretty cool. So I know there's going to be a little bit of bias here, and that's okay, but how do you think it compares with things like React, Swift, other platforms that are doing the same thing.

Chris Sells:

I would not want to compare and contrast Flutter versus any of the other frameworks. There's a lot of popular frameworks, and a lot of them, they have their use and their user bases, and they have their purpose in life. We are trying to fill a particular niche with Flutter, if you want the native runtime, good developer experience, targeting multiple platforms with a single source code base, that's what we're trying to do with Flutter. And it's not just those six platforms, but there are other people pushing Flutter into embedded platforms as well and we really want Flutter to be wherever you need to move pixels around, that's where we'd like Flutter to be. We can't do it all, of course, in fact, six platforms is a lot. So we work with customers and partners who want to push Flutter into other places that we can't support directly.

Jeremy:

Yeah, and I'm pretty excited about the desktop thing that you mentioned. I've got a couple of apps on my horizon that I want to build and I want it to be the same on all platforms. So it may be Flutter, maybe what I choose for that when the time comes. That's pretty exciting.

Chris Sells:

I am biased, definitely, but I build a lot of desktop platforms. I tend to target in my own apps, the desktop form factor. And a lot of times I'll deploy on the web with Flutter, but I do all my development on the desktop, just because it works well for my scenarios. And so I always end up with desktop and web versions of my app because of that reason. And it is fantastic that the exact same app looks and feels the same and performs the same in those two cases. It's amazing to me, actually.

Jeremy:

Yeah, that's pretty cool. So what exciting things are coming for Flutter? 

Chris Sells:

Well, of course, we've been working on the web platform, and we've been working on the desktop platform, we've been working on the mobile platforms and of course, we've been working on null safety, as well as other features of Dart, the language to come. We are very close as we record this to the Flutter engage event, which we recently announced that will be happening on March 3rd. And so I would direct you and your listeners to that event, where we have some pretty exciting stuff to share. 

Jeremy:

Awesome. So you've answered this a little bit in the beginning, but I'd like to ask, how do you learn a new technology? When you see something that pops up on your radar, and you're like, 'I really want to learn this new thing," what is your process for doing that, like crack open a book, go to Google, et cetera? 

Chris Sells:

Well, I already talked about one of the things I do, which is once I've committed to a technology, I start building things that matter too. So I mentioned that already, there's no better way to really learn a technology. But before then, as I'm climbing the ladder, I tend to consume as much as I can. If there's a book or the book of the technology, I like to read through that, definitely start searching, getting started with technology acts on the web, and start reading tutorials and getting that kind of thing. Also, one of the things I love to do as I'm getting up to speed with the new technology, I like to find the podcast that actually has been around for a while. And as that technology has grown up, what I like to do is go back in history, and start a year in the past or two years in the past and start listening to those podcasts during what used to be my commute time and I'm sure will be again, someday.

And what I find is reading blog posts, even if I don't understand them immediately, but blog posts from people in that community and listening to podcasts, you get a lot of the fabric of the history, and the goals and the intent of the technology, which I find to be super useful when it comes to actually learning the ins and outs, what to type to make it do what I want, because really when I learn a technology, I'm not satisfied until I understand what the core design decisions were. Why the API is like it is really depends on what were the goals the designers had in mind, what was the mental model they had in their head. And I'm not happy. I don't think I really learned the technology until I understand the why for the technology, what that model is that the designer had. And listening to those podcasts and reading, skimming those books and those blog posts, you uncover these nuggets about what the designers had in mind.

And that to me, is because once you've figured out the why, how it really works under the hood, it's much easier to layer on, oh, and this is the API for that part of it, and this is the API for that part of it. And those are trivial things. You can look those up on Google without too much trouble. And if you don't understand how something works at its core, and why it was built the way it was, you're going to have a lot of trouble trying to get it to do what you want. 

Jeremy:

Yeah, that's a very interesting way of looking at it. I've never thought about it that way. But yeah, thanks. That's awesome. So one of the things for the people listening, so I met Chris through the Portlandarea.net meetup, which is called [inaudible 00:35:54], and I wanted to give them a shout out if you're in the Portland area, and it's not just .Net things. We do technology, all over the map. And after one of the meetups, I'd asked you, Chris, for some presentation advice, because for those of you who don't know, Chris is a very good presenter, very interesting and animated, and [inaudible 00:36:20]. I get some of presentation advice. I'm doing a presentation next month here and some of the advice that you gave me was go up there, and just go for it and open up the code screen and go for it. 

And I didn't take that advice for that next one, only because I was a new technology that I didn't know like the back of my hand, but then a year later, I did exactly that. And so we had a little conversation before this about that, but what is some good presentation advice that you would give to folks who are just getting started and just learning presentation? 

Chris Sells:

Yeah, it's interesting. If I remember correctly, the presentation advice I gave you was, I think you asked, how do you prepare for a presentation? And I think my answer, my flippant answer was, well, I don't. I just get up and I start talking. And hopefully good things happen, which is just terrible, terrible advice. And I'm super sad that that's what I gave to you. Now, at the time, you ignored me, which was fantastic. And then my understanding is when you apply that advice, you knew the technology backwards and forwards, and you got up, and you could just off the cuff, give a presentation, because you really understood it. And that's a case where you knew the why. You knew what the designers had in mind. And so you could take the audience on a tour of, hey, let me show you how this works and tell them about what's this for, and why they care. And so in that one case, and this is the advice I should have given you, which is, you really need to know the technology backwards and forwards. You need to understand the why of the technology to really give the best talk you can give. And my metric is, is when you know 10 times more than what you're actually going to say during your presentation, then that's when you can give your most effective presentation. 

If you just know it backwards and forwards and you get up and talk about it, because at that point, that's really when you can start pulling back the covers and say, yeah, these are the API's and I'll send them to you and we'll make them work, and I'll show you some code, but even more valuable to any audiences is helping them understand what problems this technology was really meant to solve. So they can pattern match, do I have those problems? And how to approach it, what are the core ideas that the designers had in mind, which again, is far more important than any specific function call they have to make.

Jeremy:

Yeah, definitely. Yeah, I thought I'd just touch on that, because it's definitely a new thing for me and I know it's a new thing for a lot of people out there. And now I'm in the advice giving stage where...

Chris Sells:

There you go. Absolutely. Good work. Well, hopefully you have way better advice than I did, and I apologize. I am glad it accidentally worked out for you. That's what it sounds like.

Jeremy:

No, it was great. It really stuck with me actually, because I kept it in the back of my mind. And I'm like, okay, well, this blazer thing is super new, I don't know a ton about it, I've only built silly stuff, so I'm going to over prepare, but then a year later I'm like, yeah, if you asked me to open up an IDE and build a blazer app, I'll just do it, without thinking about it. 

Chris Sells:

Exactly, yes.

Jeremy:

So now I'm going to do it in front of people, no problem. 

Chris Sells:

And in only that very limited case was my advice accidentally useful. I'm glad you ignored me in general.

Jeremy:

Well, I really appreciate it. So do you have any cool projects you're working on right now that you can tell us about?

Chris Sells:

I have been working in the background on YouTube. I've been at Google for over six years now. And I started in cloud. And while I was in cloud, I started this project that I'm still working on to this day. And over the Christmas break actually, I released a big update to it. But this project is based around my deep love and passion for a game known as backgammon. And I don't know if you're familiar with it or not. 

Jeremy:

Yeah.

Chris Sells:

It is probably the oldest board game in human history. It's been around for 3000 plus years, as far as we know. And I just really love it. In fact, I love it so much that most of my family will no longer play with me. And so I wanted to play with robots, and a community of people that were experts as I mentioned, because my friends and family won't play with me anymore. So we had to build robots now. Yeah, exactly. So I'm too lazy to build the robots, but I knew where there were robots. It turns out that since the early 90s, there's been this telnet server that's been run continuously on the internet, called The First Internet backgammon Server, FIBS, so fibs.com. You go to fibs.com and you put your telnet at it. You can actually log in and chat with other people who want to play backgammon and play in tournaments. 

And you play with other people or robots, they have... People have built a bunch of robots that work with FIBS. And the whole thing is all text based. So the program will like show, after every move, it will show you a text representation with ASCII art of the current backgammon board, and then you type in your moves. I want to move from four to six, I want to move from 13 to 21, whatever. And it's all text based. And it's been running since the early 90s. Very few people actually log into the talent anymore. Instead, this set of programs that have sprung up, that let you play has happened.

And the programs themselves, the GUI programs, are of mixed quality, they don't work on the operating systems that I want them to work on, they don't work on the web. And so I told you I like to remodel houses before we started recording. In general, I like to fix broken things. I like to let my office get disorganized, so I have the joy of organizing it. I'm that kind of person. But I have built my own back end server from scratch and just optimized it for what I wanted, but it just gave me so much more joy to take this existing thing that works just fine for what it does, it works great. In fact, we're running forever, and build a GUI that I really wanted to use on top of it. 

And so when I was in cloud, what I did was I built a proxy, a web socket proxy, because if you're going to build a web client for anything, you need to... You can't just talk with [inaudible 00:43:55]. You have to talk via this protocol called WebSocket. And the WebSockets allows the bi directional communication, this constant connection, which is what you need, that's what telnet does and that's what you need, if you're going to have a real time game with somebody on the internet. And so I built this web proxy that would sit on a server somewhere and dial up to the telnet and maintain the connection, and then it would talk WebSocket to the browser. And that fundamentally now allowed me to connect from any browser to the FIBS telnet server. And I built a bunch of that. At the time I built in .Net, and I did a lot of C sharp back then and I built in .Net. Now, I've replaced all that handwritten code with a utility that you can just download from the internet that does WebSocket to telnet proxying for me, and I don't have to write for me contain that code, I just have to run it.

And then on top of that, there's translating all of this unstructured text into the results of API calls. Because of course, you want to write a GUI on top of structured data, you can't be... All of the output of this program was meant to be interpreted by humans. So it's all just text. And there was some starter code on the internet that I took, and I updated. And all this is on GitHub, if you're curious. 

Jeremy:

Yeah, definitely. 

Chris Sells:

It turns the unstructured text into structured API calls and reply. So for example, if somebody moves, you get a structured data structure that says, here's what describes the move, or if you want to make a move, you create one of these things, you send it, and it's interpreted, and you get the reply back in raw text that's been interpreted in to structured text, but built up an API that does that translation. So as far as the GUI program is concerned, I just have an API to a back end, back [inaudible 00:46:16] and back end, right?

Jeremy:

Yeah. 

Chris Sells:

And then on top of that, what I've been doing for the last year or so and this is just one of several crazy projects I've been building in Flutter, but this is the one I've been working on over the holidays, I actually built a back end client that did all the stuff I wanted the back end and client to do. For example, it will show you all the available moves when you roll the dice, all the illegal moves, and it turns out backgammon rules are just wacky enough that it's non trivial to generate all of the legal moves in any given situation on a backgammon board. So I did a lot of test driven development there as I was building my algorithm. And I have test programs where I have little ASCII art of a backgammon board as a starter stage. And then I say, okay, I want to do this, I have this dice roll, what are these list of legal moves, this is what I expect, is that my algorithm give me that.

All right. So all of that test driven development stuff, I use in real life. And so my backgammon client is all of the... It shows all the legal moves, if you click on a piece, it will show the legal moves from that piece. If the backgammon can be oriented, the board can be oriented in different people like to have it oriented in different ways. So I press a button and it'll move everything and it will actually rotate the board, so you can see it, when you make backgammon, you will actually animate the piece as it moves from place to place. And as you push something up at the bar or you move them off the bar, it does all of that. And all of that was Flutter. And that you run on GitHub, it's all built with Flutter, it all works with Flutter web, it's all freely available. You can actually play a complete end to end backgammon game right now today, it's not yet hooked up to FIBS. I have all that code. I've written all that code, but I haven't connected the two yet. But that's my next project, is making so it can connect the two. 

Jeremy:

Wow.

Chris Sells:

So like I said, this is like six years. I've been working on this in on and off. So that's...

Jeremy:

Yeah, that is one a heck of a personal project. That sounds cool. 

Chris Sells:

It's fun. 

Jeremy:

I'm definitely going to download it and try it out. That is really impressive. That's pretty cool. Well, thank you very much, Chris, for coming on the show, really appreciate it. 

Chris Sells:

Happy to, of course.

Jeremy:

Very fun. And you can follow Chris on Twitter. And also, do you have a blog or website or anything you wanted to? 

Chris Sells:

I do, sellsbrothers.com. Actually, that's a funny story. That blog, I started almost the exact same time the first internet backgammon server started back in the early 90s. Lots and lots of blog posts on there from before we had things like Twitter or Medium. In those days, the software everyone built was their own blogging software. That was just the rite of passage. 

Jeremy:

I have a blog and I'm like you with your family food, your potluck app, I've rewritten my blog four or five times over the years as well with various technologies. 

Chris Sells:

But the current version is that sellsbrothers.com, but these days, I spend a lot more time on Twitter than I do on my blog. 

Jeremy:

All right. Awesome. Well, thank you very much.

Chris Sells:

My pleasure. Anytime.

Jeremy:

Thank you for listening to All Hands on Tech. If you like it, please rate us. You can see episode transcripts and more info at Pluralsight.com/podcast.