Transcript#

This transcript was generated automatically and may contain errors.

Hello everyone! Welcome to episode 14 of the Shiny Developer Series. My name is Eric Nance and I'm delighted that you joined us today. We are concluding our multi-part series with RStudio software engineer and member of the Shiny Development Team, Barrett Schlerke, as he gives us an awesome overview of the learnr package and why Shiny is such a critical component to making all the powerful processing in this package work seamlessly. He's going to give us a few demos and give us some great examples of how learnr can be used to supercharge teaching, data science, or any other concepts that an educator would like to use. So let's not wait any longer. Let's dive into our chat with Barrett Schlerke.

And speaking of learning, one thing that I've known for a while but I'm not sure if our audience does is that Shiny plays a prominent role in one of the excellent packages that has come from RStudio in how we can educate others on any sort of topic and it's called learnr. So maybe if you give our audience a bit of overview how learnr works and maybe some of the things you're proud of of that and maybe some demos about that too.

Absolutely. Yeah, so learnr is a great package to, you know, get people involved with R without even knowing that they're doing the R programming language because it's in the browser. We can deploy something on Shiny apps.io and they can just look at the R markdown output which, you know, people are familiar with but they don't they may not know that there's things like exercises or quiz questions that are actually powered by R underneath the hood. And this is nice for authors in that they can create exercises for users in a familiar language that they're used to with R and they can then host it somewhere else or locally for students to do on their own time or so they have it like running already. And I think that's like a very powerful part of learnr.

RStudio primers demo

So for some examples though I'd like to take you to the RStudio education primers. They've done a lot of work to really nail down like some of these steps that users have when like, hey, I'm working with data or I'm visualizing data. What are some things that can remind me what I should do or what is I'm able to do? And they have many different tutorials to go through and some of them, you know, they're on their way. But I think they're just so nice. So let's actually take a peek at just, you know, the basics. And we'll do visualization basics. So this is what a learner tutorial will normally look like. We have a sidebar on the left and we have our content on the right. So this will be our topic and then these are some different sections. So I'll say continue and yep, we're going to go through. And here we have just a quick quiz question.

It's like, okay, bigger cars consume more fuel. Cars with bigger engines use more fuel. Let's say that one. Submit answer. Great. So we get some immediate feedback. We let users know, you know, what were some correct answers. And it's really nice. These questions now are actually built using Shiny modules. So you can have, yes. And so like these modules, you can have 50 of these questions on one page and it's not overloading to Shiny server. It's only one instance of Shiny. It's not 50 instances. So that's really good. And it's not 50 iframes either outsourcing to somewhere else.

And so like these modules, you can have 50 of these questions on one page and it's not overloading to Shiny server. It's only one instance of Shiny. It's not 50 instances.

And then here we have an exercise. And this doesn't really look too intimidating to newer users compared to like maybe opening up an IDE and saying library, doing all that. So here, you know, they say type in MPG. Okay. And I'll hit run code. It's thinking about it and hey, we got a DT data frame already set up. It's got page scrolling. This is all automatically done for you knowing that a data frame was returned. That's really slick. And you didn't have to know about how that output was generated. You just had to just type the name of it and learnr was smart enough to know the effective way of rendering it.

Yeah. We have a few of them that work like that. So data frame is one of them. And then also HTML widgets are passed through as well. So if you return a widget in your example, we will display that full HTML widget. But also just to say submit answer, we can also grade their exercises as well and get feedback to the users. So I think this is great. I think this demo is really good. But it also, you know, leaves like more for the user to want or the author to want in that it's pretty minimal. It's pretty clean. There's not much going on for colors or styling.

Allison Horst's naniar tutorial

And Allison Horst has done a really good job with a learnr tutorial for the naniar package. I can never say it right. Nick Tierney, come on. But she did a wonderful job looking at this. And let's just load up that tutorial. So, you know, I'll have the links later that we can post. But she's done full, you know, illustrations that can be added in just like regular images.

This is gorgeous. Wow. Yeah. You see it and you go, that's not learnr. And then you look at the components and you go, okay, it is. Wow, that's so pretty.

And that's amazing. And, you know, with just a little investment in some styling, you can just totally transform the experience of these things. And that's certainly something, obviously, this is a case of learnr, but even my Shiny apps, I'm trying to get away from kind of the cookie cutter template look. And this is certainly inspiration of how powerful that can be. Yes, absolutely. And it's neat to see, like, even the buttons change. They're orange now. And, you know, the styling's just a little different. So, if I run the code, it'll produce the same answer. I can also start over. But yes, her work on this one is just awesome.

Yeah, I do agree, though, adding just a little bit of styling to some of the Shiny apps just elevates them. Yeah. And yeah, I'll have to look at this one as well. I'm sure I have some colleagues in my group that would love to play with something like this. So, how difficult is it to get started with learnr? Is it pretty easy to get up and running quickly, in your opinion? I think it's very easy. It's very familiar, like, with what we do. So, if I actually pull up the source for Allison's presentation, or Allison's tutorial, if I go into the Explorer tutorial RMD, the thing that we need to do is to say output learnr tutorial, and then in your setup chunk, just say library learnr. That's the main requirement. Beyond that, we just need to have exercises. So, exercise equals true. So, we just say exercise equals true.

And now, all of a sudden, this whole R chunk is turned into an exercise. There's nothing else that the authors need to write.

The other one is quiz questions, but I don't think I know if she has any in here. I don't believe so, but they would be just a regular R chunk that is not an exercise, and you would be able to say, you know, question, you know, answer is A, answer is B, and correct is true, submit. Like, that's all you need to do in one of these lines.

Very nice. Very nice. So, we'll definitely have links to getting started with learnr in the notes for this, but it sounds like, yeah, Shiny is giving you all a great way to have these different, you know, modules of, like, the code running, the questions answered, without you having to be an expert in building all that infrastructure from scratch. That's really cool, and it sounds like we've seen some really nice extensions that learnr can plug into. Maybe we can see some of that, too.

Extending learnr with sortable

Yes. So, one of the quick things that we gravitate towards with questions, quiz questions, is ranking questions. So, you know, what's your favorite cookie? Let's rank them and see what the answer is. And so, sortable JS is a JavaScript library that had already kind of solved ranking problems or ranking in the HTML, and it really quickly extends to, you know, we can use it for our quiz questions. So, what sortable did is we made an HTML widget package that will just use this sortable JS library underneath the hood, and then we connected it to learnr by using learnr's question API. And so, this is just the widget here, but if I go to a demo, we have our sortable library, and this is the code that's being used. We say, hey, give me a question rank. Here's my title. I have an answer of my insects, and if you happen to give me the reverse order of the insects, tell them that the answer is wrong and, by the way, other direction.

Getting a little hint along the way. That's always good. Yep. You can have many forms of these. You can have, like, many different ways so that you can give them custom messages for each style of wrong answer. And I always like to say that, you know, hey, let's allow users to retry. So, let's do this ourselves. Let's do the ant, bumblebee, dragonfly in reverse order, and I'll submit it, and incorrect, by the way, other direction. So, I'll say try again, and I do it again here, and, okay, in alphabetical order, I hit submit, correct. Moving on. And this is great. You can allow users to put in their own, or not, authors can put in their own choices or even complex HTML. It doesn't need to be just plain text. You can have images in here. You can have full HTML DOM. It's great.

Boy, this, to me, opens up a lot of possibilities that you don't just have to have the typical kind of quiz answers or questions. You could bring another widget into play. I know sortable, like this one here, is extremely powerful, but there seems like there's opportunity to bring other widgets in play here, too, for the future. If anyone is listening on that, I do have a dream that someone could have a leaflet map, and I could click on it and add points, and then I could say, you know, submit my answer, and if it worked, then the points would highlight up where you'd say, ah, you clicked close enough to the cities, you know, thank you. And, you know, leaflet's there. We just need to make the glue, so. Yeah, well, I was going to say, leaflet's a great example. I'm thinking things like Plotly, too, like anything where you could let the user explore a visual and maybe try to get the gist of what it's trying to convey. Yeah, I'm just being like a dreamer here. That would be really cool to see, so certainly I hope this is kind of like a template for others to follow for how that might work.

Multi-language support in the next release

So, anything else about learnr you want to show us about? But I will mention that the next release of learnr will have multi-language support, and so just as an explanation of what this will entail, currently all exercises are executed using R code, but underneath the hood, it's just an R Markdown document, right? But R Markdown understands many languages thanks to Knitter, things like Python using Reticulate or MySQL or even Bash, you know, you could do that, and we've now developed, thanks to the help with Nischal, summer intern, he made it so that the exercises are submitted using R Markdown fully, and that allows for any language to be supported. So, I have some demos that I'm working on to make sure that the UI is going to be up to date where, you know, I type in SQL code and it will return an answer.

But I will mention that the next release of learnr will have multi-language support, and that allows for any language to be supported.

Wow, yeah, that's going to be so exciting to see on multiple levels. Yeah, I can't wait to can't wait to play with that because I'm one of those people that hop from R to other languages from time to time and be able to educate others about that process would be really cool too. Yep, yes, we're very excited about that, and I think it'll be very a powerful tool that you could have in R exercise and then a Python exercise in the same web page. Yep, across all the data science spectrum of tools. Yep, that's awesome.

Advice for Shiny developers

Yeah, we'll have links to all these great demos you've had, learnr, in the show notes. So, one thing I'd like to leave with is, you know, as somebody who's been working on the Shiny team for a while, you've been developing these extensions of Shiny itself and these other packages that are using Shiny in different ways. What advice do you have to those in the audience that want to take their Shiny development skills to the next level instead of just like the basic tutorials, now they're doing more production-grade applications at work, whether it's by choice or they're forced to. What kind of advice do you have for those to take that extra climb up the ladder, so to speak? That's a really good one. It's a very open-ended question. My gut reaction is that Shiny is quite fast, but we can only deliver

your code as fast as it's calculated. So, don't be afraid to use Profvis and find out where the bottlenecks are in your code. Also, using a little bit of CSS, external CSS, or templates to give it a little bit of flair go a really long way. As we saw with Allison's demo and her tutorial, it really had a wow factor, and just a little bit of effort in the CSS makes a lot of difference, and Shiny is not going to impose or try to impose certain themes, so we're not going to be adding them ourselves.

The other things I can think of, you know, don't be afraid to use React Log. I think it's, you know, enable that option, and then go ahead and run your app and see what's going on, even if you just want to see the app in action. I think it's a really good feature. Yeah, well, I mean, I was saying during your React Log demo, just that visual presentation of what's happening, Shiny itself is a highly visual thing that you're making. Any web interface is obviously visual to the end user. That helps you as a developer wrap your head around all the logic that you've imposed in the app, and maybe you didn't intend to impose certain patterns, but then you see what those patterns are, and you're like, not the best idea, or maybe it's like, hey, I nailed it the first time, which doesn't always happen with me, to be transparent. I don't always get reactivity right the first time, but seeing it will definitely give me weeds on that for sure, so certainly those are great points.

I don't always get reactivity right the first time, but seeing it will definitely give me weeds on that for sure.

A couple of the use cases that I've seen is that users thought that if I only update this one value, that single output is only being calculated, so why is it taking so long? Right. And all of a sudden, they'll realize that one of the other outputs, which might be a heavy output, is reading that value or having a connection to it in some way that maybe should have been isolated, and now all of a sudden, the whole app is being invalidated and recalculating, so that's always a maybe unpleasant surprise, but it's nice to uncover, at least. Yeah, yeah. The first step is awareness. You've got to know about the problem before you can solve it, so very cool.

Wrapping up and how to connect

Barron, I mean, we could talk all day about all the awesome stuff you're doing. For those that want to get a hold of you, maybe in some of the work you're doing, what are the best ways they can reach you online, if they want? I think Twitter might be the easiest one for everyone. You know, email is a little bit too formal today, but yeah, Twitter, atchlerkey. I'm the only one. I try to make a handle on that name. It's pretty unique, so very cool, but yeah, Twitter should be good.

Awesome. Well, certainly, we greatly appreciate showing us off all these great extensions of Shiny and how it can up our game, so to speak, of Shiny development, and you're welcome back on the series anytime as you make these great feature additions, so thank you, Barron, for joining us. Thank you. I appreciate you having me. It's been a pleasure. Absolutely. All right, everybody, we're back right after this.

All right. I hope you enjoyed this and on previous episodes where we talked about so many great concepts with Barron that it definitely could not fit into just one, so certainly, as always, if you want to look at the resources that Barron and I mentioned throughout the chat, head to ShinyDevSeries.com, and you'll see this latest episode posted right there with all the links that Barron has assembled for us, and we got some great content coming up in the very near future, already produced some great recordings, and I will say that the next installments are using this brand new technical setup that I've set up here, and I think you're going to really like it, so that's going to conclude episode 14. As always, if you want to get in touch with me, the best place to do that, you can give me a shout on Twitter. I am at TheRCast. You can also feel free to leave a comment on the YouTube video posting of this episode, and definitely head to ShinyDevSeries.com for all the previous episodes and resources associated with those. So, I hope you have a great rest of your day. Thank you so much for tuning in, and we will see you next time. Bye-bye.