Tyler McGinnis stops by the ShopTalk Show to chat with Dave and Chris about his React courses, how he keeps up with web technology, and his thoughts on marketing and selling courses.
Time Jump Links
- 01:39 Guest introduction
- 06:18 Having a thing to sell
- 09:08 Hooks
- 19:27 ES Lint Plugin
- 21:13 Sponsor: .Design
- 22:20 Tyler's post on Hooks
- 24:14 How do you decide what to do with various platforms?
- 26:07 Functional programming
- 30:57 What happens if React goes away?
- 35:28 Sponsor: WordPress
- 36:32 CSR vs SSR
- 48:51 Testimonials on Tyler's page
- 50:31 Where's the value in marketing?
If you’re a designer and you’ve thought of a sweet name for your website and it isn’t available under .com, check out .design. Chances are the domain name you want is waiting for you. Head to porkbun.com and use the coupon code “SHOPTALK” on the checkout page to get your free .design domain name for your website.
For free. Did we mention that? Go to porkbun.com Coupon code “SHOPTALK” at checkout. Remember that’s a free year of your .design domain name.
Which is pretty darn fantastic. Everybody go get one, right now!
If you can host a site for yourself, a friend, or a client on WordPress.com, you should. Not only is WordPress powerful, flexible and easy to use (to the tune of powering a third of the internet), using WordPress.com means never having to worry about dealing with servers and software yourself.
MANTRA: Just Build Websites!
Dave Rupert: Hey there, Shop-o-maniacs. You're listening to another episode of the ShopTalk Show. I'm Dave--Stateful--Rupert and with me is Chris--Async Away--Coyier.
Dave: Hey, Chris. How are you? I think that's the last word you said, so--
Chris Coyier: I'm doing just fine.
Dave: I just called you the last word you said to me.
Dave: How are you?
Chris: Yeah, I could hear your brain querying for data there, and it just grabbed the first thing off the top.
Chris: Here's a pop quiz. Ooh, I think I gave you the answer in the title of the question. What's the API that grabs the first thing from an array? Isn't POP the last thing in an array?
Dave: Oh, yeah. Probably.
Chris: I think it's shift. Shift maybe is the first thing.
Tyler McGinnis: Hello. I am so good. I'm so happy to be here.
Chris: You've kind of found a niche there, right?
Tyler: Yeah, I just kind of think of myself as a teacher.
Tyler: For good and for bad.
Chris: How long? I think that's kind of curious. I bet a lot of people look at you, your life, and what you do, and be like, "Okay, that's all he does. Somehow, he made it to be his whole career." Is it your whole career? Do you dabble in any client work?
Tyler: No, I'm full-time teaching and writing.
Chris: What were you doing right before that, right before the leap to full-time?
Tyler: Right before, I was working on a startup that was building a React native app, actually. We were building a community for cancer patients to be able to better communicate about cancer, right?
Tyler: Doing that right before. Right before that, I was actually teaching, so I've had a weird career where it's like jumping between teaching and building stuff.
Chris: Were you building it as you went, though, like doing some teaching along the way doing a little bit of--? It takes not only your ability to teach, but a heaping helping of personal entrepreneurialism to make this happen.
Tyler: Totally. Yeah.
Chris: Was it building along the way?
Tyler: Pretty much. I'll give you the full timeline in a quick way that doesn't take up this whole show.
Tyler: I was working at a company here in Utah doing just normal dev stuff. There was a boot camp--this was, at the time, 2015 when boot camps were starting to become a thing--called Dev Mountain. The CEO approached me and he's like, "Hey. Do you have any interest in teaching? Do you want to do it part-time for us for our night programs?" I was like, "Yeah, sure. That sounds like fun. I really enjoy teaching."
I started doing that. I really loved it. I ended up joining them full time, so I was there for about a year doing just full-time teaching at that point.
Chris: Was that your first intro to what building a curriculum is like?
Tyler: Exactly. Yeah, the whole, like, all of the little details you don't really think of until you have to do it. Doing that, really loving it, really loving the idea of just working with and seeing students go from not knowing anything to being able to build stuff, getting a job, and then changing their life. It was super fulfilling for me. I did that for about a year.
Then, actually, I had former students who went through the program. They got into Techstars with this, again, idea of building a community for cancer patients. I was like, "Well, that also sounds very fulfilling and it would get me out of teaching and into more of building something, which I really enjoy as well." I did that. I went to London. Went through Techstars, which is kind of like a startup accelerator kind of thing.
Tyler: Did that, so then about six months to a year later, the startup was going okay. Communities are really hard and, with startups, you need money and stuff, which wasn't my concern but it was the business's concern. I could kind of see the writing on the wall where it wasn't really going to work out, but I still kind of had the background from Dev Mountain with teaching, and so I started just writing blog posts. At the time, too, I was doing Egghead stuff. What was great about them is, because that's all they do, they're really good at, like, "Hey, this is how to make an effective screencast."
Tyler: "This is how you teach people." Teaching people in person is just so different than teaching people on a screencast where you have no feedback. I started doing the Egghead stuff and then I was like, "Hey, I still love teaching. I might as well try to do this on my own," so that's when I launched my own thing and then slowly started rolling down the startup stuff, started rolling up my stuff, and I've been doing that ever since.
Chris: Yeah. I guess that's what I expected, but it's kind of nice to hear and share with anybody out there who is interested in this kind of thing. It's not an overnight thing. It's not necessarily a leap of faith. It's a sprinkling of knowledge gained from all kinds of different experiences in slow ramping down and slow ramping up. It's almost always the story.
Tyler: Yeah, and I'm sure it's the same. If I were to think of anybody or any company in this space doing it super well, it's CSS-Tricks with the content game. I think it really is. The content is just such a long-play.
Chris: Maybe it's grass is always greener, but I envy what you're doing. What I always point to that I want sometimes, and I do this in other areas too, but if you're just comparing CSS-Tricks to something like you and what you do, you have such clear calls to action. You've got a thing to sell and you sell it, which is great.
I even see stuff like, Dave has notes in here about your 60-second dev tips on Instagram. That, of course, got me and Dave talking forever. Instead of planning this episode, we talked about Instagram forever.
Chris: Why Instagram? To me, it's more clear. It's like, well, you have something to sell. To me, I'm like, Tyler should be everywhere and everywhere, spreading the message, because you can always point back to this place where you got something to sell.
Tyler: Yeah. I mean that's a good point. What's nice about it is, it's the same with any software. I have no marginal cost of reproduction. Acquiring students, I can get a billion students or one and the overhead for me stays the same, which is really nice.
Tyler: That's more of like, this isn't a business podcast, but that's--
Chris: Right. That economics of scale there is amazing.
Tyler: Yeah, exactly.
Chris: That's why startups are so juicy for VC at all is because the scaling cost for things compared to--I don't know--producing leather chairs or something, is so low.
Tyler: Yeah, exactly. I actually have friends who are in the leather wallet business. It's just completely different. They're worried about, obviously, margins and things like that. I'm just like, "I just write blog posts and teach people," and it works out well.
Chris: Sure. We do have some interesting scaling issues but, in the grand scheme of things, they're much more chill.
The URL is your name, TylerMcGinnis.com. You've got courses there. There's a blog there. There's a newsletter, all this kind of classic stuff, which is cool because it seems like, generationally, that hasn't changed ever. It's not like, all of a sudden, it's stupid to have a blog. Nope. Turns out that's always been a good idea. You do that and are pretty effective at it, even tackling some of the biggest stuff.
How many articles do you think were written about React hooks since they dropped?
Chris: Twenty million billion zillion of them?
Tyler: A billion. Yeah, I took the approach with that of, like, I don't want to write anything until, one, I understand the problem they're solving and, two, everything is kind of fleshed out.
This is interesting diving kind of into React stuff where the React team, they're almost like a PR firm because they have to have the approach of, like, "Hey, we obviously spent a ton of time doing hooks. We think this is the future. But we also think classes are fine. If you're using classes, don't panic."
Chris: …careful about that message. That went okay.
Tyler: Yeah. But now what I'm hearing is, like, I spoke at a conference a few weeks ago or a month ago, now, and the whole talk I gave was, like, why React hooks are important and why they're nice. There were just so many people, I think, throughout the community where it's like, I think people just like to have strong opinions about things. Some people love hooks and some people hate them. React is in a weird spot right now where I don't think the adoption has been quite as--
Tyler: I don't want to speak for the React team, obviously. I've seen people, or I've talked to a lot of people who are like, "My team lead won't let us use hooks for various reasons." I don't know, but I wonder if that's because the React team had such a soft approach, right?
Dave: Okay. [Laughter]
Tyler: Yeah, it is weird.
Chris: Well, I felt a lot of comfort with their message in that I just don't have time to refactor all of our components.
Tyler: One hundred percent. Absolutely.
Chris: Yeah, but-but we're all in at CodePen, which is my biggest React codebase, which is pretty large, lots of components. We only write in function components now. I've totally doubled, tripled down on hooks. Love it. Love the approach. So good, I think. But it doesn't matter. They coexist along with all those class components. Big deal.
I don't even necessarily rewrite them when I touch them. I'm like, "Eh, whatever," you know. If there was a major rewrite, maybe. But, for the most part, they're fine.
I feel comfort in that. That's nice. Although, it does make me think, "What's going to happen going forward?" If you're telling me -- I don't know. It's almost like there's enough backlash.
All right. Do classes eventually, a year from now, two years from now, become like second class citizens in React's eye?
Dave: It would officially be the class that imported the other--
Dave: …the other class. That would be the second class.
Chris: I wasn't trying to make a joke but, yes.
Tyler: Yeah. Nice. Nice. Again, without speaking for the React team, I think the inevitable is kind of like prop types. Prop types were built into React and they were great. Then it was like, "Hey, we're taking prop types out of React and we're putting it into its own package.
Tyler: The same thing with create class. We've kind of seen this before where create class was built into React. Then it was like, "Hey, we're going to make it its own package." It doesn't necessarily kill it. It's just like if you want to extend React.component. That thing comes from its own package.
Chris: Yeah, you just pull in a separate….
Tyler: That's what I would guess. It makes the most sense. When, is the question.
Tyler: I don't know.
Chris: A long time. Years.
Tyler: Yeah, a long time, probably, hopefully, so we'll see. Yeah. Yeah, hooks are fantastic. I still kind of like the old way of writing classes too. I don't know. I try to not be opinionated about writing software.
Chris: The one that always gets me -- like my opinion matters here. Who cares? But the component did mount versus useEffect with an empty array to make sure it only runs once because you're Ajaxing stuff. I'm like, "Whoa! One of those is way more clear than the other one."
Tyler: Sure. Yeah. Totally. Totally.
Chris: Sorry. It's not that I dislike useEffect. Whatever. It's fine. I guess you can do all this stuff there. It keeps function component, which I absolutely want because hooks are great, because this is easier, because it just looks nicer to me. I just prefer it. But some of those APIs, it's a tradeoff. They're just not as good.
Tyler: The thing with hooks is, it's like anything where we have a new thing and, at first, it's like a little confusing as we work out the details of it. I have a rule where, like, I don't tweet about anything until after two weeks of using it, at least, because I think in the early days you just get so many, like, "Why is this weird thing happening?" Yeah, it's a total tradeoff.
UseEffect is fantastic, but there are so many weird, like when you're having timers or timeouts in it. It just gets a little bit weird. Obviously, all those problems go away as you dive deeper into the why and, specifically, the details of it. But still, yeah, just looking at it; a five-minute impression of componentDidMount is so much more easier than useEffect. UseEffect just has some hairy edge cases to it, so I don't know.
Dave: Can we take a slight timeout and define useEffect? I think I saw useState first, right?
Dave: This makes sense. It's const, and then you have an array, like a destructor-y kind of array, and you have count and set count, right?
Chris: Clear as day, isn't it? What a nice API. Love it.
Dave: State returns a variable and a function to update that variable, right?
Tyler: Yep. Yep.
Dave: A variable and then a function to update that variable. But then there are all these others, like useReducer, which I assume connects to some kind of reducing mechanism. [Laughter]
But then, useEffect, I'm like, "Ooh, okay." Then they're kind of like, "Oh, it replaces componentDidUpdate and componentShouldUpdate, and component…."
Tyler: Yeah. [Laughter]
Dave: I'm like, "Oh, wait." You know?
Dave: Those were kind of useful, so what--?
Tyler: All right. I'll give you my TLDRs. We'll have a little game show, speaking of game shows.
Tyler: I'll try to do this off the cuff. We'll see how it works. UseState, as you said, allows you to add state to a function component and update that state.
Chris: Can I say that React gave us that one.
Chris: That's, "Hey, thanks, React. Thanks for this hook that you gave us."
Tyler: It's a built-in thing. It comes with React.
Chris: But there's also this concept that hooks is not necessarily the only ones that they give us. I think that's kind of an important distinction because it's like, as soon as you really dig into this, we use more of our own hooks than provided ones, in a way. Anyway, go on. I have already killed your TLDR.
Tyler: You're good. You're good. No worries. Yeah, so they're kind of like React primitives, I guess you could say, which are like the built-in hooks. Then you could build your own custom hooks. UseState allows you to add state to a function component.
UseEffect, a lot of people talk about how that one you do Ajax requests and everything. The way I like to frame it is just as the name implies. It allows you to add side effects to your function components. Even if it's just any side effect, whether it's manipulating the DOM, changing the document title, or making an Ajax request. I've seen that. I feel like if we describe it that way, it basically just sets a foundation and makes it a lot more clear for things that go in it.
I actually don't. I'm not a big fan of, let's look at hooks as a way to replace the old way that we did things. I get the mental model for that. To me, it's so different that I try not to make comparisons between the old way and the new way just because there are so many weird edge cases. You have to. You 100% have to. Exactly.
Chris: In the early days, you kind of had no choice, though. My gosh. You can't pull away some major API like that and not tell people how to replace it.
Tyler: One hundred percent. One hundred percent. But what I found, at least for me, because with me too is, like, I have students who have been doing React for like three years and I have students who this is their brand new thing to React. If I just start assuming and making comparisons between the old way, now, all of a sudden, I sound like a prerequisite that you have to know the old way. That probably is good, but anyway.
UseEffect allows you to add side effects to function components. UseReducer, the sales pitch for that, from what I've seen, is basically the same as useState, except it allows you to use the reducer pattern for updating that state. The reducer pattern being like array.reduce, that same idea.
Tyler: Those are probably the big three. There are other ones. I'm sure there are some. We're obviously getting useRef.
Chris: To me, the third-party ones are so much cooler, like useDimensions is so nice for doing DOM stuff.
Tyler: They are. Yeah, exactly.
Chris: My favorite hook of all time is Apollo's pretty brand-new-ish useQuery hook, which just kicks ass. It used to be you have to have a query component and then it uses weird render props. You have to deal with the state that comes back from those to render different things.
Now it's just like, let data equal use query. Here's the query. It's mouth blogging the API, but it's like 5x cleaner than it used to be.
Tyler: I think it brings up a good point where I think the marketing pitch for hooks was that you were able to add state inside of function components. It was like, "Oh, look. Lifecycles are gone. Set state is gone. We can just add state."
I think, in reality, it's much more of what you're talking about, Chris, where it's like you can create your own custom hooks, which helps with code reuse. It helps with composition. There are better defaults. I think, to me, and that's really the conference talk I gave a few weeks ago was about that where it's like, hooks are cool because, yeah, you can add side effects and state. To me, the much more interesting thing is this idea of custom hooks and using those to solve a lot of the issues that we saw with the class API.
Chris: Then the grand irony of that is, when you're writing your own hooks, they're just like functions that return stuff.
Chris: You're like, "Oh, you invented functions?" You know?
Chris: We definitely had those before.
Tyler: It is impressive where it's like, the React team had all of these constraints where you have to have state. We have to replace lifecycles. We have to make sure everything can happen inside of a function. We need to be able to share nonvisual logic, which is what previously higher-order components or render props did. We need to do all of this in, like, a very clean and elegant manner. That's what I love about hooks is, it's a pretty simple solution to, underneath, what was a pretty complicated problem. We need to do all that without actually having too many breaking changes and freaking out the community. Anyway, that's why I love hooks, really.
Dave: UseKeyword is just a convention, right?
Chris: Convention, it totally is.
Tyler: Yeah. Yeah.
Dave: It's, "Hey, this is going to get executed," and it kind of does a thing. UseState is, "I'm going to create a little state object dealy-ma-bob," and useEffect is, "I'm going to just run some code at some point."
Dave: But the convention is, use something.
Chris: Yeah. It is a convention and there are some rules too, though, right? They have to be called as a direct child of the function component. You can't bury them in weird places.
Dave: I was going to say, I know the React team released the ES Lint plugin React hooks, right?
Chris: Yeah, we just upgraded to that just, like, yesterday. Rachel did it on our team.
Chris: We had 14, 15 little blunders.
Chris: We'll just get them fixed up. They weren't killing.
Tyler: Were they all useEffect?
Chris: I think some of them were. It was that one that I just described where we ended up calling a hook somewhere that wasn't a direct child.
Tyler: Ah, yeah.
Chris: For some reason, it doesn't blow up. I say "child." I don't think that's the right terminology, but you know what I mean, right?
Tyler: Nested, yeah.
Chris: Yeah, you can't call a function that then calls the hook, or whatever.
Tyler: Yeah, or it can't be conditional, basically, as well.
Dave: Oh, weird. I've heard it's kind of notoriously like a cop. It's pretty rules-y, to say the least, maybe. Is that a product of hooks being hard to understand? Maybe in your work, are they that difficult to teach? We have to Lint some rules about how to use them?
Tyler: Yeah. The way they're pitching it is, it has its constraints, right? Behind the scenes, and this is where I'm kind of out of my element, but from my understanding, hooks use an array call order to decide which value is associated with which hook. When you start having conditional hooks or nested hooks that may or may not get called, then it screws up the order, right?
Chris: Yeah, the order is screwed up.
Tyler: To circumvent that, they came out with an ES plugin, as you just mentioned. Whether that's the best solution or not, again, I don't have opinions on these things. I just teach them. But that's the reality of it.
Chris Enns: This episode of ShopTalk Show is brought to you by something really cool. It's an alternative to .com. It's the .design domain name. In general, I'm a big fan of interesting, unique, good URL website names and, especially, alternatives to .com. If you're a designer, you've thought of a sweet name for your website, and it isn't available under .com, check out .design. Chances are, the domain name you want is waiting for you.
You can head over to Porkbun.com and use the coupon code SHOPTALK on the checkout page to get your free .design domain name for your website. Yes, you heard that correctly. It's a free year if you go to Porkbun.com and use the coupon code SHOPTALK on the checkout page and get a free year of a .design domain name that's bundled with free email hosting, WHOIS privacy, and SSL certificates.
I don't really consider myself a designer, but I didn't want to miss out on the fun of registering a .design domain name, so I registered ipodcastbecauseicant.design, which you can go check out and see how it worked. There are plenty of fancy companies using .design like Airbnb.design, Facebook.design, Uber.design, Adobe.design, and many more. It's exactly the same; just a domain name. Google doesn't care and it functions the same way as a .com or .org. It just looks a little more interesting.
Go check out Porkbun.com and use coupon code SHOPTALK at checkout to get a free year of a .design domain name. Our thanks to Porkbun for sponsoring this episode of ShopTalk Show.
Chris: To circle all the way back, we started talking about hooks forever because you have a pretty good blog post from earlier this year about React hooks and, of the ten million billion thousand of them out there, you did a damn good job with it.
Tyler: Thank you. Thank you.
Chris: I hope it does good for you and stuff, but what do you think about when you write an article like that? You're like, "I like to share knowledge. I'm a teacher. I'm going to do this thing, but I'm also going to, " what, "attempt to knock it out of the park so it gets a lot of traffic because I have something to sell." [Laughter]
Tyler: Yeah. No, you're exactly right. I think that's what's interesting about the SEO game and that's what's nice. The way I write articles or I try to is just spend a stupid amount of time researching and writing the article. I treat it like I'm an author, right?
I think the good parts of that is, typically, I come away with pretty good articles and it kind of cuts through all the noise of the rest of the articles. As you mentioned, I didn't publish this article until late July. I don't know what hooks came out, but it definitely wasn't anywhere close to that. To me, I try to just not rush articles. I try to make a really good one rather than a really quick one. That's my approach is, I found that if I just hit my head against the wall for a stupid amount of time, I usually get pretty decent articles coming out of it.
Chris: Then you kind of do some other things. Do you think of them as--? I'm trying to articulate this in a way. You have the blog and you sell some stuff on your URL, but you've got a newsletter, you've got a YouTube channel, you've got Instagram, and you've got Twitter. Who knows what else you've got? How do you think about and reconcile all that?
Tyler: Yeah, that's something I think a lot about because what's interesting, again, if I'm claiming that I'm an educator, that's my main title, which is what I feel pretty comfortable with, then the way I have to treat all of those platforms is, they're different and the content on those platforms needs to be different because the medium is different. A 60-second Instagram video is very different than a 45-minute YouTube video. That's kind of what I like about it.
To me, I'm super longwinded, as you could probably tell from this podcast. I like writing just very long, in-depth blog posts and videos. Instagram, it's so interesting because you literally just can't do that. One, it's nice from a business perspective just because you're kind of everywhere. Two, even from an education standpoint, it's interesting just because the medium is the message and so you kind of have to teach towards the medium.
Chris: I think it's kind of cool. I just started one. I'm getting my bearings about me on how it works, what the tooling is, and stuff because it's tricky. Yeah, I like how it kind of forces you to think about, like, how can I make this the most digestible little nugget of content I possibly can?
Chris: More importantly, I don't want to be doing this just to be doing it. I'm too old for that.
Chris: I want to make sure there's reason for it.
Tyler: Exactly. Exactly. Yep.
Chris: Anyway, that's kind of cool. Dave, before we move away from hooks, I had some thoughts about functional programming.
Dave: There's this website, Twitter. I don't know if you've seen it.
Tyler: I think I stopped looking at that in 2012, I think.
Dave: Yeah, that's good. Good because it is just a rectangle.
Dave: There's kind of a small debate, I guess, going on about this idea around UI as a function of state. Rich Harris from Svelt instigated this, but it's kind of his fault. He was asked to speak about Svelt at a React meet up, so whatever. He posted a good presentation. It's kind of been spinning me out on a few rabbit holes. His idea there is maybe this idea of purely functional components, like purely functional UI.
It may be a bit naive. React, it seems like, is heading kind of towards this more functional thing. Your component is a function. It's not a class anymore. It's a function. Then that function just has this useState. It has states in there.
His thing is, you still need a lifecycle, which is kind of what the class syntax added. Do you have any thoughts on this, UI as a function of state only, or is the React ideal there too pure? Do you see any potential drawbacks of going down a purely functional UI?
Tyler: Yeah. Good question. There are a few people who, when they talk or when they say something, you just listen because you know they're going to say something smart. Rich is one of those people.
Chris: Chris Coyier. He's so smart.
Tyler: Chris Coyier, Dave Rupert, really the whole crew.
Chris: Yeah, I know what you mean, though. Rich is one of those type of people, isn't he?
Tyler: I will not publicly ever say anything that Rich will disagree with because he's smarter than I am and he will beat me, right? [Laughter] So, I'm happy when I am.
Tyler: I haven't watched that presentation that he gave but, even with Svelt, I've heard that that's the new thing and everyone loves it. Again, with me, I really enjoy hooks. I'm sure there are some tradeoffs that people like Rich think about because they're kind of on another level of thinking than I am. But again, I like hooks. I've enjoyed it. I'm sure there are tradeoffs. I haven't really faced those in the apps that I've written.
Tyler: If someone as smart as Rich is waiving the flag saying, "Hey, we should be paying attention to this," I think there's a very good chance that he's right. Yeah, I think we should listen to him.
Chris: That's where I'm at, too. I'm like, "Oh, my god." Sometimes smart people just need to solve stuff for us and then we can slowly smurf our way there.
Tyler: Yeah, exactly. [Laughter]
Chris: At the moment, I'm starting to feel more and more like muscle memory around React stuff because I haven't been writing it forever.
Chris: I'm starting to just feel like, I like these little angle brackets. I like the JSX. I like smashing props around. Props are fine. I finally grokked all this state crap and the different ways that I can handle it. It's starting to just feel like a nice way to build UIs and the fact that I can just arbitrarily choose what is going to become a component and what isn't, what's going to be a wrapper component and what isn't. It's that way of architecting things feels good. It's not that I can't take some of that knowledge and just do it in Vue also for various reasons.
Chris: Fine, especially because I don't really have to give up my angle brackets. I'm just in HTML over there and things just are handled a little differently. I don't know. It just feels good and it feels like you don't need me to say it. This ship has sailed.
Tyler: Yeah, I agree. Ever since the year 2016, I've seen people, like, "Oh, this is the year that React dies and goes away." I just heard that, eventually, it'll be true, right, because it's always true. Yeah, I don't know. I've just been hearing that for a long time now and it's still doing pretty good.
Chris: What happens to your life if React winds down?
Chris: Do you worry about that kind of thing, too many eggs in one basket?
Tyler: I do.
Chris: Are you just going to--?
Tyler: I 100% do, so I actually don't love being the React guy for various reasons. All the tradeoffs are pretty clear. I kind of just want to be--
Dave: Okay, we'll have to change our episode title because the React guy, Tyler McGinnis--
Tyler: That's fine. I'll take it. No, the reality is, that's who I am right now and that's fine. I love it. Obviously, it works out well. In the future, I wouldn't mind, I really wouldn't mind having a Vue course. I just don't know Vue enough to have a really good course on it. That's my fault, right, because I really like React and React has been changing so much lately that I don't really have time to do anything else but React.
Yeah, definitely, if you're looking at it from a business standpoint, like my business has grown as React has grown and I'm definitely not naive to that. It's one of those things where, I guess my actions speak louder than my words here. Yeah, and that's why I think Vue is great. Svelt, obviously, people are loving it. I try to be very open with my mentality about front-end frameworks because it's like a silly thing.
Chris: You know what's funny is that you had some experience, you were saying, in React Native apps and stuff. Teaching in this world is so tricky because if you never do any other work that your pass card to teach it starts to fade away a little bit.
Tyler: Yeah, 100%. Yeah, 100%.
Tyler: It's so true. Yeah. It's so true. That's what's kind of nice about doing the business thing, too, is like there's always something. I just built an analytics dashboard and I've built a business dashboard. There's just a bunch of internal tools you can build to solve the problem of, like, hey, I haven't built something in a few weeks. Let me do that. That really is what's nice about it, especially teaching stuff on the interwebs. There's always something else you can build and it just happens to be the thing that you're teaching, which is nice.
Dave: I think this happens not just in the education sphere. Even work, right? You get paid to work on some Java system. We've probably said this on the show. Then you look up and you're like, "Whoa! Everything is different and I had no time to learn the new things or chase a different technology." I think chase is kind of the right word because you really have to -- no one sits down at a computer and is like, "I understand Vue. I read one tutorial. I'm a professional now. I'm putting it on my resume."
You really have to learn. You have to build maybe multiple things before you're like, "Oh, I kind of get it. I understand this and why it's better than this or different than this. I can make valid comparisons." That's hard stuff. That takes time. I wish our industry was less go-go-go sometimes, so we could have more time to evaluate those things.
Tyler: Yeah. You kind of just have to be content with it. I'm not going to know everything. Even if I have a lot of Twitter followers, that doesn't necessarily give me the right to think that I know everything. That's why I'm the React guy right now and that's fine. I don't want to be in the future, but that's who I am and that's really all I can do right now because it's just been changing so much. I made my bed; now I've got to sleep in it, which is fine.
Dave: Well, but it's the thing that pays your bills. It keeps the lights on, and so there's inherent risk in being like, "You know I'm not doing it anymore." [Laughter] Like, "What?" My wife was not cool with that plan. You know what I mean?
Chris: When I said I want to switch to video games, she was not cool with it.
Tyler: Yeah, I can't be a professional streamer, unfortunately, a video game streamer.
Dave: Yeah. I said, "Honey, Twitch is cool."
Tyler: Look at Ninja.
Dave: She said no.
Tyler: Look at Booga. He just won $3 million. Yeah. Yeah, yeah.
Dave: He has blue hair. I can do that.
Chris Enns: Hey there. This episode is brought to you by WordPress.com. Whether you want to share your ideas, start a business, or run a store, you can do it all on WordPress.com.
Maybe you're like me and you've set up a lot of self-hosted WordPress sites over the years. It's great that WordPress gives you that option, but sometimes you don't want to have to worry about servers, infrastructure, backups, and cron jobs. You just want to start a website now and that's why you should check out WordPress.com.
You can open a store, process payments, configure taxes and shipping, build a marketing plan. You make the widgets. They'll help you make the website.
You can start a blog. Make your mark online with the world's greatest blogging tool and join a community a million strong that's waiting to hear what you have to say.
You could design a portfolio. Thousands of themes means there's a layout that's just right for you, while storage and design options ensure you can upload anything you need and give you your work the stage it deserves.
You could build a fanbase, promote your products, use advanced statistics and SEO tools, and connect with built-in audiences on social media to grow your business. You can start it all today on WordPress.com for free. Whether you want to create, share, or sell, do it right on WordPress.com.
Our thanks to WordPress.com for sponsoring this episode of ShopTalk Show.
Chris: I kind of want to talk about, for lack of a better way to phrase it, this will be the fighting words. It's like CSR versus SSR kind of thing, even though there's kind of a spectrum of that and it's kind of more interesting and nuanced than that.
I feel like React kind of like just avoids it entirely, right? They're like, "Oh, you want that? There are some people that do that." You know? There are ways. Just look into it. Google it. [Laughter]
Is that fair? It seems like there's so much benefit to that. Does the React core team care at all about the SSR world?
Tyler: They will. I actually had to look it up. CSR, I'm assuming you're going for client-side rendering. Is that right?
Chris: Yeah, just like how React normally works, like the entire documentation of the entire project and then server-side rendering. Yeah.
Tyler: I Googled it just to make sure and I got Corporate Social Responsibility, so I assume that wasn't what you were going for there.
Chris: [Laughter] No.
Tyler: Yeah. It's my longest blog post and my longest video. I think it's 48 minutes or something about doing SSR in React. It's just a nightmare. There's promise of Suspense coming out, which is like the new way to do data fetching and stuff with React. With that, supposedly--I haven't followed it too closely--SSR stuff is supposed to get way better just because right now--
Chris: Really?! I would have thought it would have been the opposite. I think of Suspense like, show spinners under these circumstances, the API.
Dave: Well, it's a more dependable way to show spinners, right?
Tyler: Sure. Sure, sure, sure.
Dave: You could send down a somewhat pre-rendered machine, but then the parts that have to go fetch data could….
Chris: Oh, okay. I can see that. It's going to make this easier, somehow.
Tyler: Yeah, that's my understanding of it. What's nice is, like right now, I use Gatsby for a lot of my stuff, which isn't really SSR. It's more just like pre-
Chris: Well, that's the default answer. I want to write in React, but I know enough.
Tyler: Yeah, or Next.js.
Chris: I know enough that there's benefit to a server-side rendering.
Chris: Gatsby or Next.
Tyler: Yeah, exactly, or Next. Exactly, and that's usually my answer, or go read my 48-minute blog post where, at the end, I say, "I don't know if this is worth it, but thanks for reading."
Dave: It's like my college calculus professor. Three months in, "I don't know. I couldn't solve it. Okay. Next."
Tyler: Okay. Next problem.
Chris: There are just some unchanging details about it that are a big deal. Google has a video that says, "Listen. If your app is entirely client side rendered, kind of don't worry because we're still going to index it."
Chris: "But we literally are going to take a week to index it."
Chris: "We're telling you to your face, it's going to take a week. Not only a week to index it, but it's going to take a week every time you change it for us to find those changes and re-index it."
Chris: It's kind of like, "Okay, well, Google told you that to your face, so maybe we should solve that problem."
Tyler: Yeah. I love that answer, too, because it's like, "Okay, so what do I do? It works kind of?" Anyway, yeah, I use Gatsby. That's my solution.
Chris: [Laughter] Sure.
Tyler: It's a very, again, not strong opinions here. That's how I solved the problem with all my very heavy content site.
Chris: It feels nice too because it's SSR and then it has this whole concept of hydration, right?
Chris: You're not stuck in SSR forever. Eventually, the library loads and client side rendering takes over. It starts feeling good again in that way that client side rendering does. I like that feel. I'm really attracted to it. You click something and the minimum amount of data comes across the wire. This fancy browser-side thing takes over and re-renders just what it needs to.
Chris: It kind of feels great.
Tyler: It's the right idea. It feels right.
Chris: It does feel right, except that, then, there are all these other things to consider.
Chris: There are downsides to it, too. It's not like we've nailed this yet.
Tyler: Yeah, it's the right TLDR where it's like, "Hey, look. We could have the best of both worlds. Don't worry about the implementation." It sounds good, right? You actually do it and you're like, "Wait. How do I actually get data on the server? How do I hydrate that same data? Oh, I put it on a window. Okay, that works, I guess." Yeah, it's weird. I'm told it's going to get better, so I'll trust it.
Chris: Okay. [Laughter] That's all we can do, I guess.
Tyler: Yeah. [Laughter] That's all we can do.
Dave: It is not weird, I should say. Well, you all just said weird, so I just said weird. I repeated what you said.
I guess it's an interesting design choice to offload server-side rendering to a third party company.
Tyler: One hundred percent, yeah.
Dave: React has kind of said, "We're not solving that exact. React DOM rendered a string but we're not really going to solve it. Now here, the third-party companies can come in. Innovate here."
That's an interesting position for a framework for such a, I would call it, maybe semi-necessary feature. I think I've also heard the argument like Facebook has 1,000 engineers who can solve that problem.
Chris: You know this is happening from the other side, too. You've got Google saying, "Wow! That blew up on us. I don't think we can just sit here and do nothing about it," so they're not, I don't think. I don't think they've said what they're going to do about it, but it's going to be something, eventually.
Tyler: What's interesting too is that same idea can be taken over to React Native because a lot of the React Native development is done by Expo, which is a weird -- I think they went through YCombinator. I shouldn't say "weird." I keep saying "weird." They're not weird at all. They're great.
It's like a lot of React Native is done by an outside company. I don't really know. I've never gotten a clear answer of the distinction between Expo and Facebook and how Expo gets paid. I think they went through YCombinator, which means they took VC money. Yeah, Facebook has shown that they're not afraid to outsource pretty important things to other smart people, I guess. I don't know.
Dave: That's a feature of React. Why did you choose React? Oh, because we have Native products. You know?
Dave: I guess the difference between Preact and React is one thing is just that Preact is smaller by using just Native click handlers and stuff like that. React needs an abstraction layer so that it can go to React Native or wherever.
Dave: That's interesting. Again, weird/interesting, I guess to me from a framework standpoint. You're like, React Native is a core feature. This is one of the reasons that you choose React. By the way, we're going to let another company just kind of run with it. [Laughter] You have to go talk to their other company to actually do that.
Tyler: Yeah. In their defense, a lot of the Expo -- I think almost all of them are former Facebook employees.
Chris: I'm hearing about it for the first time. I have no idea what you're all talking about.
Tyler: Expo, the way I think about it is it's a layer that sits on top of React Native, kind of, that just makes a lot of things easier. I haven't done a React Native in, like, a year or even more now. Back in the day, the example was, getting started with an Expo project was way easier than with React Native. Even the simulators were easier. Upgrading was easier. Doing authentication was easier because they just had a bunch of built-in stuff, so you didn't really have to worry about all the P-lists and all of those native iOS or Android things because Expo was just a really nice layer over that.
Chris: It's funny to think about because you're like, "Oh, shoot. I thought that's what React Native was."
Tyler: Exactly. Exactly. That's what I was going to say. Yeah. I think, by now, they may have solved some of those issues. Yeah, I don't know.
I see React Native and Expo pretty much hand-in-hand at this point because they're so intertwined, which isn't a bad thing. It's just kind of the way it is.
Dave: In the same way React technically does server-side rendering, but you should probably just use Gatsby if you wanted to actually get it.
Tyler: Exactly. Yep.
Dave: Yeah, yeah. Oh, yeah, I just find these kind of interesting choices.
Dave: I have heard a lot of the gains have been made. I know people are working on it and Nicole Sullivan has been doing a lot of bridgework between the React team and browser specification stuff. Yeah, so I know it's definitely getting better, but I have heard the VA blogs and stuff. They've made a few improvements, but they're kind of also saying or broadcasting, like, "We made it about as fast as it gets."
Chris: Okay. I was curious if that's….
Dave: "Anything after this, there is no big optimization or low hanging. These are all going to be micro things or new APIs entirely. There's not a lot of juice to squeeze out." That's sort of what I've seen advertised.
We're also faced with the other problem, too, is like phones and laptops are getting slower. [Laughter] The Mac CPU is getting better, but the way they're managing thermals, throttling, and stuff like that, the CPU isn't super much better than its 2015 counterpart on the MacBook Pro. That's maybe clam chowder. You can bust me on some science.
Dave: Devices are prioritizing battery or they're prioritizing a better camera, not so much a better CPU, so that's the other part.
Chris: The time to sit back and just wait for things to improve around us is over, is your kind of vibe there?
Dave: Yeah. Moore's Law is kind of dead now. The CPUs don't double every generation. That's where we're at, so phones are going to get cheaper and cheaper, [laughter] like inexpensive. I'm sure everyone here has a $1,000 phone in their pocket right now, but that's not going to be the face of phones in the future. Bummer. Sorry. No bummers.
Chris: I just realized that the quotes on the bottom of your page, a lot of people have four quotes on the bottom of their page. It says, "I love these courses." Tyler has a thousand.
Tyler: That's actually -- this is an interesting topic because--
Tyler: It's kind of what I optimize for, right? Again, I mentioned this at the beginning where I just try to make really high quality stuff and sometimes it works out. My reviews page, I'm waiting for someone to be like, "You teach this but your reviews page sucks at performance."
Tyler: They would be 100% true, but it's kind of like a marketing thing where it's like there are so many reviews that the reviews page sucks. I realize there are other things I could do to fix that, but it's a statement page. I don't know. That's probably terrible because there are people from other countries who don't have crazy Internet, now that I'm saying this publicly. Anyway, that's the way I think about it.
Chris: Is it bad performance because every single one of those tiny little images is a separate request?
Tyler: No, it's all Sprite. [Laughter] Give me some credit, right?
Chris: Well, then, how bad can it be?
Tyler: It's really long. It's a huge -- I don't paginate anything. It's just a really long page, so I don't know. Comparatively, I guess the other parts of my site are pretty quick because of Gatsby, but the reviews page is just like, "Ah, here's a bunch of pictures, quotes, and stuff."
Dave: Yeah. It's probably the avatars and the gravatars….
Tyler: Yeah, I think it's like a rendering problem, not necessarily a network problem.
Dave: Yeah, that's probably not all React's fault. That's probably more like….
Chris: Where's the value? Is Instagram too early to tell? Is YouTube a good seller for you or can you track a bunch of your sales to Twitter?
Tyler: I can track stuff. YouTube is big for a lot of people. I was kind of late to the YouTube game, so I only have, like, 15,000 subscribers or something. If you look at, like, Wes Bos, Code with Mosh, there are a lot of super big YouTube channels. I think that's where most of their traffic comes from.
Where most of my traffic comes from is just blog posts, like SEO, to be honest. Instagram, almost nothing because that's still kind of new. Twitter, a lot comes from Twitter, but nothing crazy. It really just is word of mouth and SEO are my two big ones.
Dave: You kind of write your long-form blog posts and then you roll out a video, like the video version of that, right?
Dave: You kind of, I guess, maximize even though it's a lot of effort, I'm sure.
Dave: You're kind of like, "Okay, if I went through the trouble of writing all this, I'm just going to make a YouTube video that also talks about this," right?
Tyler: Yeah, and it kind of goes back to, there are different mediums. Some people prefer the medium of a slide show lecture where I'm talking to them. Some people don't want to hear me talk, which is reasonable, and they just want to read a blog post. It's just optimizing for each one of those individuals. It takes a long time because, obviously, a lot of people think they're copy/paste kind of things because they're the same content, but I try to change up the way just because, again, different mediums, different approaches. I don't know. It's worked out so far.
Chris: How about the newsletter? Is that a good driver?
Tyler: It's pretty good. I'm not as active with it as I should be. But what's nice about the newsletter is it's the only channel that you really own until Google changes that. Hopefully, that's never an issue.
For example, Facebook, if you want to target all the people who like your Facebook page, you have to pay them now. Instagram probably will eventually be the same way where it's like not everybody sees your Instagram posts. Twitter is kind of the same way too unless they have the option turned off where they can decide who sees the tweet based on certain metrics. The newsletter, at least for right now, most of the time it goes to everybody who signed up. Hopefully, Google doesn't change that in the future, but I don't know.
Chris: That's wild.
Chris: It's like you want to talk….
Dave: "Thanks for joining my platform and building up your audience. You want to talk to them? It costs a few bucks." [Laughter]
Tyler: I'd be interested, Chris. CSS-Tricks, I assume it's content, like your blog posts, is your biggest?
Chris: Well, we're just a publisher, so the only money is sponsorship and advertising.
Chris: I don't even sell anything on traffic, really. It is to some degree because you have to have a certain level of traffic for anybody to be interested in doing it at all.
Chris: At some point, then, it's just like trust and, like, working directly with people and saying, "I can help you spread your message. Here's how much I'm going to charge you to help spread the message. Yes or no?
Tyler: I actually think we sponsored something this week.
Chris: Oh, yeah?
Tyler: I don't handle that side of the business. Yeah, I'm pretty sure you probably don't either. [Laughter] Neither of us know, but I'm pretty sure.
Chris: That's extremely awkward that you sponsored my thing and neither one of us know.
Tyler: I'm almost positive. Yeah, I'm almost positive. Actually, yeah, because I remember looking at it. Someone sent it to me. An employee sent it to me. It was like, "Hey, does this look good?" It was a CSS-Tricks thing, so I think we're sponsoring a post or something. Anyway, next topic.
Chris: No. No, I think that's actually kind of funny.
Dave: Hey, nepotism.
Chris: It's just because you care about different things, like I have limited time in the day and I outsource some of that stuff too. I do look at everything, so I saw it at some point and decided that it was cool. It's just not as top of mind as it could be.
This morning, I spent a bunch of time working on a blog post that I thought would be really good, so I'm like, "Oh, this is good. I'm going to roll with it for a minute." I spend time strategizing the future of what we're going to do or talking to partners involved in stuff. It's not like I'm not involved. I'm super involved. I just don't know exactly what happens on an hour-to-hour basis.
Tyler: That's probably good, to be honest.
Chris: Fun. Obviously, it's just fun to talk about stuff like that because sometimes it's cathartic to just know that everybody is just winging it a little bit and just kind of guessing that the choices they make are good.
Tyler: Everybody is just making it up as they go. That's my thing. Yeah, we're all just kind of figuring it out.
Dave: Just because it's been something Chris and I have been talking about, I feel like, on multiple shows, was there a point where you were like, "You know, I'm going to sell something"? How did you decide it felt good to make the jump to be like, "I'm going to just sell a course"?
Dave: "I'm going to quit my job, record YouTubes for," whatever, "three to six months and then I'm going to launch a course and I'll do that for the rest of my life"? How did that happen? What was the point of confidence?
Tyler: As I mentioned, I was doing Egghead videos at the time. I love Egghead. Again, nothing against Egghead. I just didn't love, again, because I'm so longwinded. Egghead is like the opposite. No fluff. Get to the point. We've got four minutes to get it all out. To me, especially because I was coming from in-person teaching where I have hour-long lectures, it was a little bit limiting to me.
There was a side of it where, one, they were making me good money, so it's a fair trade, but they were making money off of me, which again is their business. That's what they do. It's totally fine. But I was like, I wonder if I could do this. One, I can get out of the bite-sized space because I just don't love it as a medium to teach. Two, I can kind of just do my own thing and see if it works out. That's really what I did.
At the time, I was doing React stuff on Egghead. This was 2015, I think. I was like, "I wonder if I just make my own course. I'll make it free because I don't really have an audience yet. I wonder if that'll work," and so I did.
Then it was like the perfect timing because React was starting to become a thing and there really wasn't a course out on it yet and it was free, so it was like front page of Hacker News for two days, which usually is kind of a scary thing. In this case, for some reason, they were all really nice. Anyway, that was kind of like my big break where I decided to do it. I made the first React Fundaments course free. Then that kind of really set the foundation for everything I've done since.
Chris: Some of that is serendipity of something that you're interested and something that's growing and getting bigger.
Chris: And that people are interested in stuff like that. I almost feel sorry for people that are really super passionate about something quite obscure.
Tyler: Yeah, it's tough.
Chris: Then you're like, ah, you just got rolled the bad dice there because you should probably teach that because that's your passion. Teaching something that isn't your passion is never going to feel as good as something else. I don't know what to say about that.
Tyler: It's one of those things where luck is probably like 80% of what I do. It just so happened that I really like React. I had a lot of really good people, friends of mine, who were like, "Hey, React is going to be really cool. You should check it out," and so I did. I was teaching and then the Hacker News thing happened. It was just all a weird, very lucky coincidence. Yeah, I've since built on it. Yeah, I feel like that's kind of how our whole industry is with all the developer boot camps. We're all just so lucky that writing software is a thing that is valuable where you can have advertisers on your blog and you can do all of these different things because there are businesses being built on what we do. I don't know. Very, very lucky.
Chris: You know it's almost the opposite of startups sometimes. A lot of times, the early phase of building a business, you don't pick on passion always. Sometimes you do, but you almost always look at the market and the potential of that particular market. If it's too small, you don't do it. You look for bigger markets, you know. I think some people just get a kick out of that anyway. They don't really care what they're going to build. They care about making sure there are enough people that want it.
Chris: You get to have it both ways.
Tyler: Yep. Just very, very lucky.
Dave: All right. Yeah, I think it's a good time to wrap it up. Thank you, Tyler, for coming on the show. For people who aren't following you and giving you money, how can they do that?
Tyler: That's really why I'm here, to get as much money as possible to maximize. No, I'm @TylerMcGinnis on Twitter. My DMs are open, so that's probably the best place to find and chat with me.
Dave: Then, of course, you've got courses available over at TylerMcGinnis.com. All right, well, thank you. Do you have another URL for courses?
Tyler: That's it, TylerlMcGinnis.com/courses, technically.
Dave: There you go. All right, well, cool. Thank you, dear listener, for downloading this in your podcatcher of choice. Be sure to star, heart, favorite it up. That's how people find out about the show. Follow us on Twitter, @ShopTalkShow, for tons of tweets a month. If you hate your job, head over to ShopTalkShow.com/jobs and get a brand new one because people want to hire people like you. Chris, do you have anything else you'd like to say?
Chris: Oh, ShopTalkShow.com.