058 AiA D3 with Aysegul Yonet

Download MP3

Don’t forget to check out Angular Remote Conf!


02:29 - Aysegul Yonet Introduction

02:51 - D3.js

04:29 - Aysegul’s Background in Teaching Computing and Social Interest

09:08 - Using D3

11:49 - Angular + D3

12:49 - Directives

17:17 - Visualization

20:06 - Other Uses for D3

23:51 - Mind Blowing Aspects of D3

25:16 - What’s Wrong with D3?

27:26 - Debugging

28:22 - Animations

29:42 - The Learning Curve and Getting Started (Resources)

30:42 - D3 + Angular 2

Special Offer!

Starbucks Mango Black Tea Lemonade (Lukas)Rosie Revere, Engineer by Andrea Beaty (Lukas)Iggy Peck, Architect by Andrea Beaty (Lukas)Angular Remote Conf (Chuck)Orphan Black (Chuck)Coworking (Chuck)Dashing D3.js (Aysegul)The Bletchley Circle (Aysegul)


WARD: Yes, the hardest question is, pronounce your name. AYSEGUL: It's ay-she-gul... WARD: Oh, like icicle... AYSEGUL: Yeah [laughter]. Every time I say it, people come up with different things. Ice sugar is the kids usually come up with, but icicle, I find it real cool. But, yeah, you can go with that.[This episode is sponsored by Hired.com. Every week on Hired, they run an auction where over a thousand tech companies in San Francisco and New York and LA get on JavaScript developers providing to put the salary and equity upfront. The average JavaScript developer gets an average of 5-15 introductory offers and an average salary of over $130,000 a year. You just can either accept an offer and go right into interviewing with the company and neither with that any continuing obligations. It's totally free for users, and when you're hired, they'll also give you a $2,000 signing bonus as a "Thank You" for using them. But if you use the Adventures in Angular link, you'll get a $4,000 bonus instead. Finally, if you're not looking for a job but know someone who is, you can refer them to Hired to get a $1,337 bonus if they accept the job. Go sign up at Hired.com/AdventuresinAngular.]**[Does your team need to master AngularJS? Oasis Digital offers Angular Boot Camp, a three-day, in-person workshop class for individuals or teams. Bring us to your site or send developers to ours -- AngularBootCamp.com.]**[This episode is sponsored by Wijmo 5, a brand new generation of JavaScript Controls. A pretty amazing line of HTML5 and JavaScript products for enterprise application development. Wijmo 5 leverages ECMAScript 5 and each control ships with AngularJS directives. Check out the faster, lighter and more mobile Wijmo 5.]**[This episode is sponsored by Digital Ocean. Digital Ocean is the provider I use to host all of my creations. All the shows are hosted there, along with any other projects I come up with. Their user interface is simple and easy to use. Their support is excellent. And their VPSes are backed on solid-state drives and are fast and responsive. Check them out at DigitalOcean.com. If you use the code “angularadventures” you'll get a $10 credit!] **CHUCK: Hey, everybody! Welcome to Episode 58 of the Adventures in Angular show. This week on our panel, we have Lukas Reubbelke. LUKAS: Hello! CHUCK: Ward Bell. WARD: Hello there! CHUCK: I'm Charles Maxwood from DevChat.tv. Quick reminder, go check out angularremoteconf.com. We also have a special guest this week, and that's Aysegul-- I didn't ask how to say your last name. LUKAS: Don't mess it up. AYSEGUL: [chuckles] CHUCK: Yonet. AYSEGUL: Yes, that's correct, Aysegul. CHUCK: Do you want to introduce yourself? AYSEGUL: Sure! Yes. Hi, everyone! My name is Aysegul Yonet. I'm a senior software engineer, and I work with this amazing organization called AnnieCannons, which teaches human trafficking survivors how to cope. I do work a lot with D3 and Angular. CHUCK: Awesome. I love D3. I've used it on a couple of projects, it just does awesome stuff. Do you want to give a quick overview about what D3 is and what it can be used for? AYSEGUL: Sure. D3 stands for Data-Driven Documents. It allows you to bind the data to your DOM elements and operate over your DOM elements using that data. Many people think of it as a visualization library, but it's actually a way of working with the DOM, and there's no plug and play charts like Google charts. So, you have to build everything from scratch and you have to define all of your charts. But, it also enables you to create something from scratch that is amazing looking and is very flexible. CHUCK: One other thing that I noticed when I was working with it was that on, say one chart, I could select the segment of data and then it would update all of the other charts to show just that segment of data, which I thought was really cool. AYSEGUL: Yeah. Possible with teaser and less. CHUCK: Yup. And it's also really-- pulling in your data sources is the easiest part. The rest of it, it's "Okay, how big do I want this? What colors do I want in it? How do I make it look the way I want?" I thought, it was really awesome. All of the options you have are just so powerful. AYSEGUL: Uhm-hmm. With D3, you're basically working with HTML, CSS, and the SVG, and you can do anything that you want with the things that you're familiar with. It only gives you some methods to use along the way like, as you said, moding external data is very easy, and it has a lot of array manipulation methods as well. WARD: Can we back up a little bit? Because I'm really curious about the relationship between D3 and the company you work for and the people you're working with. I know you have a long and interesting background of combining computing with social interests. I hope you don't mind, I'd love to go back. For example, last we talked, you actually got you start in San Quentin, didn't you? AYSEGUL: Teaching-wise-- WARD: Yeah. I don't mean that you we locked up there. [laughter] AYSEGUL: I could have been. Actually, I was teaching for Girl Develop It, Black Girls Code, and Women Who Code, and I've been running my own Women Who Code meetups for the last 2 years. Along the way, Hack Reactor, which is a bootcamp based in San Francisco, with The Last Mile Organization, which works with San Quentin prison, we decided to have a bootcamp inside the prison. That gave me a great experience before I dive into AnnieCannons work. WARD: So the people that you're teaching, they know anything about computing? Or, you're giving them their first taste of it? AYSEGUL: Some of them. Well, I would say, most of them. We definitely had some students who never used the mouse before because they've been there for a long time. Average is, I think, 13, 14, 15 years, something like that. These are the people who are, towards the end of their time in prison - they will be out very soon - we want to give them a chance to survive out there. But we had few engineers, mechanical engineer-- I think, one of them is a mechanical engineer. On the other hand, no matter how much familiarity they had at the time, that was long, long time ago. I find myself, sometimes, explaining what Google is, what YouTube is-- never explained what Skype is, but it will be a surprise for them when they get out. WARD: These are all surprises for me, too. CHUCK: [laughter] WARD: The technologies are moving so fast, so I hear you. But these folks are highly motivated because this is an opportunity to come out and actually find work. We hope, I think, that the computing trades are more receptive to people who had this kind of a background. AYSEGUL: Exactly. I've never seen any other group of people that I teach being that motivated. We talked to around 300 people to select from inside the prison, and only 20-something was selected to participate in this program. They're there every morning, 6:30 in the morning and then they go in the afternoon. They tell me, "You know, I go back to my cell, and if I haven't solved this problem, I kept thinking about it and I can't wait to come back and solve it." WARD: That sounds like a tech pro! So, that's that group. The women that you're-- how do you meet the women that you're teaching? AYSEGUL: That's one of the challenges that we have at AnnieCannons that's being really hard. Because there are some housing around Bay Area that gives a place to stay to some of the survivors right after they were discovered, I would say. But we have a lot of security issues so in order for us to go in and meet those people, we have to go through a 3-day workshop, whole day workshop, and all these security checks. They're paying so much attention to keep them secured. But, we have all these organizations that are willing to work with us. They are very excited about giving the survivors a chance to learn and have their own businesses. WARD: Right. And, you're teaching these folks D3? AYSEGUL: No, not just D3. This is a whole program for teaching them any tech skill. This could be, they might end up doing QA stuff, mostly frontend engineering, and hopefully, in the future, we will add some mobile development as well to our curriculum. WARD: I see. So, you're teaching them a wide range of web development skills? AYSEGUL: Yes. WARD: Great. Okay, sorry for that by pass, but it's fascinating what you do. CHUCK: No, it's really interesting. WARD: I know that many of our-- well, I will speak for any of our listeners, but I can speak for myself in saying that there's part of me that's really looking for this opportunities to do that kind of thing. That's an inspiration. With that, let's get back to your tech jobs, which I know were quite good. Tell us then how D3 fits into what you're doing and what your life is. AYSEGUL: I worked in different places creating analytic tools mostly. Everyone has data problem these days so dashboards are useful for almost every company. I've been creating a lot of dashboards and a lot of searching and filtering tools using D3 and Angular together. WARD: The D3 is for visualization of the data. Is it sort of classic graphs and pie charts? Or, you're doing very interestingly weird things? AYSEGUL: [chuckles] The most very interestingly weird thing, I would say, I did on a professional environment is probably the maps because maps are pretty interesting. But I did do other visualizations using 3JS, which is a 3D visualization library as well. WARD: Tell us about the maps, but tell us about that other thing, too. The maps thing would be like, "how do I put pins on a map based on data"? What kind of mapping things are you doing to D3? AYSEGUL: D3 mostly works with SVG. There are few things that you can do. You can definitely put a map and then put some pins on top. But also, you are able to get any kind of worded data from open-source government websites for cities or neighborhoods or the whole road, if you like. And then, you're able to render the way you like it and then, on top of it, you can make key maps or anything you can imagine. It's definitely different than what Google maps is doing. It's not the tiles most of the time. You're working with actual order of data. CHUCK: There's a gallery of examples, and I just put the link into the chatroom for the show notes. You can get on there and you can look. There are few of them with maps. One of them is sort of a heat map that's Choropleth - it's unemployment rate across the country at different rates and scales. It shows you all of the different styling that you put in there and the actual D3 code that it takes to put it together. That's one example where it breaks things down and shows you sort of by county or by area what those are. There's another one that's Force-Directed States. If you grab one of the states and yank it around, then it does some SVG stuff, and that's fun. There are all kinds of things you can do with it. If you want some examples, there are all kinds of charts, bubble graphs, and things that will give you ideas of what you can do with D3. WARD: Okay. I'm going to continue be naive. Imagining then that if I'm writing an application, maybe an Angular application, I might be using the Angular application to sort of get the criteria for selecting some data, then I will have it go get that data, bring it down, maybe massage it a little, and then I would use D3 to render it locally in the browsers. Is that approximately right? AYSEGUL: Yes. CHUCK: Yeah. WARD: So that's how Angular and D3 come together. Is that right? AYSEGUL: That is true. CHUCK: One other thing that I liked about Aysegul's slides was that it show how to create a really quick directive for a graph so you can build your directives so that they wrap around the D3 API, you can actually stick that into your code, and then you can put the information in the way you want it and have it display the graph in the way that you need it to be displayed. WARD: Give us an example of a directive that's simple, one that one could understand on by listening that would do just the kind of thing it was described there. AYSEGUL: I'm going to tell you a story, too. WARD: Oh, tell us a story. CHUCK: We love stories. AYSEGUL: Story of working with the designers at data visualizations. I worked at this consulting company where our designers would come up with these beautiful designs months in advance. They would, of course, use some fake data to design the original visualizations. So if we have data points that are vastly different than each other, we would have some edge cases that would look the actual graphs totally different than what the designer had in mind. This was a common problem that we had all the time. It made it really hard to go back and forth with the designers. I think, what Angular directives are making our life very easy in a way as that we can work with the designers in a much better way. So, I create these directives. I have my own tags for the directives, which is, let's say bar charts or line chart, than any designer could take that and then apply the data to it, used very declaratively using the HTML attributes, and then can see it for themselves how it looks and can do necessary adjustments. The part that I love about using directives with D3s is that I can define every graph in separate directive bar graph in one, line graph in another one, map on another one, and then anyone can use it anywhere in their application. That way, I'm creating a new dictionary of graphs and making it easy to use. CHUCK: So then you just tell the designer, if they're a designer that's actually writing HTML, "Just put a bar graph, tag in here with these attributes," and it'll just magically work. AYSEGUL: Yes. And then they can see and they can bind different kinds of data, which will be in my controller and see if that works for that particular graph. In a way, it allows you to have your own prototyping tool-- CHUCK: That's really sleek. AYSEGUL: Uhm-hmm. CHUCK: Is there a convenient collection of these directives somewhere that I could just pull into a project if I don't want to write them for myself? AYSEGUL: Great question [laughter]. There's one good open-source project that's called Angular-nvD3. It has bunch of graphs from some line graphs to pie charts and stuff. It is really cool, but still, it's limited. You can start from there. And then when you need it, you can add more yourself. Actually, I've learned a lot from reading that code as well, and I was actually inspired by it. It also allows you to decide on the colors, theme, or the data or what have you. That's the way I like to create my directives myself, too. WARD: So the designer's role is to figure out the page and decide, "Okay, I want to bar graph here and a chart there," or like you push this button and it switches from bar graph to pie chart, that kind of thing. And also, to provide their certain flexibility and styling by virtual passing attributes to these widgets? AYSEGUL: Exactly. Yes, true. WARD: Then you, as a directive developer, are actually coming up with these new tags, this new semantic tags representing different thoughts, and you're designing those? Is that right? AYSEGUL: Exactly. And I'm giving all these options; I'm able to give all these options of attributes, which then I can take my directive and use it. I can also give default while I use-- it's very easy to do with the directives. I love that about working with Angular. WARD: Aha! So you're sort of having your conversation with the designer and they say, "Boy, I wish there was a visualization that was like this with these options, I should go over it. Can you do that for me?" You say, "Sure! I'll just modify the directive to pass the right stuff through the D3." Is that how the conversation goes? AYSEGUL: That's true. For the next project, I have that visualization already, it's ready to go and I can just use that as well. WARD: Do you tend to create very semantically specific kinds of visualizations like instead of just saying "pie chart", it's "unemployment pie chart" that kind of thing? Or, is it more, each time, piecing things that are more general purpose? AYSEGUL: What I like to do is create a general purpose charts and then I can use that for any projects that I like so I won't repeat myself. One other really cool thing that you can do with Angular is also give some access or funtions to your attributes on your HTML so that you can define those functions in your controller. No matter what the structure of the data is, you're still free to use the same directives the way that use in any simple data or structure. But the way you access to the particular data points in that particular data structure is through the accessor functions, which you define in your controller. Does that make sense? WARD: Is the controller in the director? Or, is the controller outside of the directive? I'm lost. AYSEGUL: It doesn't have to be inside. You can definitely have outside of it. I usually do have outside of it. WARD: The view model, there's binding to the view model who's driving the outer HTML that has your little component and that's how it communicates? Like the outside view model is the thing that's responsible for getting the data and stuff like that, and then it makes that available through exposing a property, which then on the views HTML you bind to one of the properties of your widget? AYSEGUL: Exactly. That's true. WARD: It's hard to draw these things in the air-- AYSEGUL: [chuckles] Yes. WARD: But, I think I'm getting this game. AYSEGUL: Great. WARD: Yeah, that works. CHUCK: I think we got a pretty good foot bone connects to the leg bone connects to the hip bone. WARD: Right [chuckles]. That's what I found. LUKAS: I'm looking at a Plunk right now-- I linked it so that I can put it in the show notes-- it's pretty neat. It has a chart that you're actually doing an ngRepeat. So just by, as you're declaring your options in the controller, now basically the configuration is actually outside of the directive and then go passing it in, then you're also generating just a straight of data set, which is just the basic JavaScript function. The code, actually, it's really nice in the HTML because you're just saying, "Take the data and this data set, loop over it, and then just go ahead and instantiate this D3 directive with these options," and then, I could just play with the options as much as I want to basically next to taste. It's just like the regular Angular app, which is pretty awesome. AYSEGUL: Uhm-hmm. How beautiful is that? LUKAS: It's gorgeous. AYSEGUL: Yeah [laughter]. CHUCK: All kinds of shapes and stuff. AYSEGUL: Yeah. CHUCK: Very colorful, too. I have a friend that was looking for a good graphing library, and I turned them on to D3. What other uses do you see for something like this as far as people saying, "I need to do X..." or, "I have a problem visualizing Y..." so D3 sounds like a good option? AYSEGUL: Anything that you are doing, like basic stuff like the bar charts and line graph, it's very easy to find some tools like the Google charts, and nVD3 is great and easier to use. But, anything else that you want to do more specific and more interesting will need to start from scratch with D3. I'm pasting a great article I recently found. It's exlaining the mission learning algorithms. I can't read the article myself because the visualizations are so beautiful, I get stuck looking at them. I don't know if you can see it, but while you're reading through the article while you're scrolling down, a visualization on the side of it is happening while you're doing it. It's such a great story-telling, I'd say. CHUCK: I do have to say that that's a big thing that I think we often forget in our code as we look at the data and then we're saying, "These data represent this thing so I want to communicate it well." But in articles like this where you have these visualizations that are beautiful and communicate so clearly, what you're looking at-- the thing that's interesting is that they tell a story and they're saying, "Look, these pieces of data do this and then they do that." It's more than just an illustration of the data, but it actually communicates the points as you step through it and gives you this, like I said, this story that's narrative. We took this data, and then we applied these thought processes to it and then we sorted it this other ways. Then we have these algorithms to it and-- WARD: All I can say is, "Wow." CHUCK: Yeah. AYSEGUL: [laughter] WARD: I'm burning too many to do apps. [laughter] WARD: This is embarrassing. Some of the stuff would just blow your mind watching it. And it's all ring rendered in real-time in the browser. CHUCK: Yeah. WARD: I just wouldn't have believed you could do this. CHUCK: One of the applications that I've done this for is building dashboards for businesses especially if they're doing like lean startup where they have a couple of metrics that they're measuring as they do experiments to see whether or not they're paying off. By having that there and having time data and cohort data and things like that, it tells them that story. It's these groups of people that signed up at different times or overall users, they're liking this and they're not liking that and they're clicking this in there, they're using the app this way. So, you get this kind of overall narrative again of how people are using the application, which is very valuable to those businesses or our experiment is going this way, and overtime, it seems to mature this way. That's the real power of these different visualizations - it puts into terms that aren't just numbers, but it gives you an intuitive feel as things trend up or they're downward or group together, how different data or how different users, in this case, behave. AYSEGUL: Uhm-hmm. WARD: Well... [laughter] I'll never-- yeah. I don't know. I should just give up my job. [laughter] CHUCK: What's the most mind-blowing thing that you've seen or done with D3? AYSEGUL: Unfortunately, I haven't done anything mind-blowing. I think, there are so many mind-blowing things out there. I use D3 doing work stuff most of the time. The data itself was challenging, and the challenge was that to find a meaningful way of visualizing things. But, the visualization itself weren't that challenging. I was put to shame also at the San Quentin prison recently. They are D3 sprints, the time period that they learned D3, they were also visualizing some sorting algorithms like merge sort, bubble sort, and all of them. One of the students there did all of it at once and then went to had start visualizing the prison data because that's the only data that he has access to. I was so embarrassed because it was so beautiful, so nice, and I was super impressed with what they did. WARD: All you can do is applaud it. CHUCK: Yup. AYSEGUL: Uhm-hmm. True. CHUCK: You taught it real well. AYSEGUL: [chuckles] CHUCK: That's what that means. WARD: That's what that means. And it also means that that person, having discovered that for him or herself, has confidence to go out in the world like somebody else. That's rewarding. Alright, you told us all-- we're sitting here, glassy-eyed in amazement, there's got to be something wrong in here. AYSEGUL: [chuckles] WARD: Where is the fish that stinks? What's wrong? AYSEGUL: Anyone want to answer this question for me? I think there is-- LUKAS: It's hard! AYSEGUL: Yeah, thank you, Lukas [laughter]. LUKAS: It's really hard to learn. CHUCK: And there's a lot there. WARD: Is it? Because I'm looking at this thing and say, "Wow! I should be able to do this. I'm looking at this amazing stuff. There's a page scroll.." So now, I'd say, "Aahhh..." AYSEGUL: [chuckles] Yeah. CHUCK: I can tell you that a lot of times, for the bar charts or graph charts, I'll go look at one of their examples and I'll just copy and paste the code, and then I'll start fiddling with it to get it where I want. But there's a lot in there. There are a lot of capabilities in there. AYSEGUL: Uhm-hmm. CHUCK: So yes, the learning curve. But depending on what your use case is, you may only need one little feature, and I didn't find that those were necessarily too tricky to pick up. AYSEGUL: True. There are few basic concepts that you need to understand. One of them is the selections with D3. Basically, each time you're selecting some DOM elements and you're doing some operations over that DOM elements and then you're returning that selection back-- sometimes, you add to that selection-- that's when things get a little bit confusing. People tend to think they have a different kind of selection when they have appended some data to this new selection that they're operating on. I feel like so many people get confused there and give up there. Once you get the selection part clear, I think, the rest of it is just looking at the documentation and finding the useful methods that you need to use. Some of them are like, for creating axis or maybe creating your data or they have some layots as well - for example, tree grass and things like that - I think that part is much easier to figure out once you get over the selection part. But, I feel like people don't realize that they are getting hung up on the selection part and they think that they know what they're operating on. That's where things get really confusing. WARD: Is it hard to debug? AYSEGUL: [chuckles] To be able to debug, though, you still have to realize that you're operating on the selection. So many people just assume that they have the right selection and they don't think about just bacause logging that selection see what they're operating on. I always think that it's just JavaScript and you have all the tools that you need in your console. CHUCK: That's a great tip. I always just inspect it visually and then try to make it look better. AYSEGUL: [laughter] It's so much fun, but it takes time. You have to define every single thing. It's great that you have an axis function that defines-- you can give scales and stuff like that and then define it. But once your data changes, you have to actually change the formatting of your takes and stuff like that. Everything is a manual thing so you actually have to think through the problem, and it takes time. WARD: I'm looking at this wonder page and they're all this clever animation. Does D3 have a built-in animation library? AYSEGUL: Yes, it has some transition methods. So you define before transition and after transition, and then you can define delays and durations and everything else. It's really cool. The D3 animation don't work very well with React as far as I know. But, it works great with Angular and there's no problem with that. That was one of the reasons that I chose to work with Angular over and over. WARD: I'm looking at the wonder page and there's just some amazing things with dots moving up and down... AYSEGUL: [chuckles] WARD: Do you know how they're doing that? AYSEGUL: It's basic SVG transitions. You're defining where it should be before and, depending on your new data, you define a different place. For example, go from this data point to the second data point. You have access to the data and you are able to define those functions that will define the second upcoming placement of your dots. You're able to do them with group elements using the regular SVG element methods. It's pretty easy actually [laughter]. WARD: Really? AYSEGUL: The transitiion part, yes. WARD: Yeah, because it's pretty stunning to look at. What am I looking at in a learning curve here if I wanted to pick this up? What should I realistically expect? Where do I go? Do I come to you? AYSEGUL: [chuckles] There are really cool resources out there. Lukas mentioned the 150-page documentation, and it's really hard to read those things. But, there are really cool videos about the basics. Tonight, we will be recording a D3 meetup at SFHTML5, and it will be available online. And in the Bay Area, there is a Bay Area D3 meetup group. They do have a YouTube page where you can watch their videos and they would go over the basics all the time, and start playing with it. I'll be here to answer any of your questions, Ward. WARD: [laughter] I'm so lucky to live in the Bay Area. AYSEGUL: [chuckles] Yes, we are all lucky. CHUCK: Anything else we should cover before we do picks? WARD: There's the obligatory question I know. I'm not even going to ask what are your thought at all about D3 intersecting in Angular 2 or even heard anything about it. But I just did ask the question. [laughter] AYSEGUL: That was actually my talk at Angular U and ng-vegas. There's a recording at Angular U, but it's basically the same thing. The way I was thinking about it with Angular 1 is creating directives I'm working with controllers and the view and it totally advance to Angular 2. It makes it even clear to have components. WARD: So you see a fairly straightforward transition from the kinds of directives that you've been writing for Angular 1 to Angular 2 components? AYSEGUL: I do. [chuckles] Actually, we do talk about it. There's a video about it on ng-vegas with Patrick and I did [chuckles]. WARD: Oh, yeah. Yeah, I think I even remember that one. We should make sure we include that link for people. CHUCK: Yeah, definitely. WARD: Okay. Well, alright, mind-blown. Time for picks. CHUCK: Alright, let's do picks. Lukas, do you have some picks for us? LUKAS: I have two picks. The first pick is, I've really been enjoying Starbucks Mango Black Tea Lemonade. I've actually been cutting out energy drinks, carbonated energy drinks out of my diet. This is filled a wonderful whole in my soul where [?] once lived. My next pick is actually a book that I bought for my son. It's called Rosie Revere, Engineer. It's by Andrea Beaty, I believe. It's just a really clever kid's book. It's about this girl who is an engineer, but she's got afraid so there's a life-lesson in there. It's pretty cool. I'll also recommend the companion book called Iggy Peck, Architect. They are fantastic. CHUCK: Alright. Ward, what are your picks? WARD: Sorry, [chuckles] I'll pass this week. It's been a rough week. CHUCK: Yeah, he was looking at those animated charts and mind went blank. WARD: [chuckles] Mind went blank. CHUCK: And I let go sometimes. I'm just going to do a quick shoutout for Angular Remote Conf. If you want a discount, you can get it. It's Adventures-- I had some confusion over that-- for 25% off. Prices just went up because early bird ended yesterday as we record this, but you can still get tickets. You can also get tickets for your users group. If you have a place for everybody to get together and watch, it'll be on the 24th-26th of September from 12 PM to 4:30 PM Eastern time. I get that that's during the workday, but it seemed like most people preferred it that way. I'll shout that out. I've also got this guilty pleasure, I've been watching Orphan Black. I've watched all of season one and a few episodes of season two, and it's great. It's a BBC America show, which means that it's BBC seasons instead of American seasons so each season is 10 episodes long. Pretty intense show, but a lot of fun. Finally, I'm also going to shoutout another thing that I've been doing lately. I pulled together Coworking Thursdays. So if you work from home or work remotely, we just meet at the local cafe. Usually, there are between 3 and 6 people there right now. We've been doing it for about 2 months. It's been a really great way to just get together and interact with people who work from home and don't get a lot of chances to interact with other folks who are professionals like them. If you're looking at-- WARD: How does that work, Chuck? Explain how that works. As you were doing this in Utah, but I'm in the Bay Area, what is it in general? CHUCK: I set up a meetup group, and then I send an email. Actually, one of the other guys sends an email out to the users group so he sends it to the local Ruby group, JavaScript group, and Linux group. I'm looking at reaching out to the Python group, the Gulp group, and the Angular group, and stuff like that. What we do is we show up, we're just there from 10-4 so we just grab a table at the restaurant. We spend the time alternating between chatting with each other and getting work done. LUKAS: And eating delicious food, just admit it. CHUCK: Yes. WARD: That sounds great. So you'll just totally inform. You'll just say, "Hey, we meet at a restaurant," and we'd get together, and people show, whoever show shows? CHUCK: Yeah. Because I work from home and I get some social interaction from doing the podcast; I talk to you guys, I talk to that folks over on the other shows. But, it's nice to get some face time with real people. You're real people, but I don't see you face-to-face. Even over the web cam, it's just not the same. WARD: I love that idea because more and more of us are working remotely and want to be able to have that social interaction. It also sounds like a great way to meet to sort of break the boundary, the bubble, of your technology that you're currently working in. CHUCK: Yeah. We have a couple of Rails developers that come. We have a node.js developer that shows - he's doing node and Ember, I think - and some of the other developers who are doing various things. We also have a construction project manager that shows up every Thursday. She found the group on meetup.com, and she wants that kind of interaction, too. So, it's just a really convenient way for her to show up and meet people even though she's not a high-tech person. WARD: How do you title this meetup so that people will recognize that it is something that they might want to come to? CHUCK: We just call it Coworking Thursdays, and people know we're there every Thursday. WARD: Nice. CHUCK: That's just an idea that came out that I really liked. It came out of an episode of Freelancers Show where we talked to Alex Hillman about coworking spaces. I basically asked him what do I do if I don't know if I have enough people to open a coworking space and he threw that idea out there. I love it because there's almost literally have nothing to do to make it go. I just have to let people know every week that they can still come and hang out. WARD: And the price of entry is-- unlike a coworking site where you're signing up for a membership, and it's a financial commitment, this is free form. CHUCK: Yup. WARD: Yeah, nice. CHUCK: Yup. We do it at Paradise Bakery, which is owned by Panera Bread, if they have those where you're at. We just get one of the long tables that seats eight people. Usually, there are three of us that bring power strips so there's plenty of power for everybody, and it just works out nicely. LUCKY: Great tip. CHUCK: Anyway, that's my pick. Aysegul, what are your picks? AYSEGUL: For a newsletter, Dashing D3.js is where I get most of my news. It's such a great news stories and it delivers to your inbox. I love it. I strongly recommend it. I was inspired by your TV series, and The Bletchley Circle is one of my favorites recently. It is about a story in the second world war. It actually park ladies solving some code so it's [?]. WARD: They were the computers of the day. AYSEGUL: Yes, exactly. WARD: They were known as computers. They were human-- computers were humans first. CHUCK: Yeah. AYSEGUL: It's a great show. CHUCK: Alright. Thank you for coming. This has been really fun. If people want to follow up with AnnieCannons or with you or with D3 or anything that you're working with or on, what would they do? AYSEGUL: You can go to AnnieCannons.com to get more information and to see how you can contribute, too. We are accepting hardware donations at the moment. If your company is getting rid of its old computers, just let us know. Uber graciously donated their space. We will have a classroom and an office space at Uber, but we do need some computers to work on. And you can tweet up me @aysegulyonet. I'll put the link down. I will also be teaching a whole day D3 workshop early next month, and I will give you 20% off for the next included on the links. CHUCK: Awesome. AYSEGUL: Thank you so much for having me, and thank you for sharing my passion for D3. CHUCK: Oh, you're welcome. I love it. I probably talked too you much. I should have let you talk more. AYSEGUL: [chuckles] No, I felt I did. WARD: Thank you so much for coming. CHUCK: Yeah.[Hosting and bandwidth provided by The Blue Box Group. Check them out at bluebox.net]**[Bandwidth for this segment is provided by Cache Fly, the world’s fastest CDN. Deliver your content fast with Cache Fly. Visit cachefly.com to learn more.]**[Do you wanna have conversations with the Adventures in Angular crew and their guests? Do you wanna support the show? Now you can. Go to adventuresinangular.com/forum and sign up today!]

Sign up for the Newsletter

Join our newsletter and get updates in your inbox. We won’t spam you and we respect your privacy.