Elm Town 83 – Wonder: Meeting people where they are with Ryan Haskell

APRIL 15TH, 2025
|
44:03
Kicking off the Wonder series, Ryan Haskell shares his approach to teaching Elm, his gap year adventures, and his current work at Brilliant. He gives insights into creating accessible learning materials, building games, and finding inspiration outside the Elm ecosystem.

Details
/
Transcript

Ryan: people like me that came from like a JavaScript or just like, I know React, or I know Vue, or I know Svelte, or something, and I want to try out this Elm thing.

I wanted to kind of speak their language and come from that perspective.

Jared: Hey folks, welcome back to Elm Town. I'm your host, Jared M. Smith. We'll be visiting with Ryan Haskell today. We're going to talk about teaching, learning Elm.

[00:00:21] Sponsored by Logistically

Jared: But first, let's talk about our sponsor, Logistically. At Logistically, we make intuitive software to help logistics teams make better decisions and improve efficiency. We build the front end for all new features in Elm. If you're interested in our mission and enjoy writing Elm, please drop us a line, elm town@logisticallyinc.com. I'll put a link in the show notes.

[00:00:43] Introduction

Jared: Now, Ryan. Ryan is a senior software engineer at Brilliant. He was on "Elm Town 62 – The Map to Elm Land" last year. Check that out. He published his Welcome to Elm series and other Elm learning videos on his YouTube channel at @HeyRyanHaskell. He is the author of Elm packages and tools, including Elm Land and ryan-haskell/date-format, and there are a bunch of others too. Check 'em out. He rewrote his blog again. ryan.town more on that later. Uh, he took a gap year from September 2023 to August 2024, so hopefully we can talk about that too.

Ryan, welcome to Elm Town.

Ryan: Yo, thanks for having me back. Excited to be here. Dive into it.

[00:01:34] Gap Year

Jared: Yeah. Awesome. I'm excited too. I, um, we were starting actually to catch up a little bit before we started recording and I kind of put the brakes on that. But one of the things that I wanted to talk about was your gap year. I wanted to know kind of how that went, what your reasoning was there. Could you dive into that a little bit?

Ryan: yeah. So a lot happened last year. I, I turned 30, I got married, uh, and yeah, I, thanks. Yeah. Um, look, I'm off the market. Um, but yeah, no, uh, it was a big year and yeah, I was working at Vendr. Really wonderful folks there. I actually was just hanging out with Wolfgang in Milwaukee last week.

But yeah, um, yeah, I wanted to take a break and I figured if there is a year where it would be appropriate for me to have like a midlife crisis and just take a year off work, um, it would be when I have no kids, no mortgage, you know, and uh, take a swing at, you know, maybe starting my own business or see, you know, see where that went.

About halfway through I realized that I missed people and that was a, it was a bad, idea to be alone for a year. But no, it was a lot of fun. I made a video game and released it on Steam. using Godot Engine. Have you heard of Godot Engine? I

Jared: that. I haven't used it though. How was that?

Ryan: had never, never made a game before. Um, it was incredibly easy to learn.

A lot of fun. Uh, very visual, um, learning experience. The editor is kind of built in, so you code and you kind of, uh, hit run. It's a very, very fun thing. I think all Elm developers will enjoy, uh, clicking buttons and making cubes, uh, have physics and stuff. It was really cool. but yeah, so I did that, I, I wrapped it up, um, right after my honeymoon.

I started, uh, started my, my first day at Brilliant, and I've been there ever since, and that's been great.

[00:03:31] Building a game in Godot

Jared: Wow. Awesome. Okay. Well, we'll talk about Brilliant a little bit, but first kind of going back to this, uh, building the game. what language were, you using a programming language, I assume as well, or was it all point and click and

Ryan: Yeah, it was, um, so Godot has a language called GDScript, um, and it's kind of like Python. Uh, it's got a bit of, uh, it's like optionally typed. It's a really like, well designed language for, uh, for, for games at least. Um, as like a, as a beginner, like coming into it, it was like really, it kind of had the init update view pattern.

Um, but instead of, uh, you know, like Elm's init, update view, it was like a ready, they had a ready function that would run. They have a process function that was the update. So ready was init, process was update, and then view was just kind of, uh, the rest of the, the rest of the game engine. But yeah, you make your game out of little nodes.

So the game I made, uh, was like a little car game. Uh, it was like a racing game, there's different mini games and things. So like, uh, a car would be a node, but also your main menu would be like a 2D UI node, so you basically compose, uh, all these nodes and swap them in and out, and that's kinda how the, uh, like the game development went.

And then you could add little scripts to nodes.

Jared: Cool. Okay. And so did you have to build any physics or was it more like tweaking existing physics logic,

Ryan: There was, there was a physics engine, uh, built in, um, and so what you would do is you would, uh, attach So if I had a car, you'd kind of have like a, like almost like a folder, almost like a div, I guess. And then inside of that, uh, that node, you'd have like, this is my car, like the visuals for it. This is like the physics object for it.

Um, and then you would say like, hey, like when the game starts, um, you know, like put my car in the scene and then you would have on the nodes, all the settings, you'd say, oh, this weighs this much. And then the physics engine would take care of it. And you'd say how bouncy the car was and, um, you know, what happens when they hit forward, you know, you'd apply

forces, but yeah, it was all, it was all built in. It was really cool. Yeah, all the input, all the physics, all the audio, all kind of comes in the box with it, which was great for someone that had no idea what they were doing. They just wanted to make something fun to play.

Jared: Right on. So what was the name of the game?

Ryan: Turbo Champ. Turbo Champ is the name of the game. It's horrible, but it was a video game, and I did it. I released it, and I'm like, first video game, out of the way. yeah, it's on Steam, yeah, it has like Steam achievements, and I got like all these, uh, like free 3D assets and, uh, audio. And I, basically it was my job to glue them all together and, and make them like an actual game with like mechanics and things.

but yeah, I tried to do a racing game because I thought it would be easier, because initially I was like, I'll make an RPG, and I'm like, that's gonna take, you know, five years. Um, so yeah, I tried to make a racing game, and then I realized how hard, like, Making driving a car feel good is, uh, just like telling a computer how to not do that bad and like how not to flip you over in an unsatisfying way.

Um, so it was also very hard. Um, But it was, it was fun. I'm glad I did it. Um, I'm gonna stick to my day job, I think, is, uh, is the takeaway. Uh, and do those, do the video game stuff for fun. Um, cause I definitely did enjoy the process of building it.

Jared: As you were talking about this, building the feel of driving a car, it made me wonder, uh, did you use any of the AIs for, uh, for training it?

Ryan: No AIs. There was some stuff, there was some resources out there for, um, specifically for, uh, making bots. Um, which, uh, were out of scope for me. I just kinda did, like, local co op. But no, no AI. Uh, it was a lot of, um, a lot of, like, physics. Like, diving back into, like, It was like spring mechanics on the wheels.

Uh, but there were like a bunch of different approaches you could kind of take like high level approaches. One is you, uh, I was telling you how a car can have like a physics body and it can have like a visual. One was you make the physics body like a marble, uh, and you basically glue the thing on it. And that had like some nice like trade-offs where the car can't flip because it's always a sphere, it's always on.

Its, uh, like upright. Um, so that was actually the, the first pass the game. And maybe the current version, I don't remember what I landed with, but I took like two months just to like play with all these different like variations. One was like, each wheel was like a, a spring, so it kind of like balances itself out and you can control the stiffness.

That's a little bit closer to actual, you know, like when you have actual tires. But yeah, there were so many, um, so many things to explore. And ultimately, I'm like, Mario Kart did it better. I think, I think they, whatever they did, I wish I had.

Jared: So you used H. I., not A. I., human

Ryan: I used HI, yeah, yeah. Either superior or inferior, depending on what problem you're solving. Um, I definitely used AI. I still use AI this way, um, where if I have something, like, stupid that I don't want to do, like, how do I, like, how do I get the thing, like, I have a, I have this, I need to calculate this. What, give me the function that does that, and it would write that for me in GDScript, and I'd, I'd plop it in.

Um, a telltale sign, if I do it, is if I ever submit code to a private repo with semicolons at the end of it. That was me not deleting the semicolons ChatGPT gave me. So you can just search for semicolon. That's, that's not my work. That's a robot. But yeah,

Jared: Right on. Yeah, you'll have to put it in your default context to, uh, Don't give me any of those semicolons!

Ryan: I think it, I think it keeps me honest, you know, I kind of like it. I like that it's like, this is this guy's code. This guy's name is ChatGPT,

Jared: right on. Okay. Um, so this wasn't your first game, though. You have written other games. Have you written any racing type of games in the past, or what?

Ryan: Yeah, never racing and never 3D. Um, I had made little 2D games. Um, like the way I learned Elm was, um, there was a game called Seven Seas that my dad had on his Palm Pilot when I was a kid, and I loved that game, and it was the little pirate one. It's up on my, uh, it's up on Ryantown. It should be on rhg. dev too.

Um, I haven't taken down my old site, so they're both just kind of floating, uh, floating around. But yeah, that was my intro to, um, to Elm, was actually making a game, uh, just to get a feel for like the init update view stuff, um, and that was, that was fun. And yeah, Unblank, um, uh, which was a game jam I did where it's a little RPG where you run around, that is my favorite game I've ever made and I wanna make something like that, uh, again.

It's like side project number four, I gotta like, you know, constrain myself, uh, so we'll, we'll do that, uh, later. But yeah, I've been playing a lot of RPGs lately and I'm like I want to make, I want to make one and just like not have like money pressure or time pressure. Just like, you know, vibe and, and share stuff with people.

Jared: Maybe the next Gap Year.

Ryan: Next gap year. I never again. I, I love working with people, dude. It's so good. It's so nice to come into an office and just, not an office, uh, but come into like, uh, yeah, just like start your day and just have people to, to chat with and joke around with and like actually like build something together.

That's like a fun, that's fun for me. I didn't know how much I loved that until I didn't have it.

Jared: There you go. That's the gift of it.

Ryan: Isn't it beautiful? Yeah, it's a beautiful outcome.

[00:11:01] Welcome to Elm YouTube Series

Jared: That's great. Okay. So you took the gap year, you worked on building the game. Now you've started at Brilliant, which I do want to talk about. But another thing that you did, which I think this was during the gap year was write the Welcome to Elm YouTube series. Were there any challenges that you faced when you were trying to put together the material for that? Of like, how do I order this? Were you building like, because it seemed like you did a good job of like, what you talked about built on the existing knowledge from the previous videos.

So I don't know if like you all, you had all of that in your head already, or if that was something that you planned out ahead of time.

Ryan: Yeah, totally. I think that was, weirdly enough, the most time consuming part of the recording, like, of those videos. I thought back to conversations I'd had with folks in the Elm community. Like, uh, I went to Elm Europe, um, back in the day, in 2018.

Um, and I was, uh, lucky enough to be sitting next to Richard Feldman. We had like a dinner, uh, afterwards with a, with a bunch of folks. And he was telling me all of his opinions on, you know, uh, that we should do things like this, this, that, and this. And one of the things that stuck with me was like, Uh, something I've heard him say a lot, like listening to a podcast with him on it too, is like, the hard part for people is like, currying and JSON decoders or whatever.

And so, um, one of the, one of the things that I took away from him was adding the types later. I, I kinda had like an audience in mind when I sat down to like, uh, organize like how, how are these docs gonna go. Where I'm like, like the people like me that came from like a JavaScript or just like, I know React, or I know Vue, or I know Svelte, or something, and I want to try out this Elm thing.

I wanted to kind of speak their language and come from that perspective. And so, some of that was inspired by the Elm Guide, and some of that was inspired by just this notion of like, the type system's optional, that's like a really beneficial thing for teaching. You can just kind of like, gradually work your way into stuff.

But yeah, that was the, uh, I had like a, um, a little book. Maybe it's this book. I could probably find the page. But I just basically just wrote out like all the lessons, the order they'd go in, and then yeah, I started uh, started just recording. That was definitely the most time consuming part.

Recording it, you, you might be able to tell by the production value, maybe I shouldn't say this, it took two days. Like the whole course, I just like buckled down and I hit record and I just did it in two days.

Jared: Well that sounds like that's good because you have both the planning ahead of time, but you also have sort of the context in your head, right? Because as you're recording, you're doing it, uh, across a couple of days. So it's not like you record one wait a couple of weeks, and then you're like, where was I at on that

Ryan: Yeah, totally. Yeah, honestly, that is, that is a cheat code for sure. Of just like remembering what happened. Or like the very last thing you said in the last video.

Jared: Yeah. And they're pretty bite sized. I think they're what, around five, six minutes each video.

Ryan: yeah, I tried to keep them around. Yeah. Five, five, 10 minutes. Um, there's some that just went really long. Um, and near the end where we start diving into like the. I think what I think is the interesting stuff, what I think you like can't find in the Elm Guide really, which is like the the architecture stuff.

That was the the thing I really wanted to exist for for free somewhere online,

Jared: Oh, nice. Okay. But you build up to that. So your, your audience, you said, okay, it's going to be JavaScript devs that are coming from some other ecosystem like Vue or React. And then you kind of went from there. And then the goal was to get all the way to the kind of Elm architecture. And of course, Elm Land is at the end as well.

So.

Ryan: yeah, what was cool was um, showing them how to build their own Elm Land. It was like a part of it too, because like, it's like magic or whatever, but it's, I just like type, Elm Land's big idea is it just like types the annoying code for you, so I wanted to show like the ideas behind the the tedious stuff, So yeah, if you watch that, that course, um, you should be able to make your own, uh, I guess Elm Land competitor or whatever. Uh, but you can make your own framework, um, which I don't advise because, uh, documentation is the hard part for doing something like that. But, um, you, you'll at least understand, uh, if you're using a framework like Elm Land or, or, uh, even elm-pages, uh, just kind of like the basics of like how, how pages are, are getting connected and how a shared state can be passed, passed through them and that kind of thing.

Jared: I was going to talk a bit about the Elm Land guide and the examples in there, because I think those are, uh, are really good material. And so your Welcome to Elm series is not the first time you've been through, uh, teaching people and. Maybe even Elm Land isn't?

I don't know how that corresponds with the event Advent of Code series that you've done in previous years.

Ryan: Yeah, yeah, Advent of Code's always been chill because it's like I take a break from like the projects I'm working on just to like do like 10 arbitrary problems in Elm and just like talk through it, um, which is like a fun change of pace. , yeah, I think, I think Elm SPA, Elm Advent of Code, and then Elm Land was like the order of like educational stuff for me, that I put out there,

Jared: Okay. So you'd already, you'd already written a version of the Elm SPA tutorial in written form, and then you'd went through a couple of Advent of Code and then Elm Land, and then now this Welcome to Elm series.

Ryan: Yeah, there's all kinds of stuff. And it's funny because I forget the stuff I do. I'll like put it out there and then someone will bring it up. I'm like, oh yeah. Someone will reach out to you and be like, hey, like, you want to be on Elm Town to record your Welcome to Elm? I'm like, oh yeah, that was on that series.

I forgot I did that.

Jared: was this year.

Ryan: Yeah, that was this year. So that gives you a sense of just how all over the place I am in terms of remembering what Elm stuff I do.

[00:17:06] Teaching style

Jared: Yeah, sure. you used the Elm Guide as some of your inspiration for this as you were going through it. One thing that I immediately think of whenever I think of teaching Elm to beginners is Richard's elm-conf 2017 talk, Teaching Elm to Beginners. Uh, have you seen that or were you there or do you?

Ryan: I've seen it on YouTube, I wasn't there for the, um, I wasn't there for the actual talk. I think that might have been the year before, uh, I started going to, uh, elm-conf. that was the first one ever, right? Um,

Jared: 2016 I think was the first and then 2017 was the first year that I went.

Ryan: Okay, cool. yeah, I definitely saw it. Um, I don't know if I reviewed that. I was doing a bunch of, like, like, random research, through like old conference videos too, uh, as a part of it. But I Don't remember if that video came up or not. Yeah. Was there anything that stuck out from that, that, that reminded you of it?

Jared: Well, I, it's just the first thing whenever I think of teaching Elm, of course, Richard has other materials for teaching Elm, but that one in particular, um, just thinking about, like, that you build on existing knowledge as you're going through. And so I think that I noticed that in your videos, and it seemed like you were very, Purposefully, only talking about the things that, that you had already talked about, and so that's what made me think.

Ryan: Yeah, totally. There was a, I had a physics teacher in high school, , where he, like he was a little bit meta when he was teaching physics where he was talking about it. It's like, yeah, I'm going to like lie to you for a little bit, but like, I need to, for you to like get this concept so that we can teach you the real stuff later, but the whole like friction is negligible or whatever, like there was a lot of that energy in the video where I'm like.

I think one of my favorite videos of the course was, uh, one where you just take a React component, uh, and just translate it to Elm. And I just do it, like, literally. And I don't do it like The Elm Architecture way, where we have messages and whatever. But I just say, like, yeah, like, we had JSX and now we've got Elm code.

And then, at the end of the video, I think I say something like, you're probably screaming right now if you know Elm. But, like, I swear, in the next video, like, we'll make this like The Elm Architecture way. But yeah, there was a lot of that. Very intentionally, just like, omitting information when it would be like, harmful to someone trying to like, wrap their head around it, around like a new concept.

Jared: Yeah, and I think that's kind of brilliant, and in some ways, I wanted to bring this up, I think you kind of break, the rules, right? That's what we're talking about. Like when you say, like someone that already knows would scream, uh, you're using slightly unpedantic terms, you know, statement instead of expression in some places, variable instead of constant.

And, but I think that's kind of meeting people where they are is, is the phrase that I think about with that, like, um, just the way that you are using those. And you do that with, uh, Elm Land as well. One of the things that I noticed in there is you use the term props

Ryan: Yeah.

Jared: instead of model. And so I think you're definitely like clearly targeting a specific audience, but I think that's helpful because you're taking away one layer of, of confusion and kind of relating it to something that someone already knows.

Ryan: Yeah, totally. Yeah, there's like, uh, sometimes when designing, uh, like Elm Land or, you know, just like designing, uh, Elm code in general, like the, it's like, do I call this settings? Do I call this config? And a lot of the times what I've, what I've learned to do, what I used to do, like Elm SPA days was I would be like, all right, let's start from first principles.

What's like the best word for everything. What's like the most, what's like the, from from my perspective as like a, at the time, like a 20 something year old, you know, engineer, what is like the word for it? , and what I started to do is like, kind of, uh, I guess like humble myself a little bit and be like, I'm not the first person making a framework, I'm like, what are people doing?

And just kind of like, that energizes me in a way, cause it's like I can, um, kind of work with the rest of the JavaScript community, in a sense, and be like, alright, cool. We're all going to agree that like, when you pass in settings to a component, we'll just call that props. And then when you go to Svelte or React or Vue or Elm, you know, we can all kind of just agree on the same words.

Um, so yeah, I definitely think that's like a, a fun, a fun thing to do. Um, when like designing stuff, if your audience is people that are familiar with those, those tools,

Jared: But even if they're not, if it's consistent, then, and it makes enough sense, right? Like it's, it's not just confusing. Like foo, foo has never made any sense. Any example using foo, I have to like spend three times as long trying to understand it. But yeah, if, if it's somewhat makes sense, like, yeah, we just stay consistent.

Um, I know that you use the, the kind of controversial C word in Elm where you use components, uh,

Ryan: Oh yeah, yeah.

Jared: yeah, um, those things. Again, it's meeting people where they are,

Ryan: Yeah, totally. Yeah. It's cool. If you look at different, um, different frameworks, you'll kind of see pages, layouts, components is like a pretty common staple. I think some frameworks will be like routes instead of pages, that kind of thing. But yeah, if you, if you give people a file structure and they can just look at the folders and they'd be like, Oh, okay.

Like this is where my stuff goes. Uh, I think that's a little bit more helpful than, um, Like, well actually we don't do that here. It's like, well we kinda do. We kinda do it here. Uh, it just isn't exactly the same and that's okay.

Jared: Yeah, yeah, I think as long as at some point you explain kind of the trade off, right, of why not everything needs to become a nested Elm architecture, then yeah, you're fine.

Ryan: Yeah, totally.

Jared: Yeah, um, I guess the next thing is, well actually, I wanted to make one more comment about that, uh, there's section 1. 5, Advanced Functions in the Welcome to Elm series.

And you say this one thing that I just love and I just have to share it on here. It's around the three minute mark, you say, Parentheses are like hugs. And And I think that's just really Ryan coming out there and, and, and that's the kind of stuff that just, I think if you're, even if you already know Elm or even if you're not even that interested in Elm, it's just makes it like interesting and fun to, to listen to.

So thank you for that.

Ryan: You got it. Yeah, yeah, totally. No, it's funny when I pair with people, sometimes I'll say like, give that, give that a hug or whatever. Or it's just like it needs, because it's kind of like the, like the feeling of just like bringing something all in and, you know, it's just like one group at the end. It's like a little huddle, you know, it's, I think it's adorable and it's, it's important.

It's an important, uh, a verb to use in that context.

Jared: Yeah. And I guess,

Ryan: you liked that one

Jared: I guess for folks who maybe are learning Elm and might not know what we're talking about, in a lot of other languages, particularly C based languages, you'll find that when you call a function, you wrap that in parentheses, the arguments in parentheses. But in Elm, we don't do that. We don't have a comma.

We just have space, argument, space, argument. But then, if you're trying to nest One function call inside of another function call, you need to give it a little hug. So that's what those parentheses do. They help kind of set the different, uh, levels of what's, what's the word I'm looking for here. Uh,

Ryan: Yeah, just group arguments together.

Jared: yeah, yeah.

Group things together. And so you can kind of, yeah, just give a little hug. It's nice.

[00:24:52] From Wolfgang: Finding inspiration

Jared: I have a question from Wolfgang here. Quote, Where do you find inspiration when it comes to creating new things in Elm or for borrowing ideas? End quote.

Ryan: The JavaScript community is, it's really popular for a reason, um, and There's probably plenty of reasons. My take is that they do a really good job of, uh, like, the ecosystem does a really good job of, like, just meeting, like, random needs. So, like, there, there's a, there's a UI library called, uh, Chakra, where it's, like, React components, but it's kind of like Tailwind, and it's, it's basically, like, kind of like Elm UI in a way, um, but you can just kind of, like, it's crazy how fast people can spin things up.

So what I like to do is I like to watch YouTube videos of someone building something in React and TypeScript or building something in Svelte and just like, I don't know I get excited when something's really nice. And then I also get excited when something's really bad because I'm like cool like there's an opportunity over here and there's like inspiration So yeah, like the there's a GraphQL library that came out of Vendr and that was, uh, initially inspired, Matthew Griffith really led the charge on the, the Vendr Elm GQL, uh, for those, uh, who are familiar or unfamiliar with it.

But before that was, uh, packaged, it was like a, a conversation, uh, at Blissfully when we worked together and I was like, you guys, like, there's this thing, uh, where people are just writing GraphQL like normal people and then it generates the Elm code. Like, that's crazy, right? That was from me watching a video by, uh, uh, Ben Awad.

I, I don't know how exactly how to pronounce his last name, but it's A W A D. for me, years ago, where he's just, it was just a video of, of him just building, uh, a full app. And, uh, he was writing, like, GraphQL inside of a string, and it was generating TypeScript types. And I was like, it would be cool if we just wrote GraphQL inside of its own files, and it just generated Elm modules.

It was something that had aligned with a problem I was facing at the time too, when I was at work, where we had backend engineers that would have their GraphQL editors, they'd write their queries, and then they'd be like, okay, get someone to translate this to Elm, so we can have the selection sets and everything work.

All the decoder ish stuff. But it's really cool, we can just copy and paste it. We test it in the client, and then it works, we paste it, and then oops, we have an Elm module. So that was really cool. Cool thing. So yeah, uh, that's a very long winded way for me to say, yeah, I definitely look out outside of the JavaScript community to try to find inspiration and, um, try to bring back the fun stuff.

Jared: Yeah. Well that's great. I'm glad that you do that because I think for me, when I go out there, I get overwhelmed. So

Ryan: Yeah,

Jared: so much, it could, I could spend the rest of my life just looking at all the new shiny things, so

Ryan: Totally. And I think it's, it depends what environment you're in too. I've, I recently stopped using Twitter. Um, that was very good. That was a very good move. Um, I feel like there's a lot of like yelling of like this good, you bad, feel bad, you know, that kind of energy. Um, a very competitive, uh, space, the marketplace of ideas, uh, whatever.

Um, so yeah, it is nice to kind of do it on your own terms and be like, I'm just gonna learn about JavaScript just to see what's going on and just kind of like to vibe. I don't have to ship anything in production. I don't have to like wrangle with my, my npm install isn't working. Like I don't have to worry about it.

I'm safe. I'm cozy. Got a cup of hot cocoa, and I'm gonna, I'm gonna watch someone make a, make a website, you know. Different vibe for sure.

Jared: so you look out in the larger JavaScript ecosystem in the community there and see, Hey, what's, what are folks doing that's kind of interesting, like Chakra or like, uh, uh, Ben's GQL, which we can find that video and link to that. I think that would be good. And, uh, And then find the things that, the places where maybe that's missing in Elm and bring that in.

I like, I like that approach. That's cool.

[00:29:07] Remaking Ryan's website

Jared: You remade your website. You remade it. So, what, with RyanTown now, Ryan. Town, is, uh, is that, what's that written in? Tell us about that.

Ryan: So that is written in Elm, and it's, it's an architecture for a website that, um, I guess, I guess you'll hear it, you'll hear it first. Jared, your fans will hear it first. Elm Land is, is getting a big upgrade. Historically, it's only really been useful for, you know, single page apps. Um, it was kind of like a spiritual successor for Elm SPA.

Um, but there's some types of websites that I want where I kind of want something closer to Elm Pages. Um, but just a little bit dialed back, a little bit, um, more focused on just like Markdown content. So, that website is written in Elm kind of by hand with the architecture that I want to encode in the, in the Elm Land framework.

Um, so yeah, it's, there's Markdown files where I write my blog posts. Uh, there's Elm code that kind of serves, like the pages kind of serve as templates where, Every page has access to that markdown. and then yeah, it generates HTML files for each page, um, so that you can get good SEO and stuff like that.

Um, so if you ever go to Ryantown blog, you can, you know, view page source and you're going to see all the meta tags, um, and it kind of, it doesn't do any server side rendering. That's like one design trade off, but, um, it basically does the, does server side rendering or build time rendering of the, of the meta tags, uh, for SEO, and then it just does everything client side with Elm, uh, once the page kicks in, um, but for anyone listening, I encourage you to go to my website and disable JavaScript and see what little easter egg I put there, um, because, uh, there's something called a no script tag, and it's an opportunity to have a lot of fun, um, so, uh, so I'd check that out.

But yeah, because everything's client rendered, um, you don't wanna, you don't wanna show nothing, uh, if your users are visiting and they don't, they don't know that you built it with some weird, uh, you know, functional programming language, uh, mind bombing. But, yeah, the goal is, with that website is, with most of the things I build, um, I get really excited about just having a link I can share with a friend, um, and I don't get really excited about hosting bills.

So, um, single page apps, uh, can be statically hosted on, like, Vercel and Netlify for free, GitHub Pages, what have you. Um, and so I wanted my blog to be the same thing. I basically want everyone to have their own website. Um, and be able to build it. And the reason I chose Elm is not because I think it's, you know, the best language for websites.

Um, but I think it's a great language to use if you want to have content that is, it just seamlessly, you mix in like interactivity. So some of my blog posts have like little visualizations in them, um, that are made possible by, by Dillon's work on elm-markdown. I can have my Markdown. You can drop in a little, Elm, you know, like a WebGL canvas and then I can keep, you know, going through concepts.

So yeah, once, once Elm Land is, uh, in a good place, I, I want to do a little bit more of, of like blogging like that where I can just, hey I learned about this random thing, here's a cool, um, article with some like visuals and it's all, all in one language, which I think would be fun. And free to host! Which is very good.

Jared: Very nice. Yeah, that's great. Cool. Well, looking forward to that and definitely got to check out this little Easter egg in Ryantown.

[00:32:41] Brilliant & interactive learning

Ryan: For sure.

Jared: Okay, so let's talk a little bit about Brilliant. How is that? You've started in what, August, September of this year?

Ryan: Yeah, started in August. Uh, that's been great. Um, they sent me this really weird mug. I don't know if the camera's gonna pick it up, but, um, This isn't even our, like, latest art style, but this says Sphere Dog. I don't, it's, my camera's not doing a great job. But, they just have really weird, they have like a really weird aesthetic, and when they sent me this, I'm like, this is the right, this is the right place for me.

I think having a large, round dog with force lines coming out of it, like, it, it's a good vibe. But yeah, Brilliant uses Elm, , For those of you who don't know, Brilliant's the, uh, we have like a mobile app and a web app that's just like, cool little, like, lessons. It's like opt in educational content. So if you want to scroll on social media, you can do that.

Or you can learn, you know, physics. Either, either way, both accessible with your thumbs, um, and a few taps and stuff. So yeah, I was really excited, to get hired there and get to work with, uh, Aaron Strick, who's also been, uh, on the, on the show. Yeah,

Jared: I was going to mention that. Uh, Aaron Strick was on Elm Town 57, Brilliant Ways to Use Elm. And so we talk about some of the ways that Elm is used there, but what ways in particular are you using Elm at Brilliant?

Ryan: we have a lot of, um, uh, basically all of our lessons have like interactives that you can kind of play around with. So there'll be like a scale, you know, you're learning about like, you know, balancing things. All those visualizations are little Elm programs, which is really cool. So, um, I've been working on kind of upgrading those recently and making sure that they're kind of consistent with the rest of our product experience.

As you can imagine, having a bunch of like dozens of these little programs, Things can start to drift, so we're honing that in now and really polishing up the product. Um, so that's been a lot of fun. Um, but yeah, I get to work with, uh, with Strick like every day, um, which has been great. He's, uh, first time working with him, I'd recommend it, you know, it's pretty, it's pretty good.

Shout out to Strick and Jesse and everyone else, uh, at the Brilliant team. But, um, no, really great people and a really cool product. Yeah, I'm excited about the direction it's going.

Jared: Very cool. Yeah, that sounds like a fun place to be. Uh, and a particularly the type of work that you're doing sounds like it would be fun to do. Are you working with a designer as well, or are you just kind of making it match existing designs?

Ryan: Uh, yeah, we have, uh, we have design, we have UX, um, kind of a, yeah, that standard product, uh, setup, uh, but yeah, so it's not, um, it's not developers rolling their own, um, styles. Uh, uh, I think historically it might have been closer to that, but, yeah, we get to work closely with people that are really thinking about that stuff, um, and then just kind of execute on it, which is, which is fun.

Jared: Nice.

Ryan: been enjoying it so far.

Jared: Working at Brilliant has, as a teaching platform, has that affected how you teach or approach teaching Elm to others?

Ryan: it's definitely inspired me. I think a lot of the reasons like that I, that I like applied and like looked. Look to work there was like, just the notion of, including visuals when you're talking about abstract concepts is huge. So there was a version of Welcome to Elm where I was like, okay, I'll make like a, I'll make a course platform and I'll like upload all these videos and then I'll have like little practice.

And it was like huge scope. And I was like, I'm not gonna be able to wrap this up before I have a, have a job, but like just the notion of kind of integrating a lot of different forms of content and putting it in one spot, is, yeah, it's a, it's a big inspiration, um, and I think it's just, like, aligned with There's a lot of really cool, like, uh, websites and things that you'll, you'll see where, when they, when they do, like, the interactives right.

I think Red Blob Games is, is one of them, where, like, when I was trying to, like, learn how to make, like, a hexagon map, they just had, like, article, like, practical examples. You could, like See like different coordinate systems. It was, it was very cool. So yeah, I, I definitely am aligned with With them and working there is Is a continual source of inspiration of like something.

I'll see something cool. I'm like, oh, that's awesome. Like that's a great way to teach X, Y, and Z,

Jared: Yeah, I just love how Brilliant is able to take something and make it so interactive where you can kind of feel by interacting with it what a concept means, right? And I think that's different than trying to use words and then, you know, it takes a lot longer, I think. And maybe in some ways that's better because it's more ingrained, you find your own way there.

Yeah. But I guess for some folks, they may not reach that aha moment because they didn't have that interactivity. So I think having that at least as an option is nice because you can, yeah, you just get a feel for things by actually interacting with them.

Ryan: Totally. Yeah, someone, someone shared a quote with me recently and I'm gonna butcher it, but it was like, it was like if you have to choose between like, I forget, it was like engagement, like basically engaging with your learner or like, you know, uh, having something they retain. It's like always prefer engagement because you can't teach an empty room, you know what I mean?

If you keep them around and like get them excited and then you can build on that, but if it's just boring, people are gonna, they're gonna go on TikTok, they're gonna scroll, they're gonna do something else. Um. I think that might have been a quote from the folks at Duolingo, I don't, I don't exactly remember.

but that stuck with me, yeah. If, if you can make it fun and interesting and like, connect with the, the person at the human level, like, oh this is like, cool. I think that, that has a huge benefit. I think the interactives really help with that.

Jared: Yeah. Yeah, that actually makes me think of NoRedInk and how when you're starting out, if you've ever played around, they have a free thing you can go on there and it's been a while since I've done it, but at the time they had it where you could go like pick the things that you're interested in and then the questions and the way that they would put things together would be related to characters and concepts from different things that you're interested in.

So like, if you like Harry Potter, you like, let's just say Dracula or, you know, Zelda, whatever it is, then you'll find those things in your content that make it more interesting to you in particular.

Ryan: I think that's awesome.

[00:39:15] Picks

Jared: Cool. Cool. Well, what picks do you have for us today, Ryan?

Ryan: All right, um, my wife has recently read the original Dracula, like the OG Bram Stoker Dracula book. It's, it's weird and it's cool. I can't read, but she like read it and told me what happened. It was like, I'd be coding and she'd be reading it and then she'd like, okay, and then this happened, this happened.

So check out Dracula, it's actually very good. And also Dorian Gray. This was in Spooky Season, we were, uh, you know, or she was, we were reading these books, she was reading these books. Uh, but Dorian Gray and Dracula, uh, very good classics, uh, that you can get at a local Barnes & Noble, and a very cool, uh, they make cool, uh, hardcover books, uh, for those.

And then, um, Vite, Vite 6.0 came out yesterday, or not yesterday to the, to you guys, yesterday to me, um, but no, Vite 6. 0 just came out recently. And, uh, that, I don't know, the Vite community is like my favorite, my favorite thing. They are all about just like embracing every tech, uh, framework and every, every kind of ecosystem and really making the underlying annoying boilerplate stuff go away for everyone.

Yeah, if you're not using Vite or you haven't played around with it, it is a lot of fun. It's really fast and it's, uh, I, yeah, I just love the people working on it. So that's my second, second shout out. Ocarina of Time. I waited too long to play it. It's really good. The old N64, the OG, uh, I used to kind of bully my friend because he wouldn't stop talking about Zelda all the time.

I'm like, stop talking about Zelda over and over again. And then I played it and I'm like, I get it. I get why you like this. This is very cool. Uh, I've been playing through Uh, all the, all the classics, all the games, uh, the 3D ones, and it's been a lot of fun. Um, and I do it over Discord, so a shout out to Discord, go hang out with your friends on there, play some games, and chit chat, stay connected with folks that moved to the West Coast that you never get to see anymore, that moved to the East Coast, stay connected with your people, play some games on Discord, uh, and then Horizon Zero Dawn, I just beat that campaign, so.

That's a very visually compelling game. Uh, and then Satisfactory. Have you heard of Satisfactory, Jared? The video game automation?

Jared: yeah,

Ryan: It's, you're accidentally doing math. It's awesome.

Jared: oh yeah, um, that is one that my son's into. My eight year old. And so, yeah. We actually first heard about it because of a song by Dan Bull, uh, Satisfactory Night Fever, which, if you haven't heard that, check that out. That's, uh,

Ryan: Okay. I'll, I'll check that out.

Jared: Elm Towns. Um, and so, yeah, then we were like, oh, that's a game.

Oh, okay, and then check that out, and it's like, yeah, you're building some fun stuff there, so.

Ryan: It is the closest thing to actually being like an engineer that I've ever played in a video game of like optimizing, like this doesn't matter. This matters. Like let's, yeah, it's really cool. Uh, but yeah, they trick you into doing like work, uh, which is, uh, I think it's a cool trick. That is an example of like one of the cool things I'd want to have in my blog where it's just like, oh, like let's make a little, you know, one of those games.

That would be really fun to just kind of seamlessly, you know, translate from talking about it to showing it. so that's on my, that's on my list, uh, of things to, to do.

Jared: What number is that in the side project

Ryan: uh, 16 and a half probably. Yeah, it's on there.

Jared: Right on. Okay. Well, um, so you have some book recommendations, you have Vite and these games. Uh, I guess my picks, the only things that I have are Elm related. It's Richard's Elm material. So for learning Elm, he has the talk, uh, Teaching Elm to Beginners at elm-conf '17. So if you already use Elm and know it, but you need to teach it to other folks, that's a good one to check out.

If you're learning Elm, front end master's courses. He has the intro, uh, Elm course, and then an advanced Elm course as well. And then the Elm in Action book by Manning. And then, of course, Ryan's, uh, material here, Welcome to Elm series. Check out all that. I'll have links to all that stuff on here as well. So, yeah, that's everything I have.

Thanks to all the folks listening out there. If you're enjoying the show, please rate and share. And thanks, Ryan, for coming to Elm Town.

Ryan: Thanks for having me..

© 2024 Jared M. Smith