241

241 JSJ Microsoft Docs with Dan Fernandez


0:55 – Dan Fernandez and his work

7:50 – Walkthrough of the doc experience

15:00 – Editable nature of the doc

21:00 – Test driving a language

26:30 – Catering to the user

32:30 – Open Source

34:40 – User feedback

37:30 – Filters and Tables of Content

40:45 – Form submissions

41:50 – Community contributors

Picks:

Ghostbusters (AJ)

Daplie (AJ)

Daplie Wefunder (AJ)

.NET Rocks (Charles)

ScheduleOnce (Charles)

Devchat.tv 2017 Conferences (Charles)

Disable HTML5 Autoplay (Dan)

Visual Studio Code (Dan)

JSJ episode Visual Studio Code with Chris Diaz and Eric Gamma (Charles)

This episode is sponsored by

comments powered by Disqus

TRANSCRIPT

Charles:    Hey everybody and welcome to JavaScript Jabber. This week on our panel we have AJ O’Neil.

AJ:            Yow, yow, yow. Taking back at the internet right here at the Microsoft Offices.

Charles:    That’s right we invaded. I’m Charles Maxwood from Devchat.tv. We’re here with Dan Fernandez from Microsoft. Do you want to give us a brief introduction?

Dan:          Sure. My name’s Dan Fernandez. I’m the Inspector General, if you will, of docs.microsoft.com, our new documentation site for all of our technical docs on Microsoft.

                    I just want to give you guys a quick tour of some of the stuff we’re doing. About a year ago I moved over to our docs team, I run few of the actual teams that build the documentation for things like [00:01:23] service, Visual Studio, ASP.NET, C#, Power BI and so on and so forth. But one of the big things we also want to do is to improve our website experience. When we looked at MSTN which was our previous experience, it was legacy code that was about 10 or 15 years old. If and parts of it were probably even older. Some cases were 30 seconds. The way it was designed, it was dynamic and did sequel lookups. To things like a redirection, it would have to look through a redirection table before it actually served the page which will basically block. It’s just a number of things you know not to do these days.

The infrastructure was designed before the idea of a cloud even existed. A number of things were really difficult. 300 on premise servers reserved millions and millions a month. The challenge was the team couldn’t keep up so a bunch of teams just built their own sites. The ASP.NET team decided to build their own team called ASP.NET. Even more recently, for their new version, they built docs.asp.net that was built on to Read the Docs. SQL Server built out some of their own pages. [00:02:49] built their own pages. .NET Core, when it first came out, decided to build their own pages.[00:02:55] built its own web pages. Visual Studio had several, like the Apache Cordova team had a site called TACO for Apache Cordova. taco.visualstudio.com.

For a customer, it was really hard. If you’re a web developer that uses a database and you want to deploy the [00:03:13] and you had authentication. Our authentication articles were under in one different website. The SQL data article we’re in another. The data programming libraries which our entity framework run another site and that was on GitHub.io. The reference site was on MSTN. The [00:03:29] appointment was either on [00:03:31] or sometimes just in team services. Literally, the experience for our customers was you go through six different sites. Or if you just want to find content, you’d be like, “I can’t find the article.” And it turned out it existed or we do bad things like sometimes we actually duplicate articles and then forget about that we posted it in one. It’s like this article is broken and it’s actually been fixed to because the team belongs this.

We basically ship our organizational chart in our documentation. What we want to do with [00:03:57]is just clean the path, have a unified way to do technical documentation and actually include things like what we call a contextual TOC which is a TOC that allows you to bring in articles regardless what org shipped them. As simple as it may be, it’s basically a view of content. I want to have this content, maybe some of its [00:04:18], some of it is Visual Studio, some of it is ASP.NET. Those are all different orgs. I just want to list them all together because a normal dev needs authentication, database, ASP.NET, some tooling stuff in [00:04:32]. That’s just one example.

Comparing and contrasting a number of different things on MSTN, it’s just really hard to even find what stuff or products you want to do. Like how long it should take you to find the things you want to do, especially for developer. In fact, we actually built a new landing page that jumps to this, which is developer.microsoft.com, which is for products but then what if we just took a step back and said what devs really want to do and how do they want to build apps. Whether it’s rebuilding Windows, bots, SharePoint, Node.js or even things like Java which you may not have considered on a Microsoft website, Python or gaming or holographic. These are the things that you normally build an app for.

A lot of the things that we mention with the new mobile center, I want an app that synchronizes your data. I have a field sales, they take some stuff and then it syncs back to the cloud, beta distribution, device assessing as I mentioned before, we want to test on 40 different devices. Analytics, to make sure that it works and then do things like continuous integration of having multiple devs maybe multiple GOs. I want to make sure that people are checking in quality code, it compiles, it works and so on and so forth.

There’s a number of things that we look at whether you’re building your app or adding a service and really taking more of a customer views. Things you tend to not find are the names of the services because this is another confusing part where people didn’t know what’s the term “Hockey App.” That means beta distribution, right? If you’re a beginner, new to Microsoft offerings, you really just want to know like, “Hey, what do they do for beta distribution?” That’s Hockey App. Those sorts of things.

Charles:    To your point about Hockey App in particular, it’s a term right? It doesn’t mean anything to anybody unless they know what it is.

Dan:          Right.

Charles:    I hired a business coach and her big things is, explain benefits not features. And so, beta distribution is a benefit. It’s kind of a feature but people understand what the benefits are of that. It makes a lot more sense to look at this and write your documentation to what are people looking for, not necessarily what do we call it or something like that.

Dan:          Right. Exactly.

Charles:    The other thing that I find interesting about a set up like this is that, I think as developers in particular, we really have this tendency to, we want to write the code, we want to solve the interesting problem and then the next person that comes in that wants to use our code to solve the interesting problem. Nobody wants to write the docs, right? Nobody wants to do this job and then what we do is like, “Okay, I’ll just throw it all in a ReadMe.” But actually, having it well organized like this is really helpful as well.

Dan:          Right. Let’s just walk through a couple of docs here to just share the experience.One, again, it should be really obvious. We have docs on these things and jumping through. A lot of times people don’t know even what [00:07:58] is.  Making sure we have guides, whether you’re an IT operator or a developer or getting started videos is the key. If you actually know what you want to do, one letting [00:08:09] machine’s[00:08:10] here and we’ll go through some of these articles. But one making sure simple things like all the documentations available, downloadable via PDF on this left side, there’s some…

Charles:    I’m going to stop you real quick because we are looking at this but our listeners are audio only.  Basically, what he’s done is he’s gone through and he’s just kind of click through the hierarchy of things, he clicked through the [00:08:38]and then [00:08:40]machine documentation and is just showing us some of these aspects of what’s available and then over on the left side of the screen he’s now into a search bar or filter bar or something. Go ahead.

Dan:          Yeah. One of the challenges is there’s some human hesitation of clicking enter because you know the page is going to reload, it’s going to take three seconds and you don’t know if it’s going to be crap results. We kept fighting with this from the user experience perspective and given that it’s such the simple TOC we actually filter on the client side, so it doesn’t even do a call back. We can basically filter and let’s just do a search for…

AJ:    What’s that written in? I’m curious.

Dan:          I mean, obviously, JavaScript but I think we’re just using jQuery and there’s some place where we use, I believe React and then some libraries for mobile. Back to our other experience, other key things that we wanted to do accessibility. Accessibility is huge and if you turned on the totally tester this should hopefully all pass.

Charles:    Is that a plug in for using Chrome?

Dan:          No. It’s actually like a JavaScript Markit from our dear friend at Khan Academy. But it basically does the color testing which is great. And again you have to do that it on every site.

Charles:    How interesting. Okay. It’s tota11y because 11Y is accessibility.

Dan:        Yes. Khan Academy publishing is just a great way to test colors but there are plenty of examples were on our own sites, we’re just really bad from accessibility perspective.

                    Another one, localization. Certain teams, because every team decide to reinvent [00:10:33] we basically had, I would say just within our clutter and enterprise teams. I’m not even counting Windows and Office, we probably had about 17 different engineering teams building websites for documentation. Like, “Okay, here’s how we’re going to present it. Some teams are going to use markdowns.Some teams are going to use Umbraco. Some teams are going to use Read the Docs. Some teams are going to use GitHub.io and then do engineering across it.

Charles:         It seems like a colossal effort just to bring that all together. How many versions did you have to sacrifice to make it work?

Dan:          This is the biggest problem that we had. Each team has their own potential version. The way that they’re specifying their markup in our old system. The MSTN systems it was an XML file in the more modern systems it is markdown which is nice for Read the Docs. It was a markdown. We had to build basically transfiler to basically say, “Okay, if this and that if you will.” Here’s the markdown that we need to transmogrify to make everything one unified set of markdown and then markdown extensions.

                    It’s actually a huge engineering project when you think about Visual Studios 25,000 pages. Doneit Framework has 270,000 types.

Charles:    Wow.

Dan:          You started thinking about just the scale of some of these things, it’s really big. We did not ever design MSTN for mobile. If you ever tried to see our pages on mobile we did everything using table. That’s cool. Everybody love tables for layout. That’s how we did layout back in the day. We didn’t change it for a long time.

Charles:    That’s okay. Nobody’s looking at the stuff on mobile.

Dan:          You’d be surprised.

Charles:    I’m totally joking.

Dan:          Oh okay.

Charles:    I’m guessing that more than half of your traffic is mobile.

Dan:          Our numbers were, I think low because it was a terrible experience. Nobody likes scroll write on a table and when you’re zoomed in. Even things like fonts word small. There’s just so many from user experience that we wanted to fix. Now we have our responsive like layout. As you go down, we go to the two frame and then we go to the one frame as well. The whole TOC is here, of course if you still need it. And then options things as well you can go through.

Charles:          He’s kind of shrunk it to the side, the TOC or table of contents kind of went to a drop down which is pretty cool.

Dan:          Then just simple things like developers, we have light and dark themes. For those of you who live and breathe inside editors and you hate seeing code samples in a non-dark theme, it’s just a simple I would call it a stupid pad trick but you’d be surprised how many developers actually asked for this in user course. That’s probably one of the other key areas when you’re building a large website, you have a lot of people that have opinions. That means both our engineering teams that we worked with a partner team that are doing,“Hey, I’m doing the content for this. I need this specific thing.” The windows team wants great colorization for XAML. It makes sense because that’s their language of choice. This team for example is the Azure CLI team, the command line interface. We actually built a custom colorizer for them by taking, analyzing their keywords and parameters so that way, instead of this just being one solid monochrome, we can actually understand and parse their keywords and it actually looks a little better I think on this where you see both the blue and the green colorization there.

                    It’s how do you make the experience of documentation beautiful is a challenge and making sure that you can hit the constituents. Certainly for customers, we’ve obviously been talking to our Azure advisers, we’re at the MVP summit. The connect event that happened just yesterday. But then anybody can walk up to our site, click on the feedback in our footer and give us feedback for UserVoice. Actually, dark teams was one of the ones that had been on there probably three years, four years that nobody had dealt with, for the lack of a better word.

                    Now the other really big thing on how we approach this is everything is editable and everything’s on GitHub. I should say almost everything there are some theme the have

AJ:            Oh that’s cool.

Charles:    What do you mean it’s editable?

Dan:          I just click edit on the page. I’m on the page for Linux VM using Agar CLI 2.0, I clicked edit and this is basically the raw. We do have some metadata at the very top for things like our search service, you can do scope search but this is all just marked down, there’s no fancy things. If you see some errors like, “Hey,you guys forgot a comma in this JSON. You can submit a poll request. Change its file, submit a poll request directly from here.

AJ:            I love that.

Charles:    That is very nice.

Dan:          And all the content also is creative comments including commercial use which is another thing, if you are a book author, you wanted to reference some of the stuff, you don’t have to sign a contract with Microsoft to have some small part of our reference APIs. The joke was our documentation was more restricted than our Open Source or products or content. It was that bad, now everything is creative comments and we don’t have to worry about it.

                    It’s just huge on how we are embracing Open Source, you think about all of this documentation is available and including the engine that we use is called dock effect which is on GitHub and Open Source. You can do the same things we are doing here.

Charles:    What’s that? Created by Microsoft or is that some new [00:16:30]

Dan:          Yeah. It’s actually something created by Microsoft. Dynamically, building reference is one of the most difficult parts. There’s some bug that they had this. This should have an edit button. The point that I was going to say here is our Azure CLI and I know they had mentioned some bug over email that I didn’t get to catch up on but I guess they took it down. I think the big thing to take away with our reference work is one, things like the .Net Core framework, ASP.NET Core framework that adds your command line interphase and your Java suitcase and our other language suitcase are Open Source.

The way we are building documentation is by introspecting that source or maybe those packages or so on using either code reflection or assembly package reflection. The point of that though is when you click edit on our pages for reference, you’re actually changing the source, if you will. If you make a change there maybe it’s as simple as a typo or it’s adding an example for something that doesn’t exist. It actually going to improve the actual command line reference, let’s say Azure command line reference where there is some command line, I don’t know maybe to get a log file or something. You add it in there and now everybody gets it. You’re not just helping the documentation pages, you’re actually helping build a better product by adding examples. That’s really I think huge and something that we didn’t have before that we wanted to do.

                    And then another project was the project called constructors, this is an internal project that basically allows us to do a paralyzed builds with Docker to basically make sure all our examples will work. It’s a simple thing but we do thousands and thousands of examples if you think about all Microsoft products and there is little to no testing and there really should be a lot more things to do verifiability. Does the thing actually compile? Does it have the output that it should? Even being able to tell customers like, “Hey, this build is passing.” And then being able to do things like verify what versions it works with. If I’m trying to use an API and I don’t know why it works maybe it only works in 3.0 and above. We can actually pancake the code sample and put version. Hey won’t you try on version 1.0, 2.0, 3.0 and so on. And then actually present the customers, hey these are the versions that it actually works on as opposed on somebody having to document that, we can automate all of that. We want to make the simple process for people too. The moral of the story is, customers, when they seek code samples they should be verified and know that they do in fact work. Then even some of the other stuff that’s probably silly because a lot of times people are copy pasting samples, you couldn’t even download the samples or didn’t include say maybe using statements or what NPM package were included or anything else. Now, because everything is going to be on GitHub, you can download just that sample or all of our samples. And everything is Open Source as well and you can make sure that verifiability is there.

Charles:        That makes sense. I think we’ve all been in that place where you try something out and then oh, you don’t have the right version of the language, the right version of the library or things like that. I’ve actually recorded screencasts and I didn’t tell people what version of Ruby or Rails or Angular I was using. There’s some API. It’s just different. That super frustrating because then it’s like why isn’t this working? I have the NPM install this package and oh now it works or stuff like that.

Dan:          Yes, exactly. It’s incredibly frustrating for the person who’s trying to get started and sometimes people just give up and like, “Okay, this is too hard. I’m going to go try something else.”

Charles:        Yup.

Dan:              I think it’s a lot of, especially people are new to something, how much friction is there in getting started like if you’re going to give me 23 steps to setup my environment, that’s way too hard. I don’t know if I like you that much. I don’t know if I want this commitment. Can we just go get talk over coffee if you will? From a developer’s perspective.

Charles:         I came to your website first date. We’re not kissing yet.

Dan:          Exactly. You want to put your bits on my machine? This is scary. If you think about it that way, browsers are great, could we build a system that you can walk up and try even our server side language. I used the example of D3JS but there’s plenty of sites that have interactive examples even our Bing match JavaScript [00:22:31] where you see live samples into coding environment. The samples there and then you can play with that, here’s how I edit push pin, here’s how I did this specific thing and then you can riff it. You are mentioning some of the ones on Plunker as well.

Charles:    On the Angular, Angular.io, because I have a tutorial, Getting Started with Angular, I think it walked you through building the tour of heroes which is their kind of example. At any point you can basically just click on the example that they have there, loads it up to the Plunker. You have the code on the left, whatever puts out on the right from the HTML or DOM manipulation. It’s really nice because you get that visual effect. You showed us that here in the browser.

Dan:          The .NET team HAS built the same idea where there is two panes, the code pane on the left and let’s use the Monaco editor that’s used in Visual Studio code, and on the right side is basically output, really what we’re doing is this is server side code, it’s C# and I just typed, I’ll change, there a console that right line which basically writes a text to the console. I changed the hello demo and then clicked run. It compiles in the cloud and basically using a web API sends that and says, “Oh, here’s what I want you to run. Here’s the output of it. And let me send it back in the browser.”

                    If you’ve never run your first line of C# code, what we would tell you to do is maybe before Visual Studio Code exist, because that’s probably the easiest way. We tell you to download Visual Studio community, that’s 3GB. The installation was an hour. Now 4GB into and then it’s really, really faster to run Hello World. But if you’re just brand new to the language, you just want to take it for a test drive, the browser’s a great way and this is not every developer’s going to spend every day on their browser and the browser’s going to take over things. I don’t think that’s realistic. But if you’re just trying to test drive and get familiar or maybe it’s familiar with the new API. Like, “I know this language and I don’t know this API. Let me just play with it. Here’s an examples that already built and let me just riff on them.” And really, thinking about the browser is a way to test drive things.

AJ:                Is this example done with Azure functions?

Dan: In this particular example it’s actually using a web API that’s using an Azure app
service but Azure functions is great way that we’re looking especially for the
cross platform. What happens if I want to be able to do this for Node.js and
Java and the only thing you’d be paying for is execution time. If you limit the
execution time, this thing probably ran in three milliseconds, you could do a
10,000 or a 100,000 calls in three milliseconds and pay a nickel or I’m not
sure of the actual numbers to be fair but it’s incredibly cheap when you’re
just paying for the execution.

As people trying to push the envelope of what you can do on the web, function is a great thing. It’s like I don’t want to have 10 servers sitting there waiting to scale up or scale down and because every person is [00:25:51], I don’t need to maintain any state for this. You’d just basically run and execute. In some cases you may want to maintain state, but really the state is the left side, if you will because the compiler isn’t going to maintain state. There are just a lot of cool things that maybe developers haven’t even thought of that they can take advantage of functions especially when once function supports. I think they had PHP in experimental Node.js, Java, .NET, PowerShow just, the number of languages grows and it’s just a great way of to get starting with something simple.

AJ:                I noticed before you clicked on this, there was the dropdown, choose your
language.

Dan: Right.

AJ: You’re catering the experience towards based on what
someone is familiar with already. There is additional comments or additional
pictures or examples or something.

Dan: Yeah, exactly. This is the goal and if you all know Rob Eisenberg from Aurelia? Have you heard
Aurelia?

Charles: He’s been on the show.

Dan: Perfect. I heard of Rob about three months ago to help improve docs on microsoft.com. He looked
at this and said, “Yeah guys you have been looking at some of the Aurelia
stuff.” Because Rob did this pretty well when he was doing the lock through of
Aurelia. I think the idea is how do you talk? And things like, “Hey, if you’re
familiar in Java terms, Maven is new get is, for example or NPM package, if you
will.”

Charles: It’s like iATN for programmers?

Dan:             Right. It’s sort of. You want to be able to do that. It’s in your language. And then some of the
other stuff a lot of times, we would assume everybody’s turning from Visual
Studio and Visual Studio on Windows. Given how much we’re targeting other
platforms, I think I was mentioning before the Linux number when such it first
announced that he did this great slide of Microsoft loves Linux, it was 20%. That’s basically 1 in 5. It’s already 1 in 3. It’s 33% was what we announced.
Obviously that’s a lot of growth in what was maybe a year or so from a
timeframe.

We are finding people that would say, “Oh, okay. You used to be the Windows Only Company and now look how many tools you’re building for Mac, look how much support you’re doing for Linux.” And we’re just doing the Linux foundation for example at the Connect event. They are seeing our investments and they are being like, “Okay, we’ll give you all a shot and we like what we’re hearing.” For lack of a better word. We want to make sure that our tutorials also don’t assume that you’re using Visual Studio, some people love command line or that you’re on Windows and that’s actually a big thing for us. Even in our language that you would think is traditionally Microsoft language like C#. We’re making sure that we support Mac as well.

Charles:       I think AJ does most of his programming using Black Magic and Vim.

AJ:               It’s 3/4 Black Magic, 1/4 of Vim.

Charles: Vim is Black Magic. I’m using Emacs.

AJ: Oh. That joke’s old.

Charles:       Never mind. Everybody’s history is different, their experience is different. I grew up using Ruby and now I’m getting more and more into JavaScript. I’ve been playing a little bit with more of the functional languages like Erlang and Elixir. Then, it’s like, “Oh, I’m going to hit this. Which of my experiences is it like.” What context is really going to help me here? I did some Java in college but I wasn’t that serious about it.

Dan:             Right.

Charles: I’m pretty comfortable with JavaScript so I’d hit the JavaScript. But somebody else coming from somewhere else, in C++, the paradigm is just different.

Dan:             I think these are just some of the examples on where we’re taking the getting further experience in our APIs and making sure that things work well by default. This is just really, really specific things. We basically have Java packages before,
if you want to find all Java packages that Microsoft ship, there was no way
because going back to that hole, hey 20 teams are doing their things the SQL
server thing had Java support for really, really long time. And then other
teams like DocumentDB, Azure sorted adding all this different APIs in SEKs. It
was scattered all over the place.

Even from an API perspective, one of the things we’re doing is if you walk up to say slash Java, slash API you would see all Java APIs for the company. Obviously we’re still on boarding some dimensions to some of the challenges across the company, but you should be able to walk up and see what does Microsoft offer for all across the company for Java developers. Because we have things for bots, we have things for Office and OneNote and even Windows development specific things like Cortana on the Java side and Android side. There’s a ton of things that we’re doing and it’s really hard for a customer to even find all the things we’re doing and there’s a number of things we’re trying do and help with. One is having some way to filter everything else and then being able to sort. “Hey, I can sort by say Platform, by Release and so on and so forth.” Obviously, there’s a ton of work and it’s always a moving train, if you will. But this is probably our biggest update since our original update and we only launched in May and then in November we, basically yesterday, we moved all of ASP.NET, all of the Azure, all the Visual Studio 2017 and then all of C++ content over because there’s still a huge number of C++ developers. In the future we’re adding a number of different team. Oh and SQL Server on Linux was the other one, we have a lot more on board, Windows Office and definitely other teams like Dynamics and so on.

Charles:          One thing that I’m wondering about because this is really helpful if you’re working in some of the areas that Microsoft offers. If you’re using Azure for back end stuff, Azure functions or whatever, this is helpful. But a lot of folks are contributing to Open Source on their own. They have their own Open Source projects, working on Open Source. I think I mentioned before that documentation is the thing we all dread to do because it’s more fun to solve the problem than it is to talk about how we solved the problem. I don’t know that I need something at this scale but if I have a semi complicated library that I’m pulling together, what advice do you have for me to explain to people how to use my NPM module or my friend in JavaScript library that I’m pulling in so that they can make the most of this kind of thing without getting overwhelmed and going, “Well, I don’t have time to put together all the thing that Microsoft built.”

Dan: Right. One of the things we’ve done is Open Source at least parts of the engine that do the introspection of the code. Right now we support .NET and Java, we are adding Node.js and Python in the next few months but the idea is hey, we can spit out a pretty reasonable documentation just based on you adding comments into your source. It does the introspection, listens to a GitHub webhook, you set up the build server and then it spits out HTML files to wherever you want. That could be an Azure storage account or website you already have, etc. That kind of like an automated equivalent of the webhook listens, the CI process runs the
command line and then that part of the command line is tell me what locations
to drop files. It’s easy for the basics. That’s it.

                    There’s a number of things that we add that is probably overkill for most folks. If you already used all of our soft on demand build engines that are just waiting for jobs because we know we have so many editing jobs going or we’re using things like Akamai which is kind of overkill for folks on the CDN part. We too do in-line annotations as well using Livefyre. If you have a question or a comment here, this is probably one of the things, we see about 85% of people just using the regular comments on the bottom of the page but sometimes you basically have a question hey on step one part two, I have a question here and like trying to do that in a comment versus trying to do that in a side note is pain. But we really think about it as kind of a service that we just add to the page. Probably one of the other unique things that we wanted to do is make it, it’s basically static content, it’s a billed process that spits out static content and then we do JavaScript on top of it. We know it’s going to be sad if their content isn’t going to be changing unless somebody does a poll request to change it and that really improves performance unless you have a CDN in front of it and so on and so forth.

Charles: And it is more secure potentially.

Dan: Obviously we do light up some things like, is this page helpful, control and probably some of the other silly things that we had from somebody’s controls before. I didn’t want to mark in this whether it’s true that I said it was helpful. We would always had this control that basically gives you a yes-no and it was almost
meaningless data. It’s like okay, you said it’s no and I don’t actually know
why. So we started at just simple things in user behavior where you said hey
what are the things that could improve the documentation because you get the
same option to your like fix in, I could now get a content, add additional
information or detail, fix typos, add a fix code samples and so on. And this
actually helped us quantify like hey, do our code samples suck or our code
samples not working?

Charles: Right.

Dan:             If you just have a yes-no like a thumbs up-thumbs down you tend to not get any comment. Just by adding the checkbox and not making it too obtrusive, we actually ending up with people giving us more comments like hey, step three of the our source code didn’t work, or the third example didn’t work and it really helped us get more feedback to improve the quality. It’s sometimes just the little things.

Charles:       Makes sense.

AJ: Did we re-talk about the filter thing? How it was using in the docs, you just mentioned how everything is running statically but then you got some JavaScript on the front-end and previously we talked about what the JavaScript on the front-end but I don’t know if that was dropped or not. We can totally hit that.

Dan:             Just another thing that we added is every page has a left of table of content. When you’re on an article, you’ll see at the very top, filter. What you see from people’s
behavior is anytime you see a textbox, there’s a hesitation, this is going to
take two seconds or it’s going to take me to another page and we didn’t even
want to submit here, right? There should be hopefully, no trying to take away
that hesitation that the results are going to suck. It’s kind of a type ahead,
people have seen this before certainly but if you just started typing say VIR,
you’ll see all thing that start with VIR. SSH, I’ll see examples that say, hey,
here are all the articles on creating SSH keys, disabling SSH and so on and so
forth. And it makes it that much, the more you get comfortable like okay, I
don’t have to hesitate with using the web feature the more likely you are to
use it, the more likely you are to use it on a regular basis. It’s like I can
trust this feature, it’s going to do this, and it’s not going to take five
seconds or show an ad or anything like that.

Charles: It’s a function that being static and then just basically accessing the DOM to see whether or not [0:39:04]

Dan:             We basically have a JSON file that represents this and you can actually see it our [0:39:10] as well for how we structure this. And we basically traverse it using the
search pattern. Because this aren’t large we actually do that in the client
side. There are some cases where you actually want to do it more in the server
side but still provide the type ahead experience but in this case it like hey
we know the use case, there is never going to be 10,000 items on here, we can
just search this.

Charles: That’s super nice because like you said I could say frustrating, especially when I’m in mobile where hotel Wifi, “I just want to find this small thing and I’m sure that it’s nearby.” And then it’s like, “Oh, wait for 17 seconds.” And the Wi-Fi failed and now I lost content on the page.

Dan:             Yes. And you click back because you want to resend the results and there are just the more papercuts, you can just remove from developer’s lives the more grateful they are.

Charles: That [00:41:04] you save by removing the paper.

Dan: Exactly.

Charles”       One of the things that happen, is you get back and then it’s lost all of the state.

Dan: Yes. I can’t tell you how many forms like there should like a site where you can just shame terrible forms. It’s like shameforms.com, it’s like how dare you lose my zip code address and everything every time you force me on a bad password.

AJ:                Or there’s an apostrophe in your name and then it comes back with every field blank and have a message at the top, which doc in the 1980s.

Dan:              It’s pretty bad for sure. And actually just one of the other things to talk about even just for Azure docs we get over, I mean a hundred, around 200 community contributors a month, improving our documentations. You can see the trail of all the people that have actually contributed to this article.

Charles:        Sneaky, sneaky. I see how you got to be the number one contributed to organization on GitHub. Every single page on your whole website has ad about it, with 10 people have contributed something.

Dan:             It turns out a lot of people wanted to make our docs better. If you build it, they will come maybe is the thing and there’s still a little bit of a Wikipedia experience in other words but if you will look at the total traffic of how many people are
visiting these pages versus how many people are editing and maybe it’s fixing a
broken link or code sample or whatever. It’s a small fraction but as small fraction
of a large number is huge and it’s making the lives of everyone better. That’s
one of the things obviously we cared so much about our communities in our MVPs. They are actually tracking, hey, who are the top contributors that are really
making the lives of everyone. There’s sort of this exponential effect, you help
this specific article it probably helps hit 50,000 people a month. That’s huge
if you can help the lives of 50,000 a month just by making one small change
when, “Hey. I got stuck here and I’m using a [0:43:12] and you have to do this.”
If you’re using a [0:43:14] and that’s really awesome.

Charles: Cool. I think we probably have to start wrapping up. If people want to check or if they want to follow you on twitter and see what you’re working on or anything like that. What are the best places to do that?

Dan: Check out docs.microsoft.com for a test drive and my Twitter handle is @danielfe.

Charles: Okay. One thing we do want when we wrap up shows on our show is we do what are called picks and they’re just shout outs about anything you want.

Dan: Okay.

Charles: We’ll go ahead and go first but, we’ve had picks for coding tool, we’ve had picks for TV shows, movies, music, whatever. I’m going to make AJ go first.

AJ: Good, because I just thought of something, just now. One thing would I pick is the 2016 Ghostbusters movie and I was a little bit worried about it. I waited to see
until I could see it for free on a plane when I saw it. But it turned out it
wasn’t terrible.

Charles: I was worried it’s going to be terrible so I never went to saw it.

Dan: Me too.

AJ: I thought there’ll be like a lot of agenda in there and stuff. I just want to join my
Ghostbusters movie but it turned out it was really funny, the humor was on
point. The pointed pokey humor wasn’t offensive to any group or individual. I
don’t feel. The plot they kind of didn’t have one but that’s okay, that’s just
a movie in 2016. I don’t know if any movie that came out has a plot. I thought
it was pretty good, now I’m sad that it didn’t make it all to way to October in
theaters for people actually see it around Halloween. I thought they released
it so early like July or something. Anyway, there’s that.

I’m also going to pick my company Daplie if you’ve been listening to the show, you’ve heard me said this before, I’ll say it again. We are doing both a crown equity race and a kick starter under the [0:45:27]. Crown Equity is for the people by the people kind of thing, for as low as $100 you can invest in our company if you believe in our vision of taking back the internet and then the kick start on
[0:45:40] is for our product called Cloud which is an in home cloud system,
it’s not just storage although we do have a Dropbox clone app. It’s actually a
developer platform and a place for apps like music, movies, etc. Were
interested to see where all that goes. Check us out, daplie.com.

Charles: Very cool. I’ve got a couple of picks here too. The first one is, I didn’t realize how involved the guys from .NET Rocks were in us coming to connect [0:46:20] who is our contact here. He has done a tremendous job and Carl Franklin’s wife was actually out here booking hotels and making sure we’re taken care of. I just want to thank those guys and shout out to them if you’re into .NET they’ve been podcasting about code and stuff for a long, long time. Definitely check that out.

                    I’m also going to quickly pick another tool that I’ve been using. I know I’ve picked it on the show before but I just realized how much more awesome it is. And I’ll give you a little bit of a context, this is something I picked up for my business coach but she said that I needed a master schedule for each week and basically what that is it’s just a template for how I want my week you want to go. It gave me a lot more clarity on how I wanted to set things up and where I wanted to do calls and not do calls with people and so I set that up and then I went back in
the ScheduleOnce. That’s my pick is ScheduleOnce and I just set it up so that
those calls were available during those times of the week and nowhere else. Instead of saying, “Oh, well pick a time anytime I’m not busy. Now let’s pick a time on Monday afternoon and Wednesday afternoon that’s not already taken by somebody else.” Then when I do my weekly planning on Fridays then I’ll just fill
whatever time is not taken there. That’s been really nice and ScheduleOnce is
also nice just in the sense that I have been able to hook it into Zapier. Then
when we have a guest schedule it actually emails them and says there’s a Google
doc for you to edit so that we can collaborate on what we want to talk about. It
emails the rest of the panel for the podcast and that call gets setup and it’s
just really great. I’m just going to pick that and then if AJ can be evil in
self-serving this so can I.

                    Go check out the Devchat.tv conferences for 2017 we have 8 conferences setup covering JavaScript, React, Angular, DevApps, Freelancing, we got two on Ruby topics and one on iOS development. If you’re into any of that, check it out
Devchat.tv/conferences. The JS remote conf call for proposals ends on the 31st  of December. If you want to speak make sure you get your talk in by the end of the year, 2016 and the others obviously calls for proposals and later than that. We’re excited about them, pulling a whole bunch of exciting and interesting stuff together. Go check those out as well.

Dan: I guess my picks, this will be a simple one but I absolutely love it. It’s a chrome extension called Disable HTML5 Autoplay and you will be surprised.

Charles: Bless you! Bless you! It’s pet peeve here.

Dan: In so many times where you’re like, “Oh, and I love the browsers now I have the sound things. Which tab is making the sound?” But sometimes you multiple versions of Chrome and you’re just finding this will disable it by default. Even when you go to YouTube a video will not start until you click play.

Charles: Oh I need that. I need that in my life.

Dan: It has made a difference in my life. That’s my pick and then I’ll give a shout out to the Visual Studio Code guys because they have been doing some awesome, awesome stuff. If you haven’t yet, take it for a test drive, the experience for coding in Node.js, JavaScript is fantastic. They really do deserve some kudos and it happens to be the top contributed product at Microsoft. There’s thousands of
community members that have contributed to make it better and thousand for
extensions as well for any programming language. Even the red hat folks filled
the Java extension. There’s getting a lot of love there. If you haven’t,
definitely try it out.

Charles: Yeah. I’m going to plug a lot of episodes. We talked to Chris Diaz and Eric Gamma in February. If you want to check that out you can definitely do that. And then we talked to I think his name was Mat, somebody at build and we’ll put links to both of those in the show notes. We’re actually
talking to Chris again, today at Connect and we’ll be getting an update on
what’s going on Visual Studio Code.

Dan: If you want a fun tid bit to tease them on, you know your product’s successful when their latest release have 1.7 if you ever heard of DefinitelyTyped it’s basically typed bindings for JavaScript popular JavaScript libraries. The new version of Visual Studio Code, before you have to download those manually and then you got an editing experience with the new version of Visual Studio Code, it would dynamically search what NPM packages you have and try and download definitely type. Visual Studio Code’s so popular and they meet so many calls and packages, they took down NPM.

Charles: Sweet.

Dan: Your latest version of Visual Studio code was like a distributed denial of service. They actually had NPM at a blog post, Visual Studio at a blog post and they’re going to tweak some stuff to make sure the next release is. That’s when you know one you’ve hit the big leaps. That would be really popular because you get more IntelliSense and type information from the editor.

Charles: I like Visual Studio Code mainly because as I mentioned before, I’m a text editor Emacs kind of guy but sometimes I miss some of the nice stuff that you’re getting on IDE but a lot of the IDEs feel really clunky to me. Visual Studio Code really hits a nice balance there. I’ll hook you up on that pick.

Dan: It’s got a lot of features but it’s still super lightweight and it’s got honestly the finesse that a larger company can give to tool.

Charles: And it works on TypeScript, AJ.

Dan: And the TypeScript types can work with JavaScript if you use JSDoc. You don’t even have to use a blasphemous evolution youthness.

Charles: We have an ongoing feud going over what JavaScript is and isn’t. Anyway, we’ll go ahead and wrap up the show. But thanks for coming

Dan:              Thanks guys, this is great.

x