Search

481: Frontend Feud: ShopTalk vs Syntax

Download MP3

Crossover! Your favorite web dev podcasts join forces for a super collab that’ll knock you frontend off! Amelia joins Chris Coyier and Dave Rupert from ShopTalk Show while Divya teams up with Wes Bos & Scott Tolinski from Syntax. Let the FEUDing begin!

Guests

Chris Coyier and Dave Rupert in silly sunglasses and a sign that says Shawp Tawlkk Shough DOT COM

Chris Coyier and Dave Rupert

This episode is with just Chris & Dave, ShopTalk Show's hosts. Chris is the co-founder of CodePen and creator of CSS-Tricks, and Dave is lead developer at Paravel.

Time Jump Links

Transcript

[Banjo music]

[Record scratching]

Announcer: Please hold. Your feud is important to us.

[Family Feud theme song -- techno version]

Chris Coyier: It's time to play Frontend Feud.

[video game whirls and beeps]

Jerod Santo: Hello, there, and welcome to Frontend Feud. I am Jerod Santo, your host for today. It has been a while since we've played this game, but we are happy to be here today.

We have a podcast super-collab. We got together some of our friends from some of our favorite Web Dev podcasts in this space. I'm sure you've heard of them. It is going to be team Syntax versus team ShopTalk. Hey, everybody. Welcome to Frontend Feud.

Wes Bos: Hey.

Divya: Hey, hey, hey.

Dave Rupert: Ooh, yay!

Chris: Boo...

Jerod: Now, we wanted to give--

[Laughter]

Jerod: We wanted to give it a little JS party flavor, so we've mixed in -- we've sprinkled in some JS Party panelists onto each team. And so, joining team ShopTalk, which is Chris Coyier and Dave Rupert, is Amelia Wattenberger. Amelia, you are on team ShopTalk. What do you think?

Amelia Wattenberger: I love it. We're going to win.

Chris: Oh, absolutely.

Dave: Good answer. Good answer. Good answer. Good answer.

[Laughter]

Divya: No chance.

Jerod: And joining team Syntax, which is Wes Bos and Scott, is Divya. Divya, welcome to Syntax.

Divya: Hey, hey!

Wes: Whoop-whoop.

Divya: Best team.

Scott Tolinski: Ha-ha. Best team.

00:01:36

Jerod: Divya is an old pro at Frontend Feud. I believe the rest of us are all new, even Amelia, so we should have a lot of fun.

I'll quickly explain the rules. This is a game all about the JS Party lovely listeners. We had 140 people fill out our Frontend Feud Survey. We appreciate y'all for doing that. I really appreciate you because I went back to the form at the end and realized the average take time was 37 minutes. I am so sorry. That thing took forever.

[Laughter]

Jerod: That's because we asked 25 questions, so we can play the game a few times without having to go back and do more surveys, so super appreciate all y'all for filling those out.

The goal of the game is to match our listeners' answers. We have polled them on different things, and each team is going to try to match the answer with the most answered from the survey.

Chris: Hmm.

Jerod: As you go about doing that, you win points. If you fail to do that three times in a round, the other team can steal. And the team with the most points at the end of the game wins. Any questions?

Chris: Yeah. It's not the most correct answers, right? I used to play apples-to-apples with my super pedantic uncle, and he was always like, "But my answer is more correct," and you're like, "Dennis! It's not about correctness."

[Laughter]

Wes: Oh, such a Dennis move.

[Laughter]

Jerod: That's exactly right. In fact, many of our questions are subjective, so it's according to the people's tastes or what they think, and so they really aren't right answers. The right answer are the ones that the most people said. So, we will start off with a face-off. This is where two contestants step forward virtually and get a chance to answer first. The person who gets the highest answer on the board takes that board for that team and their team participates in that round.

Ladies first. We will have Amelia and Divya. Please step right up.

[Feud round theme music]

[Clapping]

00:03:21

Jerod: Round one, we'll start with Amelia. Amelia, if you get the highest answer, you immediately take the board. If you don't get the highest answer, Divya gets a chance to take it.

We asked 140 lovely JS Party listeners, "What is your primary Web browser?"

Amelia: Oh, no pressure. I'm going to go with Chrome.

[Dong]

Dave: Good answer. Good answer.

Chris: Good answer.

Dave: Good answer. Good answer.

Jerod: The number one answer with 52 responses, so that means team ShopTalk is on the board.

Chris: All right!

Jerod: We will go in order. You can keep guessing. There are six browsers in the list. You have to match all six to take the board.

Chris: What?!

Amelia: Oh...

Jerod: You have the number one answer, which is Chrome, with 52. There are five left. Let's go to Chris.

Chris: Firefox.

Jerod: Firefox. Show me Firefox.

[Dong]

Jerod: Number two answer with 43 points. Very good.

Chris: Mm-hmm. Mm-hmm. There's no conferring? Who goes next? Me, because I got--

Jerod: No conferring. Now I go to Dave. We go in a round. Dave, it's your turn.

Dave: It gets infinitely harder from here on out.

Jerod: [Laughter]

Dave: Edge.

Jerod: Show me Edge.

[Dong]

Jerod: Number four answer with 11 points. Edge is on there, so you have four of the six. Sorry, three of the six. Now we go back to Amelia.

Amelia: I literally do not know any other browsers. [Laughter] I don't want to say Internet Explorer.

Jerod: Was that your answer?

Amelia: It is not.

[Laughter]

Amelia: My answer is going to be better than that.

Jerod: Okay. So, what is your answer then?

Amelia: You got it! No, it's going to be Internet Explorer. [Laughter]

Jerod: Okay, Internet Explorer. Show me IE.

[Buzzer]

Amelia: Sorry.

Jerod: I'm sorry. That's your first strike.

Chris: It's all good.

Dave: That's okay because that could have been a total troll answer.

Amelia: [Laughter]

Dave: I feel like that was fully valid.

Chris: Yeah.

Dave: Yeah.

Amelia: Yeah, I was.... For all the--

Dave: Yeah.

Amelia: All the testers out there using IE.

Dave: Yeah.

Amelia: [Laughter] Gotta represent.

Chris: Yeah.

Jerod: All right. We go to Chris.

Chris: Do we keep it because of strikes? Yeah.

Jerod: Yeah. You have one strike. You have two strikes left, and then there'll be a steal opportunity.

Chris: I'm going to go with Safari because it feels like one of the big three.

Jerod: Show me Safari.

[Dong]

Chris: Okay.

Jerod: Number five answer with eight respondents using Safari. Remember--

Chris: Oh, so number three is still available?

Jerod: Remember, it's their primary browser. Okay, so now we go back to Dave.

Chris: You got this!

Dave: Oh, boy. I'm going to go Brave.

Jerod: Show me Brave.

[Dong]

Jerod: Number three answer.

Scott: That's it.

Jerod: There it was, number three. Eighteen people out there using Brave.

Dave: Wow! Number three?!

Jerod: As their primary. So, we have one strike against you. You have Chrome at number one, Firefox at two, Brave at three. You also said Safari at five. Did you say the number four? You did. You said Edge at number four. There's one left.

Amelia: What?!

Chris: That's nuts.

Jerod: And we're back to Amelia. You have two strikes, so just take a guess.

Amelia: [Laughter] Dang-it! There's that one where it has -- oh, I'm not going to give any clues. I don't actually know the name.

Jerod: [Laughter] Okay. Do you want to guess something random or do you want to just take a strike?

Dave: I use one called Stack that I know no one else uses.

Jerod: Show me Stack.

[Buzzer]

Jerod: You were correct. Nobody else uses Stack.

[Laughter]

Amelia: Dang-it.

Dave: We don't get a point for that? She was correct.

Jerod: She was correct that nobody uses it, so we go to Chris now. This is your last guess before team Syntax gets to steal.

Wes: Oh, we're going to steal it.

Chris: I've got to go with the big O, Opera. I know it's a wildcard, but I just feel like it might be hanging on.

Jerod: Show me Opera.

[Buzzer]

Chris: Oh!

All: Whoa!

Dave: Oh, man.

00:07:00

Jerod: Three strikes and you're out, so team Syntax gets one guess. You can confer amongst the team.

Wes: Okay.

Jerod: If you get it right, you steal the board.

Divya: Okay. Can we confer openly?

Jerod: Yes.

Wes: Yeah.

Divya: Okay. Samsung.

Wes: I was going to say--

Chris: Oh...

Wes: --Fidalvi [sic].

Chris: Yeah, maybe.

Scott: Vivaldi.

Divya: Vivaldi? [Laughter]

Scott: Fidalvi?

Wes: Isn't that what it is?

Divya: Vidalvi? [Laughter]

Wes: Vivalvi. I always add random--

Divya: Vivaldi.

Wes: I'm just naming browsers here. Yeah.

Divya: I thought it was Samsung because they have a bunch of developer advocates and stuff. And also, you use it when you use your phone, right?

Wes: They don't have a desktop browser, though, do they?

Divya: No, I think it's only mobile. I think it's just a mobile thing, which is why I'm like, "Is it?" I don't know.

Jerod: What's Vivaldi?

Scott: Vivaldi, V-I-V-A-L-D-I.

Jerod: What is it?

Divya: We can't Google it, so I can't tell you.

Jerod: Yeah, that's true.

Divya: [Laughter] I don't know.

Jerod: Okay. So, we have -- you're thinking Samsung. You're thinking Vivaldi.

Divya: Vivaldi is also a famous person.

Scott: Yeah.

Wes: I think of Vivaldi as like a -- wasn't it a security-focused browser? I could see there being one.

Divya: Oh, Tor, actually, which is also....

Wes: Ah...

Scott: Hmm.

Jerod: Can you use that as a--?

Scott: Man, this is tough.

Jerod: All right. Let's make a decision here. What are you guys thinking?

Scott: Okay.

Wes: I think we should go -- what do you think, Scott?

Scott: Oh, I have no idea. In terms of browsers that I just heard mentioned recently, Vivaldi was one of them, so that's why I--

[Laughter]

Divya: Yeah, that sounds fine, I guess.

Scott: I don't know, though. Yeah, I have no idea. Samsung could definitely be it, too.

Wes: I've seen it on Hacker News a few times, which is why I want to go with that.

Scott: Yeah.

Divya: Are JS Party listeners Orange folk, too?

Wes: I don't know. There's got to be one.

Scott: Yeah.

Jerod: That's a good question.

Divya: There has to be one. Yeah.

Jerod: All right. Pick one. Let's move on. What do you got?

Wes: Okay. Vivaldi.

Jerod: Vivaldi, is that number five? Show me Vivaldi.

[Dong]

[Loud cheers]

Wes: I told you! Yes!

Jerod: Five JS Party listeners.

Wes: Five?

Dave: Five people use Vivaldi? [Laughter]

Divya: That's crazy.

Jerod: Five out of 140, yeah.

Divya: Who builds Vivaldi?

Chris: Do they get all the points for the entire round?

Jerod: They stole 137 points on that.

Divya: What?! We made those points.

Wes: Yeah.

Jerod: Well, anybody can guess the other browsers.

Divya: [Indiscernible]

[Laughter]

Dave: Edge. I went out on a limb with Edge, I felt like.

Jerod: It was the third one I wrote down when I was writing down browsers here.

Wes: There you go.

Divya: Amazing.

00:09:23

Jerod: All right. After round one, we have team Syntax with the steal, 137 to nothing. There are lots of game left to play, so we now go to round two, a faceoff between Chris and Scott.

[Feud round theme music]

Scott: Let's hope it's about browsers again.

Jerod: We gave Amelia the first guess last round, so we're going to give Scott the first guess.

Scott: Oh, no.

Jerod: If you don't hit number one, then Chris will have a chance.

Scott: Okay.

Jerod: We asked 140 of our fascinating JS Party listeners, "Name a tool or technology that you use but don't fully understand."

Scott: Okay. But don't understand? Use but don't understand. I am going to say it is... [Loud inhale] I have a lot of options here.

[Laughter]

Scott: Let's just say -- let's say Webpack.

Wes: That's a good answer.

Jerod: Show me Webpack.

[Dong]

Jerod: Number one answer.

Divya: Nice.

Dave: No...

Wes: I knew it! Hold on. I've got to close my door. My wife is texting me, "What's going on?!"

[Laughter]

Jerod: He was having too much fun. All right, so with that, Scott takes the round and team Syntax will play. Now, there are five answers on the board of which you have taken the number one answer, so there are four left. We go now to Divya.

Divya: So, this is Frontend frameworks people don't understand?

Jerod: Let me read it again. "Name a tool or technology that you use but don't fully understand.

Divya: Hmm. A tool or technology that people use that they don't understand. Oh, man. This is a very open-ended question.

Scott: You know, like Webpack.

Divya: Like Webpack. Yes.

Wes: I'm so impressed that you got that, Scott.

Divya: I know. [Laughter]

Wes: I have a lot of options here.

Jerod: [Laughter] Well, all right, Divya. We need an answer.

Divya: Hmm. I want to say -- what's another tool that's similar to Webpack? Oh, Snowpack.

Jerod: Show me Snowpack.

[Buzzer]

Scott: Oh!

Divya: Ah, dang. Not enough users of Snowpack.

Jerod: Sorry. Snowpack was not on the list. Okay. Wes, we go to you.

Wes: Redux.

Scott: That's a good guess.

Jerod: I like that one, but did it make the list?

[Buzzer]

Wes: What?!

Scott: What?!

Divya: Oh, what?!

Wes: Oh, man.

Divya: I guess everyone knows Redux.

Wes: That was almost one of my number ones here.

[Laughter]

Scott: Oh...

Jerod: You've got two strikes and you still have four answers left on the board. We go back to Scott now.

Scott: Docker.

Wes: Oh, that's a good one.

Divya: Hmm.

Jerod: Show me Docker.

[Dong]

Divya: Oh, man.

Jerod: Number two answer, Docker, with 12 respondents.

Wes: Wow, Scott! [Laughter]

Divya: All right. I guess I've got to go to CICD now.

[Laughter]

Divya: Kubernetes. This is probably wrong.

Jerod: I group that with Docker because there were people answering both, so those are together, Docker and Kubernetes.

Scott: Oh, I had Kubernetes on my list, too.

Wes: Yeah.

Divya: They are very different tools, I will say.

Jerod: I know they are, but people were mixing and matching them, so please pick another one.

Divya: Ah... Um... Hmm, hmm, hmm. Let's see.

Scott: I can't believe Redux wasn't one.

Wes: Yeah.

Divya: Can I just CI or does it have to be a tool?

Jerod: A tool or technology.

Divya: Is CI a technology, technically?

Jerod: I think so.

Divya: It's in that concept?

Jerod: I think it is.

Divya: CICD.

Jerod: All right. Show me CICD.

[Buzzer]

Scott: Oh...

Divya: Oh, man.

Dave: That's surprising, actually.

Jerod: Sorry.

Wes: There's no way they'll steal this. That's okay. No sweat.

Divya: There's no way everyone understands CICD.

Dave: Hmm.

Jerod: But maybe they don't use it.

Divya: Yeah. [Laughter]

Jerod: It's a technology that you use but don't fully understand.

Scott: Maybe they don't think about it.

Divya: Come on. Deployments.

00:12:49

Jerod: Maybe they do. Maybe they don't. All right, team ShopTalk can confer on a chance to steal.

Chris: Okay. Okay. We've got a couple of possible options.

Jerod: You've got three possibilities here.

Amelia: I've got thoughts, too.

Chris: I feel like the troll answer is to just say CSS because people like to be like, "I don't understand."

Jerod: [Laughter]

Chris: You know?

Dave: Ooh. Okay. Okay. Okay. Yeah. Yeah.

Amelia: Okay.

Chris: Then the one that you probably actually don't understand is Git.

Scott: Oh... that's for sure on there.

Amelia: Oh, man. Yeah.

Wes: Yeah.

Dave: Mm-hmm.

Chris: But those are just ideas. You know. Whatever.

Amelia: I had Git, too. I also had Bash.

Chris: JavaScript is a troll answer, too.

Dave: Bash. Okay.

Amelia: JavaScript is good, Bash, and Babel--

Divya: Oh, Bash.

Amelia: --which I don't know about.

Wes: Oh, Babel.

Divya: Oh, I just thought of one!

Chris: What do you think, team?

Amelia: You can say it.

Jerod: [Laughter]

Divya: No, I'm not saying it. I'm going to message Wes.

Dave: I had Serverless and stuff like that, but you know I think I like Git.

Amelia: I like Git.

Dave: Or -- yeah.

Chris: What do you think, Amelia?

Amelia: I like it.

Chris: Okay.

Amelia: I like it.

Chris: We're going to go with Git. All right. For the steal, show me Git.

[Dong]

Chris: Yeah!

Wes: Nice.

Dave: Yeah! Big steal.

Chris: Is the game of steals.

Jerod: That's the number four answer with eight respondents saying Git.

Chris: Interesting, so there's a missing three.

Jerod: Number three was React.

Wes: Yeah.

Scott: Oh!

Divya: Wait!

Jerod: And number five was NPM.

Dave: Oh... yeah.

Chris: Fair enough.

Scott: Yeah.

Jerod: A couple of honorable mentions.

Divya: I'm actually surprised no one said RegEx.

Chris: Oh, that would've been good.

Wes: Yeah.

Scott: Yeah.

Wes: Or Reddis.

Divya: Thought about it.

Scott: Tools that make me fall asleep.

Chris: But if you don't know it, maybe you just don't use it.

Divya: Maybe. Yeah. [Laughter]

Jerod: Chris, four people said CSS and just barely missed the board.

Scott: Oh...

Chris: Okay.

Jerod: Three people said Node. Two people said Dependency Injection, which I think you should know how it works before you use that one. And one person said PHP and then, in parentheses, they said, "I don't think anyone will ever fully understand PHP."

Chris: Wow!

[Laughter]

Jerod: Okay. So, some commentary there.

Chris: Install WordPress.

Dave: [Laughter] Yeah. Just use WordPress.

Chris: Cool. That was fun.

00:14:49

Jerod: All right, so let me add these up here. It's a nice steal.

Divya: Cool.

Jerod: That is--

Chris: Is it one-to-one? Is that how it works?

Wes: No. We're still winning by far.

Jerod: It's points. It's points-based, but I'll tell you; the last round, the points double, so there's usually a chance to come back near the end.

Chris: Ooh!

Wes: Double.

Jerod: Okay, so you've stolen 63. There were 63 points available that round, so currently Syntax is still in the lead, 137 to 63.

Chris: [Tongue raspberry]

Jerod: But everyone is playing quite well.

Divya: Nice!

Jerod: Quite within reach.

00:15:13

[Banjo music starts]

Chris: This episode of ShopTalk Show is brought to you in part by Retool for Startups, so Retool, retool.com, remarkably good tooling for building admin tools, internal tools, and stuff. Retool for Startups is a special program that they're offering, so this is what they say.

After working with thousands of startups, they've noticed that technical founders spend a ton of time building internal tools - been there - which means less time on the core product. We built Retool for Startups, a program that gives early-stage founders free access to a lot of the software they need for building great internal tooling.

The goal is to make it ten times faster to build admin panels, crud apps, and dashboards that most early-stage teams need. They've bundled together. It's a free year of access to Retool and then $160,000 of discounts for tools like AWS, MongoDB, AWS, MongoDB, Brack, Segment - you know, really popular tooling for building any kind of Web software, really.

Use your Retool credits to build tools that join product and billing data together into a single customer view, tools that convert manual workflows into fully-featured apps for your team, tools that help non-technical teammates read and write to the database, and so much more.

It's retool.com/startup. That'll get you to the form to apply for this. There's some criteria for it, like you're less than five years old and things like that. [Laughter] Not you as a person. The company. You have to be over five years old as a person, I'm pretty sure.

Check out the site. Apply. Join Webinars. All that stuff. Retool.com/startups.

[Banjo music stops]

00:17:04

[Family Feud theme song -- techno version]

Jerod: All right. Let's move to round three, which is going to be Dave versus Wes.

[Feud round theme music]

Jerod: Now, team Syntax got to guess first last round, so we'll go to Dave for the first guess. We asked 140 brilliant JS Party listeners, "What's something you do to reach a state of dev flow?"

Dave: [mouth beeping]

Jerod: Yes, Dave. [Laughter]

Dave: Music. Do I need to be more specific, like electronic music?

Jerod: Music is just fine. Show me music.

[Dong]

Jerod: Number one answer.

Chris: Hmm.

Jerod: Sixty-six people say they listen to music. They also had a bunch of different kinds of genres and stuff, but I just combined them all together. So, that's team ShopTalk. You guys get to play this round. You already have the number one answer. There are five total answers, four left on the board.

Chris: Fricken' A.

Jerod: And we go to Amelia.

Amelia: Uh...

Jerod: What's something people do to reach a state of dev flow?

Amelia: I drink a lot of coffee.

Chris: Oh, that's going to be totally on there.

Dave: Good answer. Good answer. Good answer.

[Clapping]

Dave: Good answer. Good answer.

Amelia: [Laughter]

Jerod: Show me drink coffee.

[Dong]

Jerod: Number four answer. Good job.

Scott: Wow. Four.

Jerod: That's a generally drinking things: drink coffee. People said drink tea, drink energy drinks. That's worth nine points, so a good one. And now it is Chris' turn.

Chris: I am just dying here. Dev flow, right? What do you do that's a common thing that you do? Is there something like move locations? Is that too vague, like go to a coffee shop?

Jerod: It's somewhat vague.

Chris: Too vague. Too vague. Shut the door.

Jerod: Shut the door.

Amelia: [Laughter]

Jerod: Show me shut the door.

[Dong]

Jerod: I will give it to you.

Amelia: Wow!

Dave: Whoa!

Amelia: [Indiscernible] Wow!

Jerod: This is a category of things where people said remove distractions, go to "do not disturb," close the door, have a quiet place. That's what people were saying, so I'll give you that one.

Divya: I feel like Wes clued them in when he closed the door.

Chris: Yeah.

Wes: Yeah.

[Laughter]

Chris: Totally.

Dave: Yeah. Yeah.

Divya: Definitely helped.

Wes: I was thinking my own tip here.

Jerod: Wes is really in dev flow right now. So, that was 26 points. That's the number two answer, so you have one, two, and four. Three and five are still on the board, and that puts us back to Dave.

Dave: Oh, boy. Blocking time on your calendar?

Jerod: That was part of the remove distractions one. Yeah.

Dave: Well, I need a new one.

Jerod: Okay.

Dave: And the next one is not good.

Jerod: [Laughter]

Dave: [Laughter] Let's see. You've got to have your hot chip. Hot chip. Snacks.

Jerod: [Laughter]

Dave: Gotta have snacks.

Jerod: I was like, "What's hot chip?"

Chris: Yeah.

Jerod: Show me snacks.

[Buzzer]

Dave: No!

Jerod: That's your first miss, so you're doing well. You have two misses left, and it is now Amelia's turn.

Amelia: Ooh.

Jerod: Amelia, what's something you do to reach the state of dev flow?

Amelia: I definitely eat hot chips.

[Laughter]

Wes: Hot chip.

Dave: Hot chip. Hot chip....

Jerod: I get it.

Amelia: I guess if not that, you wanted Chris to be more clear about his going to places thing, so I'm going to go with a specific place, which is going to your desk.

Jerod: Going to your desk.

Amelia: I don't like that face.

Jerod: Show me going to your desk.

Amelia: [Laughter]

[Buzzer]

Jerod: Maybe just a little bit too on the nose, but a good effort. We go back to Chris.

Chris: It sounds like none of these are related to technology.

Amelia: No.

Chris: None of them are, like, "Troll around for cool VS Code extensions," or whatever. You know?

Dave: Go on Twitter.

Jerod: Is that how you get in flow?

Chris: Oh!

Jerod: Installing plugins.

Chris: Yeah, Twitter is the exact opposite of flow.

[Laughter]

Dave: Yeah, I know how to get out of flow. Can we do that one?

[Laughter]

Chris: Yeah. [Laughter]

Dave: Like YouTube.

Chris: Yeah. I'm going to go with put on sweatpants.

Dave: Hmm. Yeah.

Jerod: Hmm. Okay.

Dave: Yeah. Good answer. Good answer. Good answer.

Jerod: Good answer. Good answer.

Dave: Good answer. Good answer.

Jerod: I'm going to give you that one.

[Dong]

Scott: Oh!

Amelia: Nice.

Jerod: This is a combination of prepare yourself, so there was, like, get the room set up, good posture, sleep first, put on certain clothes. People said, "I'll put on comfy clothes," so that's why I'm giving it to you. So, that's ten points, which means there's one left.

Divya: Nice.

Jerod: Number five is still out there and you have one strike left. Dave has a chance at it. Go ahead, Dave.

Dave: Okay, so recap. We've done music. We've done get comfy. We've done--

Jerod: Remove distractions.

Amelia: Coffee.

Dave: Remove distractions.

Jerod: Yeah.

Dave: We've done coffee. And there's one more?

Jerod: There is one more.

Dave: Turn off email? Is that in distractions?

Jerod: That's distractions, yep.

Dave: Oh, boy!

Chris: I'm so sorry, Dave.

Jerod: It's tough.

Dave: Go for a walk?

Jerod: Show me go for a walk.

[Buzzer]

Scott: Oh, that was on my list.

Amelia: Ah, man.

Wes: All right. We get to steal.

00:22:10

Jerod: All right. A chance to steal. I'll tell you; this is a tough one, so you've got your work cut out for you.

Wes: All right, guys. What are you thinking?

Scott: I had, like, put on headphones or something.

Wes: Yeah, I was going to say, like--

Divya: Yeah.

Wes: --noise-canceling headphones, white noise.

Scott: White noise, yeah.

Wes: Exercise.

Divya: Meditate.

Wes: Meditate, I had meditate.

Scott: Although, somebody did say go for a walk, which could be constituted as exercise, maybe, so.

Divya: Yeah.

Wes: Meditate or noise-canceling headphones.

Scott: Yeah.

Amelia: Wait. Was noise-canceling -- yeah, was noise-canceling headphones removing distractions, though? Was that part of the whole umbrella?

Wes: Yeah.

Scott: I had that as my very first one on the list.

Divya: Hmm.

Jerod: Yeah. I'm going to say that's part of removing distractions because it's kind of like getting quiet.

Scott: Okay.

Wes: Okay.

Jerod: Yeah.

Wes: We've got white noise. I have full screen, which is probably also remove distractions.

Scott: Yeah.

Wes: Blocker apps. That's part of the--

Scott: Blocker apps, remove distractions.

Wes: Meditate. White noise.

Scott: What do people do to focus?

Divya: I'm trying to think of all the Tim Ferris productivity hacks. [Laughter] Morning routine!

Wes: [Laughter]

Scott: I have a go-to coffee shop as one of my things on my list.

Divya: Oh, yeah.

Scott: Which is going somewhere.

Divya: Oh, you mean like working at the coffee shop or, like--

Scott: just going to the coffee shop because that's what I do when I really can't focus.

Wes: I would think that's under coffee.

Jerod: Yeah, that one was kind of broached. I think both with your environment and drink coffee.

Scott: Gotcha.

Wes: I think meditate.

Scott: Okay.

Divya: Maybe meditate. Yeah.

Scott: Yeah. I don't have anything else.

Wes: Let's just hail mary it.

Divya: Yeah.

Jerod: Show me meditate.

[Buzzer]

Wes: Oh...

Divya: Ah, man!

Amelia: I thought that was it.

Jerod: Meditate didn't make the list.

Dave: Good for us.

Divya: Now you're really--

Chris: What happens now?

Dave: But I also have -- I have no idea. I want to know that answer.

00:23:49

Jerod: This one, I would not have guessed this. Five people say they listen to podcasts.

Wes: Oh!

Chris: Oh!

Dave: Hey!

Amelia: Oh, okay.

Scott: Okay.

Jerod: Here we all are on a podcast.

Scott: I do that. Yeah.

Dave: That's kind of refreshing that at least five people listen to podcasts. That's great. Thank you all.

[Laughter]

Jerod: And one specifically said, "Listen to the JS Party podcast." I said, "Oh, I appreciate that callout."

Amelia: Aw, that's nice.

Jerod: I'm happy to help you get in the flow. It's the opposite for me. I don't want to listen to a podcast.

Scott: Oh, I do.

Chris: You know what I'd actually do is do something that you're in the mood to do. If I'm like, "I just feel like coding on this thing."

Jerod: Right.

Chris: Then I'll get flow because I'm not fighting against what I want to do.

Jerod: Right. Work on something that you feel like working on.

Wes: Yeah.

Dave: Where was wander around Home Depot for nine hours? Where was that? Was that on the list?

Jerod: That's funny because one person said procrastinate for ten hours.

Dave: Oh, good. Yes.

Amelia: Yes. Nice.

[Laughter]

Jerod: There's the honesty right there. Then a few people said drink alcohol or smoke weed, and I thought, "I've never been in the flow in these states." I don't know. Different strokes for different folks, I guess.

All right, so no steal, so ShopTalk gets the points. They missed the last one, but they still managed to score 110 points in the round.

Scott: Oh, wow.

Chris: That's going to kick us to the lead, for sure.

Divya: Nice.

Wes: Yeah.

Jerod: Major league comeback after three rounds, we have Syntax with 137 and ShopTalk with 173.

Chris: Oh, yes.

Dave: Oh, what?

Amelia: Yes!

Dave: Balance restored. Balance restored.

Chris: [Laughter]

Dave: There we go.

00:25:16

Jerod: We now move to round four.

Wes: All right. Stop giving them easy questions.

Scott: Yeah.

Divya: Yeah.

Jerod: This is called the inverted round.

[Feud round theme music]

Jerod: This round works a little bit different than our previous round. There's no face-off. It's just a back and forth between the two teams, so we just rotate back and forth.

Scott: Hmm.

Jerod: And you're trying to match the board, but it's inverted, so you want to match the bottom of the board, not the top of the board.

Chris: Whoa!

Jerod: Okay? So, there are six things on the board and the bottom one gets 60 points and the top gets 10 points. There are lots of points to be had, but you want to match the board but at the bottom. Okay? So, we asked 140 handsome JS Party listeners, "Name your favorite HTML element. There are six common answers. Since team Syntax is losing, we'll let them go first. We'll start with Divya. Divya, name--

Divya: Oh, my gosh. This is so hard.

Jerod: --a favorite HTML element. Remember, you do not want to have the most favorite.

Divya: I'm trying to think of the bottom ones.

Scott: Oh, my god.

Jerod: We'll have no conferring during this time.

Wes: Yeah, but you don't want the ones that are so far gone.

Divya: Mid.

Wes: You want the six most popular elements.

Jerod: That's right.

Divya: Yeah.

Jerod: Four, five, and six are the sweet spot.

Scott: Yeah.

Wes: Yeah.

Divya: I'm thinking span.

Jerod: Hmm.

[Clapping]

Wes: That's what I would have said.

Jerod: Show me span.

[Buzzer]

Divya: What?!

Wes: Oh...

Jerod: Sorry. Span didn't make the board.

Wes: Who don't like span?

Divya: No one likes span? It's all these React developers. [Laughter]

Jerod: It has to be your favorite.

[Laughter]

Jerod: Yeah, exactly.

Wes: Yeah. All those React apps are just using divs for everything.

Scott: Yeah.

Divya: I know. Seriously.

Dave: Why span when you can I or div inline-block?

Jerod: I. [Laughter]

[Laughter]

Jerod: Div inline-block. Love it. Okay, we go over to team ShopTalk. Let's have Amelia. Name a favorite HTML element.

Amelia: It might be way too obscure, but I know it's got some fans out there. We're going to go with marquee.

Jerod: [Laughter]

Chris: Ah.

Divya: Oh, man.

Jerod: Show me marquee.

[Dong]

Dave: Good answer. Good answer.

Chris: Good answer.

Dave: Yah!

Chris: Well done.

Divya: Nice.

Jerod: Good answer. That's the number two answer, actually, so it was high on the board.

Dave: Oops.

Chris: Oh, my god.

Amelia: Oh, not obscure. [Laughter]

Jerod: It turns out it's not that obscure, so you get 20 points for that one.

Amelia: Yah!

Jerod: We go back now to Syntax, and we'll have Scott.

Scott: Um... Let's think here about HTML elements. What elements do I like a lot? Let's see. Button.

Jerod: Show me button.

[Clapping]

[Dong]

Jerod: Number three answer, button.

Chris: Whoa!

Amelia: Nice.

Scott: Oh, good.

Jerod: So, we get 30 points for that one. Well-played. So, now number two and number three are taken, marquee and button. Number one, four, five, and six are still out there. And we go now to Chris.

Chris: Okay, so we're just going back and forth here. That's another way?

Jerod: Yeah, we're just going to go back and forth.

Chris: Okay.

Jerod: Two of six have been answered.

Chris: And one is going to be -- oh, why would I give you answers? I'm not going to do that.

Jerod: [Laughter]

Dave: Mm-hmm.

Divya: Oh, it's hover.

Chris: I'm going to hope that A is on the list. A, the anchor element.

Jerod: Show me A.

[Buzzer]

Scott: Whoa!

Dave: That checks out. It's a JavaScript podcast.

[Laughter]

Scott: Where's the link tag?

Jerod: ...for that.

Divya: Use a div with a link.

Wes: Yeah.

Jerod: I'll just say, personally, A is my favorite element - personally.

Chris: Unclick is an attribute?

Divya: Yeah.

Scott: Div with an unclick, yeah.

Jerod: Unclick. Div with an unclick. [Laughter] I think we all are hovering around number one. Okay, so we go from Chris over to Wes over on team Syntax.

Wes: I'm going to go paragraph tag.

Jerod: Paragraph tag. Is it popular?

[Dong]

Jerod: It is!

Wes: Yay!

Divya: Nice.

Jerod: That's the number five answer.

Wes: Yay!

Chris: Oh!

Wes: Points, points, points!

Divya: Hey!

Wes: Points, points, points!

Jerod: You score a whopping 50 points on that.

Chris: Dang! 50?!

Wes: Yes! Oh, that probably put us ahead.

Scott: Yeah, Wes.

Chris: Don't you want to get less points (for some reason) on this weird round?

Divya: [Laughter]

Jerod: So, that was Web. Now we're back. We're looping back around to Amelia.

Amelia: It's Dave's turn.

Jerod: No. Yeah, you're right. Dave's turn. Sorry, Dave.

Dave: We need something less popular than P but more popular than the Ruby element.

[Laughter]

Dave: So--

Jerod: That's quite a range.

Dave: Uh, UL.

Chris: Oh, my god.

Jerod: Show me UL.

[Buzzer]

Dave: Oh!

Chris: No!

Amelia: Oh, no!

Scott: All that default styling.

Dave: I forgot it was a JavaScript podcast.

Amelia: It's a React podcast now.

Chris: Yeah.

Jerod: Just think. Is there anybody out there who thinks, "My favorite element is an unordered list. I just love them."

Amelia: [Laughter]

Wes: Divya, now we have to decide if we take the easy known number one or risk it for the biscuit.

Divya: I know!

Scott: I think we take the easy points, if you're asking me.

Divya: We can take the easy one and then go for the later one.

Scott: Yeah.

Divya: That's probably a good strategy.

Jerod: Yeah.

Chris: You might be sick of the joke but look at your name. You know?

Divya: I know!

Wes: Yeah.

Divya: Clearly, you have a div on the team. Gotta use it.

[Laughter]

Jerod: Show me div. Yeah.

[Dong]

Jerod: Yes. Of course, the number one answer.

Wes: Nice job.

Jerod: With 45 respondents, the answer was div. Okay, so we now have number one, div; number two, marquee. I can't remember the other ones. Number five, P tag.

Divya: I think it was like button and P.

Chris: Yeah.

Scott: Button is number three. Marquee is number two.

Divya: Mm-hmm.

Jerod: Yeah, that's right, so we're missing four and six.

Chris: Okay.

Dave: There's only like 112 elements left - or whatever.

Wes: Yeah. [Laughter]

[Laughter]

Jerod: Each team has one strike, so if you strike out, then we'll end the round. You'll have a couple of guesses left. That was Divya, so now we're back to Amelia, right?

Amelia: Yeah, I like images.

Jerod: Hmm.

Amelia: Kind of obscure, but also very nice.

Dave: Okay. Okay. Let's go. Let's go! Let's go!

Jerod: Show me image.

[Buzzer]

Amelia: No!

Chris: No!

Dave: No!

Amelia: Who doesn't love an image?

Dave: No!

Wes: I would have thought that would be on.

Chris: For sure. That's a good guess.

Jerod: Yep, so two strikes for ShopTalk. Let's go back over to Syntax. We're back to Scott.

Scott: Favorite. Um... Let's see.

Chris: Considered the Ruby tag? That's really popular.

Scott: Yeah, it is really popular.

Divya: I love it.

Scott: It's for annotations or something.

Wes: Yeah. Superscript is also a good one.

Dave: The WBO. [Laughter]

Jerod: WBR, yeah.

Dave: [Laughter] Yeah, WBR. Yeah.

Divya: The table element. [Laughter]

Scott: Let's say the nav element.

Jerod: Can Semantic show me nav?

[Buzzer]

Scott: Yeah. No thank you.

Chris: Oh...

Divya: Aw, man.

Scott: Sorry. My bad.

Jerod: All right. Each team has one more guess.

Scott: All right.

Jerod: One more correct guess, so here we go back over to team ShopTalk. It's Chris again, right? Yeah. Chris.

Chris: Hmm. I'm going to just shout out H1.

Scott: Yeah, that was my second guess.

Jerod: Show us H1.

[Buzzer]

Scott: Oh, wow.

Jerod: Ah! There's too many elements.

Wes: All right. Here's my last one. Am I allowed to confer on this one?

Jerod: No.

[Laughter]

Wes: For the sake of, like, a good podcast?

Jerod: No.

[Laughter]

Jerod: For the sake of good podcasting, no.

Chris: [Laughter]

Amelia: Aw...

Jerod: Uninterested.

Wes: Okay. Well, I'm going to think out loud here, so I'm either thinking header/footer or a body or HTML.

Divya: Oh, super meta.

Jerod: Do you think people will be sassy enough to say? Like, "What's your favorite HTML tag?" HTML.

Wes: Body, header/footer. I'm going to say--

Jerod: There are too many choices.

Wes: I'm going to go body. Party of me wants to say HTML. I'm saying body, though.

Jerod: I'll tell you that body was answered by one person.

[Buzzer]

Wes: Oh!

Amelia: Aww...

Jerod: It did not make the top six.

Wes: Okay. SVG? Main?

Jerod: Still pretty good scoring on that round. Number four most popular element: input.

Wes: Oh!

Amelia: Input!

Scott: People like input?

Amelia: Nobody likes inputs.

Wes: No. Yeah.

Amelia: Input is the worst to style.

Wes: Yeah.

Jerod: Yeah, but they make you be able to do things on your website.

Amelia: That's true.

Dave: All right. All right.

Jerod: The number six most popular -- hey, it is a JavaScript podcast after all -- script.

Scott: Whoa!

Wes: Oh!

Amelia: What?!

Dave: Wow!

Wes: I forgot that that was part of HTML.

[Laughter]

Wes: I thought it was part of Webpack.

Jerod: Honorable mentions, a couple of people mentioned iframe. UL was mentioned by a couple of people. The picture element was mentioned twice. Somebody said keep it on the DL, so they're being very--

Dave: Ah!

Divya: Ah. Funny.

Jerod: --cute with that. And someone actually said div, and then in parentheses, they put "ya." So, Divya, you had a fan.

Divya: Yay!

Dave: Wow.

Wes: We get points for that, though, right?

Divya: Yes, we get points.

Jerod: Yeah.

Wes: Yeah.

Jerod: I counted that towards a div, so they got their points. All right, so in that round ShopTalk scored 20 and Syntax scored 90, so we have a game here.

Chris: [Loud exhale]

Jerod: It's going back and forth and, after four rounds, Syntax is in the lead with 227 and ShopTalk trails with 193. It's anybody's game at this point.

00:33:54

[Banjo music starts]

Chris: This episode of ShopTalk Show is brought to you in part by Jetpack, the Automattic plugin for your WordPress site that brings it all kinds of superpowers and abilities.

I'm so stoked about this one. Automattic and the Jetpack team has acquired this website called socialimagegenerator.com. It's a WordPress plugin, a standalone WordPress plugin by this guy named Daniel Post.

I was excited because, in the ShopTalk Show Discord we've got Andy Bell in there hanging out with us. I'm talking about these open graph images, these social media images that I think are so important to have on your sites. We talk about it all the time on this show.

He introduces me to Daniel who has got this plugin. I buy it immediately because I'm like, "This plugin is so cool." It's so perfect for WordPress sites. It needs no additional technology. It just makes these great things. Daniel helps make me a custom card for CSS-Tricks. It's so great.

Then I'm thinking about Jetpack. It has all these features for your WordPress site to work on a social media workflow. For example, you publish a blog post and it auto-posts to Twitter and Facebook. I think that's really cool and really important to my workflow because I have these Twitter accounts for sites that just [blah], they just barf out when there's a new post. I don't want to miss that. That's part of our flow, right?

Jetpack is already helping with that, and it also helps preview social media cards. Jetpack just has social media features in it. So, I tell them. I'm like, "Guys, have you checked out socialimagegenerator.com?" They're like, "You should introduce us."

I introduce them. Low and behold, a few months later - I had no idea this was happening - Social Image Generator and Daniel's product get purchased by Automattic. I think that's so great. Meaning that, at some point soon here, it's going to be part of the Jetpack universe and more awesome features are going to be added to it, which just makes me happy because I love this plugin.

We'll link to the notes for that and thanks for the support, Jetpack. Just one of the many awesome features you offer.

[Banjo music stops]

00:36:06

[Family Feud theme song -- techno version]

Jerod: We now go to round five, and I'll tell you. In round five, all scoring is doubled, so it is certainly anybody's match.

Chris: Whoop!

Jerod: Let's get back to the face-off.

[Feud round theme music]

Jerod: Everybody is faced off at this point, correct?

Dave: I believe so.

Wes: Yes.

Jerod: I think so because it's round -- yes, so we'll go back to the top of the face-off with Amelia and Divya. Amelia guessed first last round, so we'll let Divya go first this round. All right, so there are four answers on the board. Divya, name a common mistake that developers make.

Divya: This is such a broad question. A common mistake developers make?

Jerod: It even rhymes. I just noticed that.

Wes: Hmm.

Divya: They spell debugger wrongly. [Laughter]

Dave: I'm not on your team, but good answer. Good answer.

[Laughter]

Jerod: Show me spelling things wrong.

[Dong]

Jerod: Yes.

Wes: Yes!

Divya: Yes!

Scott: Oh, wow!

Jerod: We've joined forces. Typos and misspellings was the number one answer. I combined the two, so there were 29 in there with typos and misspellings.

Scott: Wow!

Jerod: Because what is a misspelling if not a typo, and vice versa. I mean you end up spelling it wrong when you typo, so pretty much the same thing. That's 29 points and you get to play the round, so.

Wes: All right.

Divya: Let's go.

Jerod: Team Syntax in control. You have three things left on the board. Of course, you have three strikes to give. Scott, it's your turn. Name a common mistake that developers make.

Scott: Oh, gosh. I don't make mistakes very much. I don't.

[Laughter]

Scott: Let's see...

Dave: It's tough. I get it. I get it. [Laughter] It's tough.

Scott: Yeah.

[Laughter]

Divya: Scott makes no mistakes.

Wes: Yeah.

Scott: Yeah. Never, ever, including not spelling things wrong, ever. Let's see. Uh... Here's a decent answer. I don't know if this will work. They pick the wrong technology.

Jerod: Show me pick the wrong tech.

[Buzzer]

Scott: Oh, man.

Jerod: Sorry for that.

Divya: That is very valid. Yeah.

Jerod: Not bad but didn't quite make the board. All right, Wes. It's your turn.

Wes: All right. Would syntax error be covered under spelling things wrong?

Chris: Uh... Boo!

Wes: Hey!

[Laughter]

Wes: Is that what he was going to guess?

Chris: No, it's just your namesake.

Jerod: It's your namesake.

Wes: Ah, yeah, yeah, yeah.

Jerod: Yeah, syntax is a big mistake.

Scott: It is?

Jerod: Okay.

Wes: I'm going to go like syntax error.

Jerod: I think I lumped it in with typos. I think I did because I'm not seeing it.

Divya: I think that's similar to typos. No? Yeah?

Jerod: Yeah.

Wes: All right. I have another one then.

Jerod: Okay.

Wes: Forgetting to save.

Scott: Oh, that's a good one.

Jerod: Show me forgetting to save.

[Buzzer]

Wes: Whoa!

Divya: Oh, man!

Scott: What?!

Divya: I guess it's just us.

Amelia: It's a tough one.

Wes: They've got auto-save on.

Jerod: There we go. All right, so two strikes.

Wes: That's crazy. Okay.

Dave: What's the average age of the audience? [Laughter] Are they all 12-year-olds on iPads?

Wes: Yeah.

[Laughter]

Dave: Everything is auto-saved? Oh, man.

Jerod: All right, we're back at Divya.

Divya: Okay, cool. I think a common mistake that developers will have is -- okay, this is very generic but messing up version control or, like, Git commits.

Wes: Ah, yeah.

Jerod: Hmm. Show me Git problems.

[Buzzer]

Wes: Wow!

Dave: What?!

Amelia: Amazing.

Jerod: That's three strikes.

Dave: Wow!

Scott: All the things on my list are X's. Yeah, this is crazy.

Wes: Yeah.

Divya: I know. I was like, "Come on!"

Jerod: ShopTalk can steal. There are still three things on the board and we only have number one.

Scott: No, we only got two wrong, didn't we?

Divya: We only got two, didn't we?

Jerod: All three of you got one wrong, didn't you?

Wes: Yeah.

Amelia: I think it was three.

Chris: Pick the wrong tech, forget to save, Git mistakes.

Wes: Ah!

Jerod: Yes, there we go. Chris...

Divya: Aw, man!

Wes: Come on. Give us one more.

[Laughter]

Jerod: All right, ShopTalk.

Dave: Oh, boy.

Jerod: You can confer amongst yourselves.

Chris: Oh, we get to talk. That's right.

Jerod: Yes.

Scott: There were only four or only five answers?

Jerod: Four total, three left.

Scott: Waaa!

Amelia: There are no points to steal here.

Jerod: It is a low-scoring round. Yeah.

Chris: They deploy on Friday is a possibility.

[Laughter]

Dave: Deploy on Friday. Messing up types, like trying to add a number and a string?

Chris: Type coercion or whatever?

Dave: Type coercion?

Amelia: Just like really big bundles or memory leaks?

Chris: Oh, performance problems.

Dave: Performance?

Amelia: Performance.

Chris: Mm-hmm.

Dave: Okay. I like that.

Wes: Div as a button.

Scott: Mm-hmm.

[Laughter]

Chris: Semantic elements, yeah.

Chris: How do you say--? Do you just say do performance bad?

Dave: Yeah, bad performance.

Jerod: Yeah. You can say do performance bad. I think that's the right way to say it.

[Laughter]

Wes: Yeah, you should say that.

Chris: Okay.

Amelia: Yeah.

Dave: Oh, no! Wes is in the database.

[Laughter]

Dave: Wes has reverse-engineered the form.

Chris: Yeah. He found the form printouts in the dumpster out back.

Dave: Yeah.

Jerod: All right. Show us do performance bad.

[Laughter]

[Buzzer]

Chris: Oh!

Jerod: Failed to steel.

Wes: I was going to say refresh production.

Jerod: There are a lot of missed ones here. This was a trouble round. Number two answer, off by one errors.

Scott: Hmm.

Wes: Oh, that's a good one.

Divya: Okay.

Scott: Yeah. Yeah. Yeah.

Divya: Yeah, that's a good one.

Jerod: Number three, forgetting semicolons.

Chris: That's a syntax error!

Divya: That's a syntax error!

Scott: I purposefully do that. Yeah.

Wes: I said syntax error, forgetting a semicolon.

Chris: [Laughter]

Divya: Oh, man. Yeah.

Wes: Roll the tape.

Jerod: It's a very specific response. It was a very specific response, so I let it have its own.

Divya: That's a stylistic thing, too.

Wes: I specifically said semicolon, though.

Jerod: Oh, you did?

Wes: Yeah.

Divya: Wes did say that. He did say syntax.

Jerod: Oh, my fault. I'm sorry. I heard syntax error, and then Chris started making fun of him and I--

Scott: Point. Point. Point. Point. Point.

Chris: It's okay. It's okay.

Wes: All right. We get that back, then.

Jerod: Everybody missed it. My bad. Number four, premature optimization.

Chris: Okay. Fair enough.

Jerod: Now, there are a lot of them that just barely missed the top four.

Dave: Who put that answer? Was that Kyle Simpson or something?

[Laughter]

Jerod: Spamming our form?

Dave: Yeah. Yeah. No.

Jerod: Yeah, perhaps.

Dave: All right.

Jerod: There's a bunch of them that were tied at five. Breaking production was answered a lot. Editing or testing the wrong thing, so that's similar to what you were talking about there, Wes, with not saving. Leftover console logs, bad docks, no docks, and then overengineering: those were all mentioned five times. One person said building the wrong thing.

Scott: Oh, I actually built a website.

Jerod: One said building things nobody wants.

Wes: Yeah.

Chris: Yeah. Showed up to meeting.

Jerod: Yeah.

Divya: Built a div instead of a button.

Jerod: One person said writing code, and then one person said getting stuck in Vem, so we can't go--

Scott: [Laughter] Getting stuck--

Jerod: Every ... has to have a Vem reference, and there it is.

Divya: Oh, man. Come on.

Jerod: There are your trolls. All right, so there are 29 points scored by team Syntax. Since it's a double round, we will double that.

Scott: Yah!

Dave: Wow.

Wes: Do we get points for the semicolon too?

Jerod: No.

Divya: We fought hard and we lost.

Jerod: I apologize.

Wes: That's an upset.

Divya: The law one.

Jerod: So, after round five, it's Syntax 285 and ShopTalk 193. We have just one round left.

Divya: Sick! Let's go.

00:43:02

Jerod: All right. Round six is also a double score round, so this is ShopTalk's big chance to make a comeback. Step right up.

[Family Feud theme song -- techno version]

Jerod: Chris versus Scott. Now, which one of you two got the first guess the last time around? It was Scott, so we'll let Chris take the first guess here.

Scott: I did.

Jerod: Round six, a double round, we asked 140 intelligent JS Party listeners, "Name an organization that helps push the Web forward." Chris?

Chris: The W3C.

Jerod: Show me the W3C.

[Dong]

Jerod: That is the number three answer. It's not the number one answer, which means Scott has a chance to take the round.

Scott: Oh, man.

Jerod: Scott, name an organization that helps push the Web forward.

Scott: An organization.

Divya: You got it. You got it.

Scott: That helps -- an organization. Does that include nonprofits like -- uh... Helps push the Web forward. Man, this is tough. I don't know. Let's say--

Jerod: Take a guess.

Scott: Yeah.

Wes: Come on, Scott. We had a show on this.

Divya: Phone a friend!

Wes: Ah!

Jerod: No helping him.

Scott: Help here.

Wes: We had a show on this.

Jerod: No helping him.

Scott: Yes.

Divya: Ahhh!

Scott: We had a show on this. What does that--?

[Laughter]

Scott: What did we possibly have a show on?

Dave: Scott is now going through 300 episodes.

[Laughter]

Jerod: We're going to need an answer here, Scott. Guess one.

Scott: Shoot. Shoot. I don't know. Organization that helps push the Web forward. Hmm... I know. I'm sorry, Wes. I'm very sorry.

Wes: Hmm. Hmm. Hmm.

Divya: [Laughter]

Jerod: Wes is trying to provide visual aids here.

Dave: Whoa! Whoa! Whoa! We've got some baseball--

Jerod: This is table talk. Apparently, he wants you to steal a base. I don't know what he's doing right here.

Scott: Yeah. I don't know what he's saying either.

Jerod: The Baltimore Orioles.

[Laughter]

Scott: Oh, gosh.

Jerod: All right, Scott. I'm so sorry. Yeah, Free Code Camp. Who cares.

Jerod: Free Code Camp. Show me Free Code Camp.

Wes: Oh, that's a good one.

[Buzzer]

Divya: That's pretty good, though.

Jerod: Yeah.

Dave: I liked it.

Jerod: All right. ShopTalk gets the round. ShopTalk, you're well-positioned to steal this game right here and now. Chris got the number three answer. There are five total answers on the board.

Chris: We got this. We got it.

Jerod: There are four left, numbers one, two, four, and five. We go to Dave. Dave, name an organization that helps push the Web forward.

Dave: Google Chrome. Google.

Jerod: Show me Google.

[Dong]

Jerod: Number two answer, Google.

Scott: That makes sense.

Jerod: With 28 responses.

Scott: I wasn't thinking like corporations.

Jerod: All right, that's two and three. One, four, and five are left. Amelia, it's up to you.

Amelia: I'm going to go with MDN.

Jerod: Show me Mozilla Developer Network.

[Dong]

Jerod: Yes, the number one answer.

Dave: Yes!

Wes: Wow.

Jerod: With over 51 answers were Mozilla and MDN.

Chris: Yes!

Jerod: So, killing it. You have just--

Chris: We can lose it if we don't get the fourth one?

Jerod: Two left. There are five total. There are two left.

Chris: Oh, there's four and five left?

Amelia: Oh, no.

Jerod: Yeah, back to you, Chris.

Dave: Oh, boy. Two left! Uh-oh.

Chris: It's not going to be fricken' Apple, right? Then all they get is yelled at for not pushing the Web forward.

Wes: [Laughter]

Amelia: WebKit everything.

Jerod: Remember, you get three strikes, so you have -- you can throw one out there and see what happens.

Chris: Oh, yeah. Oh, that's true. Right? I'm just going to go with Microsoft because they actually do work in the Web. Microsoft.

Jerod: Show me Microsoft. Survey says--

[Dong]

Jerod: Number five answer, so now you've gotten one, two, three, and five. There's one answer left. You have three strikes, so you're sitting pretty. Dave, it's to you.

Dave: I'll do TC39.

Wes: Oh!

Dave: ECMAScript.

Jerod: Show me TC39.

[Dong]

Jerod: Hey!

Chris: Oh, wow!

Divya: Oh, wow! Man!

Wes: That was the one! I was telling you, Scott, we did a show on.

Divya: Yeah, I know. I was like, "Ah!"

Amelia: I was going to say CSS-Tricks.

Scott: Why were you touching your head? I was thinking like "head."

[Laughter]

Scott: What's got a head involved?

Divya: I didn't get the head thing.

Wes: Look at your hat! What hat are you wearing?

Scott: It's a GitHub hat.

[Laughter]

Dave: Oh, GitHub would be a good answer. Yeah. Yeah.

Divya: That is true, yeah.

Chris: I would have said Smashing Magazine, personally.

Divya: Well, GitHub is Microsoft at this point.

Jerod: That's true.

Wes: Yeah.

Dave: Yeah, okay.

Jerod: That's true, so that was a huge round for ShopTalk.

Wes: Shoot!

Jerod: That was round six. The final round is also a double round.

Scott: Oh, man.

Jerod: They scored all of the points.

Divya: Oh, man.

Jerod: And when you double all those points, that round alone was 216 points.

Divya: Oh, yikes.

Dave: Yah!

Scott: I'm so sorry.

Jerod: With 409 points, the winner of Frontend Feud super collab is ShopTalk.

Wes: Wow!

Chris: I have never lost on this program!

[Groans]

[Laughter]

Scott: I'm so sorry, guys.

Wes: Congratulations. You stole it from us.

Divya: I know.

Scott: No thanks to double points. Yeah.

Divya: Killer.

Scott: I like my points non-doubled. Okay? Thank you.

[Laughter]

Amelia: That's how you lost.

Dave: Oh...

Jerod: All right. Well, ShopTalk, congratulations on the big win. What do you win? Well, you win an opportunity to shout out or say whatever you like. You cannot gloat. You must say something not about Syntax. It has to be anything else. Shoutout something. This is your chance to speak to the JS Party listeners.

Dave: Chris, do you want to go? You said you had something earlier.

Chris: Oh, I was just thinking of it because it came across my desk. There's a local feud in town here in Bend, and this guy is really mad that they put a gate on his property. He made a whole website about the gate and how mad he is about it.

I want to shout out to feud websites because we're playing The Feud anyway.

Jerod: Nice.

Chris: I think you get extra -- it's extra cool to make a website out of your madness.

[Laughter]

Dave: Make that beef public.

Chris: Yeah.

Dave: Just make that beef public.

[Laughter]

Jerod: At least build something constructive.

Chris: Yeah.

Dave: That's beautiful. Well, my shoutout is going to be to Amelia's cool GitHub visualization project to help you visualize a GitHub repo in a non-directory of files way. I think it's really cool, so hey.

Amelia: Thanks, Dave.

Dave: Yeah.

Jerod: I will double that effort. I think I shouted it out last episode. We're so impressed, we just keep bringing it up, Amelia. Nice work. Would you like to give a shoutout, maybe back to Dave or anybody else? [Laughter]

Amelia: I was actually going to say CSS-Tricks for the last question, so a shoutout to CSS-Tricks, even though it wasn't on the board for some reason.

Chris: For pushing the Web forward? I agree. That's what I do.

Jerod: I should say there were a couple of honorable mentions that round. In all of the excitement, I forgot about them. The Chromium team themselves got a couple of shoutouts. Vercel got three shoutouts. The EFF (Electronic Frontier Foundation) got four.

Scott: Oh, yeah.

Divya: Oh, yeah.

Jerod: Then a couple of people shouted out open-source, even though it's not an organization but definitely the open-source community pushing things forward. I will back up what Amelia says and say CSS-Tricks definitely pushing Web developers and Web development forward over the years, as well as y'all's podcasts. Awesome stuff continuing to put out.

Wes: Totally.

Scott: As well as Free Code Camp too, right?

Jerod: Yeah.

Scott: That's also a good one. Yeah.

Jerod: Yeah, absolutely.

Wes: I'm surprised that wasn't on there.

Jerod: It got one mention, I believe.

Wes: And Level Up Tutorials.

Jerod: Yep, Level Up.

Chris: Yeah.

Jerod: Yeah. Anything else to shout out?

Scott: Wes Bos's blog.

[Laughter]

Wes: wesbos.com/courses.

Dave: Yeah. React for Beginners wasn't on there because I feel like 100% of people who know React know it because of Wes's course.

Wes: All right.

Dave: Is that on there?

Wes: We got all our plugs in. There we go.

Scott: Yep. There we go. There we go.

Jerod: Definitely should have been on there. Well, we'll give one last shoutout to a JS Party listener, the winner of the free JS Party t-shirt -- remember, everybody who took the survey had a chance at it -- is--

[drumroll]

Jerod: Geneve Parish. Geneve, you won a free shirt.

Dave: Yay!

Divya: Nice. Yay!

Chris: [Laughter] That was so sad.

[Laughter]

Wes: Yay!

Dave: Yay!

Scott: Boo-hoo.

Divya: [Gasp]

Jerod: Of course, that means that 139 of you did not win, but don't fret. You can always just buy yourself a shirt at merch.changelog.com. How about that? And, as a bonus, since I'm feeling generous, we'll also give out a free shirt to one random member of our JS Party community Slack. So, if you don't hang out in there with us, you should! It's #JSParty. You can hop in there at changelog.com/community. It's all free. Hang out during live shows. Talk Web dev with us.

And on - what - September 17th, I decided we'll just pick a random person in that channel, and we'll ship you a free JS Party t-shirt as well.

I want to thank the guys from Syntax and ShopTalk for joining the show and playing this awesome game with us. Round of applause for just the participation.

[Clapping]

Jerod: And, of course, thank you to Divya and Amelia for sprinkling the JP Party into the show. Love it.

[Clapping]

Jerod: Thank you, all listeners, for playing along with us. This has been Frontend Feud. This has been JP Party, and we will talk to you next time.

[Family Feud wrap-up music -- techno version]