424

January 19th, 2022 × #skills#learning#productivity

New Year, New You. What to Focus on in 2022.

Scott and Wes give coding, soft skills, and random skill focuses for beginner, intermediate, and advanced developers for 2022.

or
Topic 0 00:00

Transcript

Wes Bos

Welcome to Syntax, the podcast with the tastiest web development treats out there. Today, we've got one rid Full of treats for you. We're going to talk about what you should focus on in 2022, and we sort of have a bit of a structure for this one. Rid. We are gonna go through beginner, in intermediate, and advanced developers.

Topic 1 00:33

Pick coding focus, soft skills focus, and random skill for beginner, intermediate, and advanced devs

Wes Bos

And then Scott and I will both for each category, Scott and I will pick, rid what should you focus on for coding? What should you focus on for soft skills? And then we have something we're calling random fun mixed rid bag. Anything goes, skill or goal. We couldn't figure out what that would be called, but just like I love how we thought about that for a little while, and then that's what we came up That's that's as good as it gets.

Wes Bos

The mixed bag skill or goal, I guess we can call that.

Wes Bos

We are sponsored by 3 awesome companies today. Rid. Sentry does your error exception in performance tracking. Linode cloud hosting and computing and FreshBooks rid Cloud accounting. We'll talk about all of them partway through the episode. How are you doing today, Scott? Oh, I'm doing good.

Scott Tolinski

Doing good. Doing good. Doing good. Doing good. I'm feeling you know, It's it's funny because I feel like I'm caffeinated, but I haven't even drink half my coffee yet. So, I think it's just natural naturally aspirated. Is that what they say about Ours naturally aspirated. I don't know. Naturally aspirated. There you go. That's right. I

Wes Bos

I'm on my, like, 8th cup today. Kids are unfortunately back in rid Back doing homeschool. So we have this whole crazy setup now that we have to do again. So hopefully that is Not a lot for long, and it's the last time we've done homeschool, like, 14 times now. That's yeah. That is tough.

Scott Tolinski

Even, like I mean, our kids were, like, just, like, fighting this morning, and it's just, like, oh, man. This is so hard sometimes. Yeah. Please please just stop yelling. Stop fighting.

Wes Bos

We are pretty upset at all. Like, we don't need any more yelling. Yes.

Wes Bos

Alright. Let's get on into it.

Wes Bos

Rid. A little caveat.

Wes Bos

We sort of approach this as, like, you want a good mix of skills and, like, job suitability.

Wes Bos

Rid. And this is obviously not for everybody, but we think, like, if you are in one of these categories, like, what do we think that You should maybe focus on, and Scott and I both picked one thing. So you wanna kick it off there with coding focus for beginners?

Scott Tolinski

Yes. Coding focus for beginners.

Scott Tolinski

Here's one that I think will come in handy for all of your job interviews from this point forward. If you are a beginner, Knowing and understanding semantic HTML will make you a more, more enticing candidate to be hired anywhere. In fact, this is one of the things that even came up with my interview when I interviewed at Google.

Topic 2 02:37

Semantic HTML knowledge makes you stand out in interviews

Scott Tolinski

One of the questions they asked me was, like, here's this interface.

Scott Tolinski

What would you make each of these elements? And that was the question. It's like, what that they were just trying to see. Hey. Is this guy gonna Turn these things into dibs and spans. Is he gonna use appropriate elements where required? Like, what's he gonna do? And so for me, I think having these skills, having the knowledge and ability to use an HTML element when appropriate Is going to really take you into not just being a competent developer that's writing good code, but it's gonna be Turning you into the developer who stands out in a a job interview. So let me tell you. Like, there there's some interesting HTML tags out there, And some of them have very specific use cases, whether it is like an article or a section or a main or whatever. Right? You're using these elements where necessary.

Scott Tolinski

But if someone were to come with me in a code challenge that had me thinking about the HTML, and when I looked popped up in the HTML, I saw something like a fig and a fig caption or something, and it was appropriate. Like, let's say that worked out, and it was how it was supposed to be.

Scott Tolinski

I would I would look at that HTML as being a more more better, more important than someone else who, did not, who just somebody who made it a div, and that could be the thing that makes you stand out.

Scott Tolinski

You know, HTML elements, like I said, there there's so many of them, But having a good good knowledge and good understanding of how to bend them to your will and use the appropriate ones will make you stand out. Here's some tips. You you you're gonna most likely have a personal website. Right? A personal blog, a personal website, anything. It doesn't have to be a blog, but just a personal site. Right? Any developer, if you're applying for jobs, you should have a personal site because that's a great way for you to show off that you know what you're doing in some sort of way. What I'm going to do if I'm your job rid. Interviewer, I get your resume.

Scott Tolinski

I get your your pop up in your website, kinda see what you're about.

Scott Tolinski

The second thing I do after I read Is I do command option u, and I look at your source because that's what I'm gonna do every single time.

Scott Tolinski

So You should be doing the same thing. You should be looking at your source.

Scott Tolinski

You should see, does this HTML look good? Is it appropriate? And if you don't know because you're a beginner, which is very likely. Right? If you don't know 1, don't feel bad about it because you're a beginner. You should be learning these things. You You should be asking people. Right? In fact, we should be doing another syntax highlight where we look at people's

Wes Bos

Code. And then what what do we call that? Do we call those syntax highlights? Syntax highlight. Yeah. I put it on books for 2 weeks from now, so we we've got one coming up. Actually, let's rid Shout it out right now. If you want us to review your portfolio, or your website on Syntax, just go to the Potluck question on syntax.fm,

Scott Tolinski

and just put the link in there and say, this is for syntax highlight, and we'll we'll review it. Yep. And so one of the things we'll do is we'll take a look at your source, because that's one of the things I always like to do, especially because I know job inter job, reviewers, anyone who's Potentially, hiring is going to do the same thing.

Scott Tolinski

So ask for help. Or you know what? Pop into the level up tutorials Discord Or even I don't know. Like, Reddit is temperamental. Like, you could post it one day on Reddit, and and then you'd be getting, like, some messages to, you know, go f off, or you might be getting some messages that are actually helpful.

Scott Tolinski

So that that one's maybe hit or miss, you know. But If you post in the level of tutorial discord or other coding discords or, other places and just say, hey, I would just like someone to take a look at my HTML.

Scott Tolinski

Does this look fine? People will be giving you help because it's not something that it takes a a ton of brainpower if you know The correct usage of these HTML elements. It takes me about, you know, a minute to scan an HTML document if it's rendered in the browser to say, Alright. This is good or not. Now if you're building your site with these front end frameworks and you and and there's no HTML there and it's just straight up JavaScript, then that might even be a bit of a problem too Because I kinda wanna see that stuff as it is in the HTML as the browser is seeing it. So, just some some thoughts there.

Scott Tolinski

But yeah. You know, If if you don't know and you're you're you're looking for HTML feedback, just ask for it. Ask for HTML feedback again, submit to syntax highlight. Either way, Having a command of semantic elements in HTML will make you stand out as a candidate because every single time I look at websites, I can find at least a few things wrong with HTML. I'm sure I can find some things wrong with my own HTML if I looked hard enough. I'm going to say the coding focus focus for a beginner is,

Topic 3 07:42

Get good at working with data in JavaScript

Wes Bos

rid data in JavaScript.

Wes Bos

Get really good at, alley ooping it. Get really good at massaging it. So, rid. Take the the 4 data things in in the browser, which are arrays, objects, maps, and sets. Rid. Get good at looping over them, copying them, moving them, adding items to them, removing items from them, maybe even rid hyping them if you want to dabble your toes into a little bit of TypeScript. I think that being able to take some data rid and make it look like however you want it. Add the items. Remove everything I just said is a core fundamental skill in JavaScript for developer.

Wes Bos

If you're good at that, you're gonna

Scott Tolinski

it's it's a large part of being a JavaScript developer is just working with data. Interesting. Alright. Well, let's talk about soft skill. It's funny because I just spent, like, a 1000000000 hours on mine, and you were just like, yeah, just do this.

Wes Bos

Well,

Scott Tolinski

rid. I'll I'll talk a little bit more about some of my other ones, but that one's pretty pretty straightforward as just get good with objects, arrays, maps, and sets. I think that's that's great advice. I definitely think that's that's one thing that took me to a newer like, a more commanding space of my code, I think. Totally. Totally. So my My soft skills focus here is going to be, practice with issues and technical workflow.

Topic 4 09:02

Practice writing good GitHub issues and PRs

Scott Tolinski

Too oftentimes, you see GitHub Issues or responses to GitHub things that just say, you know, this doesn't work, this broke, whatever. Or maybe you're working in a team And you have your own issue tracking system and people are just not responding with ways that are helpful.

Scott Tolinski

The most helpful thing you could possibly do as a junior developer is to be very good at Finding and reporting issues accurately.

Scott Tolinski

I just got a big list from, a developer that works on LevelUp, And he's not a junior developer. He's, you know, he he's a very talented developer, but I, like, sincerely appreciated his notes because his notes were so like, This related to this issue does this when you do this, and here is like a a thing. And he's like, I can put these in GitHub if you'd like.

Scott Tolinski

And and every single thing told me exactly what the problem was, where it was, the path, the the whatever he he noticed.

Scott Tolinski

And if it's related to a PR, gonna put that PR. If it's related to an issue, he's gonna put that issue. If it's related to something some person specifically was working None. He's gonna tag that person. And so having a good understanding of how your system works and who to reference, What to reference and how to essentially craft, things that are that are both informative But also concise. Right? I don't need a paragraph of text to tell me the button color is wrong. Right? That's not that's not helpful as well. So it's not just about, red. Bread, you're not just trying to have a ton of information there, but it's knowing what's relevant and what works well for your team.

Scott Tolinski

If you wanna pay attention to who on your team, if you're working on a team is doing this well, keep in mind, just say, alright. This person writes rid Really good error messages and just copy it. Say, this does this, does this, when this does this, CC so and so because, you know, this is maybe their project, and then it's related to this branch. It's related to this release. It's related to this issue. Here's a PR for this, or here is it's like related to this PR, whatever. All of those things are going to come in handy. And as a manager, any project, they're going to look at you finally compared to someone who's filing some issue that's Uninformative, unhelpful, or just adds more mystery because those kind of issues never get solved. They never get fixed, and they just kind of add to Add to the noise. Right? We don't want to add to the noise. We want to solve problems and advance the code base.

Wes Bos

My soft skill here is get good at Emailing people.

Wes Bos

And we have an entire podcast, 117, how to email busy people.

Topic 5 11:46

Get good at emailing busy people concisely

Wes Bos

But I found, At least in all of my dealings working with people in professional services, as well as other developers.

Wes Bos

The more successful somebody is, the shorter The emails they actually write. And it's not that they are being curt or brief. It's that they are very good at getting their Questions and information across without writing an entire book. It kind of goes back to what Scott was was just saying and, rid. I found somebody the other day sent me this email that was probably, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10. Rid. Fifteen paragraphs. Each paragraph, 3 or 4. And I said, like, man, I would love to help you, but, like, you can't you can't expect me to read all of this. Rid. Just give me the bullet points. Like, what are you what are you looking for here? And he said he came back with just 3 bullet points of this is what I'm trying to do, And I would really like to, ask you this question. And it was it was beautiful. It was nice nice and quick. Hi, Poppy.

Scott Tolinski

Daddy, can we get,

Wes Bos

cat milk? Can we get a milk?

Scott Tolinski

That's,

Wes Bos

milk. Yeah. I'm gonna go after we're done recording this. I'll I'll go. Okay? With me?

Scott Tolinski

I could probably take you. Yay. Yeah. Alright.

Scott Tolinski

See you.

Scott Tolinski

Love you.

Wes Bos

Rid. Sorry about that.

Wes Bos

Just being able to get your point across. If you're asking for things, number them. If you are telling people things, bullet point them, rid Hold the important part. Make it skimmable. All of that stuff. That's, one huge, huge skill you can have, especially if you are trying to cold approach rid. Random people for asking for their help or you wanna partner with them, things like that.

Scott Tolinski

Alright. Well, okay. This is the next section, which is going to be random fun mixed bag, anything goes, skill goal.

Scott Tolinski

This one's fun for me because I kind of had a theme for mine. So this first one for beginners. Right? If you're a beginner, you're probably, you know, have A basic understanding of HTML and CSS and maybe some JavaScript. Right? Yeah. It may be some JavaScript.

Scott Tolinski

This Challenge is going to be to spend some time getting things to animate with CSS.

Scott Tolinski

And I'm just talking straight up CSS. No JavaScript. Get things to animate. To dive into key frames. Dive into transitions.

Topic 6 14:05

Make something animated with CSS

Scott Tolinski

Know how to have a transition delayed or maybe a different transition from start, to, like, maybe hover on hover off. Maybe, transitioning multiple properties in multiple different ways or maybe even doing Literal key frame animations to be like a, like a character animation or something like that. Maybe even working with sprites To do animations, there's a lot of really interesting techniques you can do with just straight up HTML and CSS to get things animated on your page, and these don't have to be Interface animations. This doesn't have to be a card fading in. You can do some innovative stuff. In fact, I would challenge you to just say, I kinda wanna just I kinda wanna get this, this little this little thing animating. I don't I don't know. I wanna just have a buzz around or something. Just go for it. Do anything you could possibly imagine. Just just dive into interface animations in any sort of way, and I think that will be a lot of fun. But But it's also going to be a useful skill to have because, trust me, there there's not a a lot of developers aren't really that skilled with animations.

Scott Tolinski

And whenever I was working in the past with animations, they would send me to talk to the designers because I was the developer that had a handle on animations, and the designers had a visual understanding of animations. And I was able to bridge the gap between the Technical animation side of things and then the visual animation side of things. Like, not to mention, like, what an awesome way to,

Wes Bos

rid make your portfolio look stand out from everybody else. Where if you spend a little bit time learning animations when you're early on in your rid Career, then everything you make is gonna have a little bit more whimsy and fun to it. And it's gonna stand out from the All the millions of other developers that are you're competing with.

Scott Tolinski

Totally.

Wes Bos

I'm gonna say, so my random fun mix rid. Bag anything goes skill or goal. I'm going to say make a full stack contact form in a framework. So Code the UI, the form itself, the logic of, submitting the form and and making sure the data is rid. Good.

Topic 7 16:23

Build a full stack contact form

Wes Bos

The server part that accepts the request and then the actual, using a package, nodemail or something like that to actually send out an email.

Wes Bos

Rid. I feel like that is a very, very good exercise for a beginner because it may it really makes you touch upon rid Everything. The that's the entire stack right there. It goes everything from the rendered and styled input on the front end to the back rid. Again, to touching to external services to actually send the mail. Fun.

Wes Bos

Beautiful.

Wes Bos

Beautiful.

Wes Bos

What else is beautiful?

Scott Tolinski

Yeah. I was just gonna go there.

Scott Tolinski

Century at century.io is literally And both metaphorically beautiful because their interface is a fantastic way to be able to see all of the errors and exceptions that your product has, Project or product, so to say, at any given point because the table that the main issue queue in is really fantastic rid in terms of giving you the right information, the right amount of tools without having things cloud that. So if you have any sort of product and there's some sort of bug or anything happening in there and a caught or uncaught exception, they will pop up. You'll be able to see what's going on really quickly, and you'll be able to address them. Now there's also excellent performance metrics tools that are really super neat, And you can track the, the improvements over the course of time. You can see how fast certain routes of your sites are, and more importantly, You can see how slow certain routes of your site are. In fact, I just I just updated to the latest version of Svelte and added a small layer of caching on level up rid.

Scott Tolinski

West and the slowest route on our site went from 2 seconds to 200 milliseconds.

Scott Tolinski

Wow. And it It was it was one of those things that I did at the end of my workday. It was just like YOLO. Well, let's just try it. Oh my gosh. And then then then, like, The speed difference was so amazing. And you know what? Wow. Even though I haven't released that update just yet because I'm still testing, I am so excited for the day that I do because I'll be able to see just the very real impact that has directly in century in my performance tools as I can watch that user misery score plummet for that route. So check it out at century.century.i0, not century.century.

Scott Tolinski

Ready. But century dot I o. Use the coupon code tasty treat, all lowercase,

Wes Bos

all one word, and that's century, s e n t r y. Rid. Alright. Let's move to the next one, which is you are an intermediate developer. What are the 3 things that we think you should focus on? What do you think about intermediate code focus?

Scott Tolinski

Intermediate code focused CSS variables.

Scott Tolinski

Let me tell you. See people who work with CSS variables are going to be in high demand, in the next little bit here because CSS variables are awesome. They're reactive. You update 1, they update through your entire site. Building themeable complex UIs with CSS variables is going to be a skill that becomes more and more valuable as people understand just how good it is.

Topic 8 19:04

Learn CSS variables deeply

Scott Tolinski

And the best way you can really get a handle on who's doing CSS variables well is to just Start looking at it, you know, inspecting element on many sites, especially the the standard sites that we all look at as being, like, sort of the the gold standard sites like Stripe. You know, if you look at Stripe's website, look at their CSS variables. They have They got lots of them. Yep. They have lots of them. Look at the naming. Look at how they're organized. Look at even the structure of some of them. And then not not just looking at the the styles tab, but also look at their CSS. Pause through their CSS and see what's there.

Scott Tolinski

A couple of episodes ago, we talked about, Adam Argo's open props, subatomic Styles library, this is a great thing. Subatomic.

Wes Bos

What? Sorry. I'm just I'm just marveling at Subatomic.

Wes Bos

Okay.

Scott Tolinski

Rid Yeah. I I thought you were I thought I I said it wrong or something. No. No. No. You said it right. Sorry. Go ahead. No. These are these are great.

Scott Tolinski

They're fantastic. And and not only that, but it shows you a really great way to name and organize as well. And there's not like a standard way of doing all of this stuff. It's very much Like a new thing that people are still really experimenting with and and growing with. But I think that having a commanding understanding of rid. CSS variables.

Scott Tolinski

How to create both effective CSS variable systems. Write them from scratch, and then bend them to your will In ways that are extendable and all that good stuff is going to be a very good skill. And if you are that person who's like, I'm a serious as variables, completest. I I get everything about them. I understand how to use, overrides via default values and CSS variables. I understand how to Change and manipulate color, sizing, have things be responsive with CSS variables.

Scott Tolinski

You are going to really experience,

Wes Bos

rid. I I I think just a a greater understanding of writing really good CSS, so check it out. I I think We need a whole show on that. Now that you're talking about that, it's like, yeah. Of course. We all know how to use a CSS variable, but, like, like, what is it? What now what's your approach to organizing these things. And and,

Scott Tolinski

I think, yeah, let's let's put that on the books. I think that'd be a really interesting one. And I think, You know, it it solves a lot of those library code issues. Right? Because so long we were like our library CSS issues were to style something And overwrite some styles even just to change a color on a library CSS. You're having to import the CSS. You're having to Find the class name that you wanna do and update the property, but things aren't like that anymore for really advanced libraries.

Scott Tolinski

Nowadays, you're having scoped variables Where you can overwrite that variable anywhere, whether that's in the root or the theme or any of that stuff. And if you are writing a library, it's important to know how to write your CSS To give people those values so that they can write their own themes without having to worry about the nitty gritty of maybe even, like, positioning stuff. But more or less like, How do I how do I write a component that is extendable and overridable, with the correct essentially tokens for your CSS variables? Big scale. Rid I'm going to,

Wes Bos

hop back on the server side train here. I think that we've seen this for a couple years. I've believed this all my career, But we're really starting to see it with a lot of these frameworks and with a lot of these, serverless, rid providers is that if you are a front end dev, you will need to know rid Server side coding fundamentals as well, because the lines between those 2 things are becoming a lot more blurry.

Topic 9 23:09

Learn server side fundamentals

Wes Bos

And it's A lot of the stuff is not. Oh, that's a server side thing. That's a front end thing.

Wes Bos

Not for necessarily everything, but for a lot of of our apps, rid. They are starting to blur. So I'm gonna say, your coding focus should be focused on server side fundamentals, requests, responses, rid. All the HTTP verbs, headers, caching, CDNs, form data, JSON Body, all of those things. Basically, just like inter getting requests in, doing your work, sending data back. Those are sort of the fundamentals of, rid. Like, you you probably know JavaScript if you're intermediate developer, but understanding the flow of the the life cycle of a request and a response is gonna be important. Yeah. And I'm gonna you gotta think about, like, all sorts of things too, like headers and caching and interesting things there too. I mean, understanding any of that stuff is gonna make you,

Scott Tolinski

rid. I mean, there's a there's a lot more there than I think most people think. Because oftentimes, you just hit an API and get data, but I think there's a lot more. Caching a JavaScript page or library

Wes Bos

is a front end thing, but it has to happen on the server with headers. So Mhmm. So there's that. Right? And so you kinda have to gotta dip into both ends. Yeah. Understanding headers and cookies and all that stuff, anything in your request, big deal.

Scott Tolinski

Okay. Soft skills focus.

Topic 10 24:30

Improve meeting and client skills

Scott Tolinski

My intermediate soft skills focus is going to be on meeting skills, and it's so funny. As I was writing this, My notes for things about meetings ended up, like, starting to take up the entire notes page here before I was like, you know what? This could be a whole episode. So we'll we'll devote a whole episode into meetings.

Scott Tolinski

But frequently, I was known as one of the developers who could go into client meetings and go talk to clients and go do trainings and things like that Because I understood not to be a jerk to the customer or the client, and I understood how to talk to people in a way, rid. That makes it a little bit more like bridging the technical gap, so I have some really quick notes here, and then we'll do a whole episode. I think people need to work on their meeting skills. I've been in enough meetings with developers to know that there are developers that Some managers would straight up cringe if that developer was invited to a meeting because we just knew that developer was going to say something Demeaning to the client in some sort of way or just be generally rude or unkempt or or anything like that. So, small tips.

Scott Tolinski

Rid Learn how to talk to clients, man. They're people. They have goals. They have ideas. They they they wanna see this product work and succeed the same way that you wanna see the code work and succeed. They don't necessarily care about the tech. Some some of them might care about the tech to some degree, and and unless your your client is a developer themselves, they largely Care more about the results. So talk more about the results.

Scott Tolinski

One time, I went into a meeting, I kid you not, with Ford Motor Company executives. These are not developers. They're not creatives. Ford Motor Company executives.

Scott Tolinski

And these people who are a third party agency, not our company, third party agency, Spent 10 minutes talking about their test runner. Their tests.

Scott Tolinski

The everyone's. No one cared. Everyone's eyes were glazed over. It was So embarrassing to be in that meeting knowing that I was like a representing a developer even though I wasn't any part of that. It was like, what's the point of this? Rid. Don't don't do that. They don't care.

Scott Tolinski

Don't don't talk down to nontechnical people.

Scott Tolinski

You know, developers can get this like, I And the master of the computer, I can can control this computer, and you cannot. Therefore, you must listen to me. And then they can talk down to customers. I've seen so Many developers talk it down to the client. That is not a way to do you gotta talk to them as if you're on the same team, you have the same goal. Right? Everybody's trying to build something that works. Rid If you talk down to to talk down to people or or have an air of arrogance in any of this, not only does it make you Look like a jerk, but it makes your company look bad. It makes everyone that works on the project look bad. Don't do it.

Scott Tolinski

You know, most of the time, people are interested in being educated. When I say, like, don't spend 10 minutes on the test, you could spend a couple seconds and say, hey. We were a robust test to make sure this thing works all the time. That's it. Right? People wanna be educated, but they don't need the nitty gritty.

Scott Tolinski

And another one, present yourself well.

Scott Tolinski

Rid. There's not too many meetings in my experience, especially big time meetings that come come straight out of the blue. Typically, if you're in a meeting, especially with a client, maybe not necessarily a team meeting, but like a client meeting.

Scott Tolinski

You know those things are happening.

Scott Tolinski

I can't tell you how many team or client meetings I've gone to with People in on one side of the table, there's a an executive from some company wearing the fanciest stuff in it and a watch that cost more than somebody else's car, and on the other side of the table is a developer and a a Star Wars T shirt. Okay? Like, don't do that. You you can go to the mall and get a nice T shirt, Some nice pair of pants, some nice shoes, and you can dress up on that day.

Scott Tolinski

And let me tell you, everyone on your team Will notice and they will appreciate that.

Scott Tolinski

Just just groom yourself and look nice for this meeting. These things don't happen out of the Wash up. Yeah. Wash up.

Wes Bos

Rid. It it makes a difference.

Wes Bos

Developers wash up.

Scott Tolinski

Wash up, please. Yeah.

Scott Tolinski

Okay. I have enough rain. I could talk about this all day. I've been in enough Embarrassing meetings to know that this is a problem sometimes.

Wes Bos

I'm gonna say, intermediate soft skill is, how to organize rid. A, repo is kind of similar to what Scott was saying in his, a beginner one.

Wes Bos

But, basically, rid. If there is a large GitHub repo or even a even a medium sized one with lots of pull requests and lots going on and stuff that needs to be, rid. Merge. But there's merge conflicts and lots of questions and just, like, all kinds of stuff like that.

Topic 11 28:48

Learn to organize chaos in repos

Wes Bos

If someone is able to sort of bring calmness to a repo like that, I think that is a huge skill, in in any developer. I specifically rid I had one.

Wes Bos

I saw this myself.

Wes Bos

We have the awesome uses, repo, which It powers the uses .tech website, and that website has gotten extremely popular. And there it was at a point where there was, like, 60 pull requests and Fifty different issues of of things people are asking and lots of merge requests, and I was like, oh my goodness. This is this is a lot of work. So I was, like, just kinda, like, rid. Put a shout out and say, like, is is anyone who wants to help on this thing? And, specifically, we had we had a couple people, but, rid one thing. 1 person, Blake Campbell. I'm not sure if he listens to podcasts or not. He's like, yeah. I'll help out. And just for the past, like, 3 weeks, he's just been, like, Chipping away at it, and organizing things, and closing issues, and merging stuff, and removing duplicates.

Wes Bos

And, like both, like, rid. There's it's not that high of a coding skill to do this type of stuff, but just like the organization he has and the ability to say it, like, okay. This is overwhelming, But I'm able to take this chaos and distill it down and to figure out how to approach it. And I thought that, like, wow. That's that's a skill that not everybody has, rid. And it's something that is totally aside from actual coding skills as well. Yeah. 100% agree.

Scott Tolinski

Alright. Random fun mixed bag. Anything goes skill goal.

Scott Tolinski

Scott says that was sorry. That's what's written in the notes. So, Scott says make Something animated with JavaScript.

Scott Tolinski

Okay? So the other one is make something animated with HTML and CSS. If you're intermediate, get rid Busy with JavaScript animations, whether that is a framework.

Topic 12 30:41

Make something animated with JavaScript

Scott Tolinski

There's a lot of frameworks out there for doing animations in JavaScript, whether you're a React User, you wanna use frame or motion or or, react I don't think anybody's using react motion still, but, there's the other one, rid. React spring with Svelte. Svelte has animations baked in. Learn Svelte animations. If you wanna take that time and you wanna learn Svelte too, also do some animations with it because, there's flip animations and in and out animations and transition animations. Animations are really fun. Yeah. There's so so much opportunity with CSS and JavaScript rid of the animations to do some really cool stuff without even necessarily getting into things like Canvas or any of that because that seems like a whole other beast. But if you're an intermediate developer, There's a lot of really interesting things you can do, whether that is mounting and unmounting animations.

Scott Tolinski

That's not hard to do, but it's a good tool to have in your tool belt. Rid. I'm going to say write a bot.

Topic 13 31:43

Write a bot

Wes Bos

Bots kinda had their day a couple years ago. Everyone thought that they would be The next big thing and and now it's just frustrating when you go to a website, and you think that you think the contact form is gonna actually contact somebody.

Scott Tolinski

Rid. In reality, it's a bot that then funnel eventually funnels you to a contact form. Do not hit chat. I Freaking hate. Can we stop and talk about how much I hate that? It does everything it can to not get you into somebody. It's like it seems like you're having would you like to look at any of these FAQ options? Like, No. The FAQ options aren't gonna give me a refund or whatever. You know? It's like, come on.

Wes Bos

Oh, it's so true. I freaking hate those things. I'm like, I rid. You you make me think like I can talk to somebody right now. And the reality is is it's just, like, 2 barriers away from filling in a contact form, which someone will rid Send me an email back in 48 hours. Anyways, the bots kinda had their day. I still think that coding a bot is a really good exercise to learn how to, rid. Work with stream based data, how to connect to different APIs, whether it's, connect to the Twitter API. And when somebody rid. Mention Syntax FM, then send a Discord message or a Telegram message or or something like that. Basically, just hooking up multiple rid things and making them work together that is event driven is a really it's both very fun because, like, oh, like, it at least to me, it's

Scott Tolinski

rid Super exciting when when these types of things start working.

Wes Bos

And also it's just like I said, it's a great exercise in order to learn how to integrate rid. 3rd party libraries and things all into 1 because they never work exactly all exactly the same, and and you gotta learn to read the docs and look at examples. And I just think that's overall a good exercise for you to do. Totally.

Scott Tolinski

Alright. You know, what's also good to do is to maybe, spend some time, starting up a server.

Wes Bos

Yes. And maybe you might wanna do that on one of our sponsors, Linode West. Do you wanna talk about Linode? Yeah. This this is perfect. K. So go back to my last example, writing a bot. You need your bot to be running rid all the time because your bot is constantly listening to a stream of data from Twitter. Let's say it's a node process. Rid. So you have to host that somewhere because you close your laptop, and that thing is no longer running or your Internet connection goes out. So you need to put that on a server that rid run a long running node process. And you know where you can host that for with $100 in free credit? Linode. Linode is cloud computing.

Wes Bos

You can, grab their Node. Js image, and you can run that bot on there.

Wes Bos

I specifically said rid. Tell you, you should probably check out something called PM 2, which will run your node scripts and restart them should anything crash. And Linode's gonna give you a $100 rid to try that out. So check it out. Linode.comforward/syntax.

Wes Bos

When you sign up there, you're gonna get a $100 in free credit. Have lots of really good documentation on how to get literally anything running, but specifically for my bot that I'm telling you to run.

Wes Bos

You can run that on Node. Js. No problem.

Wes Bos

Thank you, Linode, for sponsoring.

Scott Tolinski

Cool.

Scott Tolinski

Okay. Next rid is advanced our advanced folks or anyone who's looking to become advanced. What are some coding focus things? Now my coding focus thing is to write, rid. Continuous integration, continuous deployment actions and tools.

Scott Tolinski

These things can really take so much busywork out of your code. Like, Whether that is code reviews or that is formatting or that is finding bugs, a lot of these things you can implement and you can write these These continuous integration tools that can really step up your team. Now one of the things I've referenced in the past was a friend of mine rid. Was introduced me to Stylent, and he was saying, oh, if if you introduce a color that's not a CSS variable, we will deny your PR. And And I was just thinking, that is such a nice little thing, and it's gonna save so much time, and it's gonna save a potential bug down the road. So if you can write these tools, I would recommend Doing so in just personal projects of yours and maybe doing some stuff maybe whether that is code quality or maybe a tool that analyzes the bundle size or Maybe one that analyzes the CSS.

Topic 14 35:05

Write CI/CD workflows

Scott Tolinski

And potentially, what would be cooler is if it could do things like integrate rid With your, your whatever your code repository in GitHub, if it's GitHub actions or or the, GitLab or anything those things. Maybe it's sending a message to a Discord or a Slack. Maybe it's working with a bot in that kind of way. Maybe it's just outputting code quality tools and saying, the code coverage has decreased or something. The code coverage has increased. Write these things, experiment with them, explore them, and then maybe present them to your team and say, hey. I did this on my personal project. Every single time, I goof up, it it alerts me that I've goofed up, and here's how How it could save us all this time. Your team's gonna love that stuff. And if somebody did that in any of our code base, I would be very psyched as long as everything worked and did not break. So, dive into dive into CICD.

Scott Tolinski

If you're just on GitHub, GitHub actions are the way to go, and it's it's really nice and easy to just try them out and experiment. They can be frustrating.

Scott Tolinski

It's something running in a black box somewhere, and you gotta pop through some logs. But I I think spend the time. It's worth it. Rid. Yeah. Dee, I was, like, thinking about this. I was trying to get,

Wes Bos

changing around some hosting, and I was trying to, like, get something running on the server. And rid. Trying to debug CICD is so slow because, like, you gotta fix something, deploy it, wait Anywhere from 1 minute to 10 minutes for it to build and It can zap your whole day. Yeah. Yeah. It's it's slow. That's that's

Scott Tolinski

Good point why it's advanced. Right? Here's a pro tip too. Here's a pro tip. Make an alias make an alias that simply git add period git commit hyphen m updates git hub action and then git push.

Scott Tolinski

And and That's it. And then you just mine do you know what my alias for that is? It's fast. If I've done anything and I just I say fast, and it goes, Pushes it up. And let me tell you, when you're debugging, that can save you so much annoyance because you have to end up typing all that stuff all the time. I like that.

Wes Bos

Rid. Mine is going to be advanced TypeScript.

Topic 15 38:00

Learn advanced TypeScript types

Wes Bos

So learn dynamic types. Learn how to type a third party module that doesn't have types. Rid. Maybe you npm installed it and it doesn't have types.

Wes Bos

Learn how to extend existing types. So maybe you have some express types, but the request of express, rid. You've extended by adding some data onto that request or some methods onto that request. And how would you then type that? That's, like, rid. That's a pretty good one to learn how to get into advanced TypeScript stuff where, you make sure everything is nice and dynamic and fluid and and just works for you. Nice. That's concise.

Scott Tolinski

Concise.

Scott Tolinski

Yeah. Wow. Okay.

Scott Tolinski

Soft skills focus here.

Topic 16 38:39

Teach colleagues at work

Scott Tolinski

Teach at your company.

Scott Tolinski

You know, teaching skills are always good, but you don't have it doesn't have to be that formal. It doesn't have to be that intense. I know that can give a lot of people a lot of anxiety. You know? Before I started getting into speaking or anything like that, that would have sounded very scary to me. So it can even be very informal to just say, to one of your your coworkers who's Maybe mention being interested in a particular topic that you know. Could say, hey. Do you wanna take, 20 minutes, and I'll teach you this thing today? And they could say no, and that's fine.

Scott Tolinski

Don't don't be pushy about it. But, you know, maybe just try getting into that a little bit, just teaching people, some interesting things. And if you wanna be more adventurous in your company I know some companies do, like, brown bag lunches where they do, mini workshops and trainings and teachings internally. We used to do that.

Scott Tolinski

Offer to do one of those if you've never done one before. Find something that you're interested in, that your team might be interested in, say, you know what? I just spend all this time working or learning about this thing.

Wes Bos

Let me just let me do a little mini workshop on it for you. Mine's gonna be somewhat similar as speak at a conference. Not necessarily that you can't speak at a conference if you are intermediate or beginner, rid. But, I think, like, that's a really good the conferences are hopefully starting to come back this year, and, there's a lot of new stuff in our industry right now. There's a lot of stuff people haven't spoke on for because conferences have been around. This is a really good opportunity, rid. To go to a conference and speak about literally anything that you are somewhat knowledgeable on. Right? You can also spend some time, rid. Researching at CICD, GitHub Actions, TypeScript, advanced dynamic types, literally anything you want. I think that'd be a really good soft skill, to gain is being able to not only be good at coding, but to be able to speak and teach others about it as well. Totally. Nice. Yeah. I agree.

Topic 17 40:00

Speak at a conference

Scott Tolinski

It's and it can be scary. So maybe if a comfort zone seems too intense, try a workshop.

Scott Tolinski

I earn out a workshop a Little Meetup? A Meetup. My first speaking was at a Meetup, and I was still scared for it, very nervous for it, But it was, it was perfectly fine. Everybody's very supportive, and it went very well. They can also be a little bit shorter, less pressure, less people.

Scott Tolinski

Okay.

Scott Tolinski

Random fun mixed bag anything goes full.

Scott Tolinski

This one says full.

Scott Tolinski

That's fun.

Scott Tolinski

So Scott Says make something 3 d. Okay? So beginner, intermediate, advanced, make something animated with CSS, make something with JavaScript. Number 3, advanced make something three d. There's a lot of really interesting three d options out there nowadays.

Topic 18 41:09

Make something in 3D

Scott Tolinski

Rid. If you're in React, I I cannot stress strongly enough that, React 3 fiber is incredible. It's a very good library.

Scott Tolinski

There's a lot of cool stuff there. Framer Motion, I think, just released some kind of 3 d library that I haven't tried out just yet.

Scott Tolinski

It's called Framer Motion 3 d. I haven't used it, but knowing Framer Motion, the The the API interface for this thing is probably amazing. And just kind of glancing at these little docs, it is amazing. So, Framer Motion 3 d, if you're looking for a more simple a more simple API.

Scott Tolinski

React 3 Fiber, if you're looking for a lot of control.

Scott Tolinski

And then Svelte cubed is a new Svelte three d library. 3 d is going to be everywhere. Just wait until augmented reality, Virtual reality web platforms start becoming more places. You're gonna have to learn 3 d on the web. Now is a good time to start.

Wes Bos

Rid. Let's talk about one of our sponsors, which is FreshBooks.

Wes Bos

FreshBooks is the cloud accounting service for your freelancers, rid. Ship your small business, any type of business that you have, if you need to log your expenses, track your time, invoice your clients, FreshBooks is what rid. You need you get paid faster with FreshBooks. Why? Because it's so easy. They can submit late payment reminders. They can, rid. Automatically send it to the client. They can accept payments online, all of that good stuff. It's awesome. I've been using it myself for something like 12 years, rid Which is ridiculous. Go to freshbooks.comforward/syntax for a 30 day free trial. Thank you FreshBooks for sponsoring.

Wes Bos

Rid. My, random fun mixed bag, anything goes skill or goal is, scrape and write something to collect data, rid massage it and then display it. So specifically, I have one for my banking platform with all of our retirement accounts and everything in it. And, I like to see specifically how they go from day to day. So I wrote something that would log in, scrape the data, pull it down and pull in a very detailed report of literally what every individual thing is is worth and then loop over that data, rid. Massage it and then display it, whether that's in a graph, whether that's in the terminal, things like that.

Wes Bos

I think that those are specifically, I love rid Writing scraping tasks, and I think that that would be a really fun one to do this year for anyone who's looking for something to do. The, the amount of times West said massaged it in this episode is now up rid. 3.

Scott Tolinski

You should take the scope. We should take it to physical therapy. We should do some stretching on this code. We should work it out, those kinks out. Yeah. That's it's Such a good word way to describe, like, how else would you describe taking some data,

Wes Bos

changing it to make it look like how you want it? Oh, yeah. No. No. It's not. It's great. Yeah. Massage it. I I I totally agree. And and, likewise, I use the word marinade all the time for things. Oh, yeah. Rim. Yeah. Just marinate on it. Yeah. It's good. It's good.

Wes Bos

So I believe that is it.

Wes Bos

Hopefully, you you have found a few things to It's always good to double down and say, oh, this year, I want to do x, y, and z. And figuring out what that is is sometimes a little bit tricky because there is literally so much to focus on. So maybe these give you some ideas of what you can focus on in 2022.

Scott Tolinski

And notice, in particular, we didn't say learn this library or learn this framework because Yes.

Scott Tolinski

That's not the things that are going to make you A a dev a better developer in the long term. Right? I mean, sure, it's gonna help you build things. But the most important things are the fundamentals, the foundations, and the concepts, and the ideas. Rid The fun along the way. And what if the real code was the fun you had along the way? I don't know. Okay. Let's, abandoning that one, let's go ahead and say, now is the time for sick picks. This is the part of the show where we talk about things that we find to be pretty sick.

Scott Tolinski

Sick isn't good, not sick as in sick.

Scott Tolinski

So let's start with I have a, Netflix show, Wes. The 3rd little documentary. You know, I'm me about Oh, stop, Netflix. What are you doing? So Netflix's website does autoplay audio now, which is one of those things that we used to say wasn't that bad, but now I'm gonna say I hate it because I'm trying to talk and it's popping up in my headphones.

Scott Tolinski

This is actually really interesting here. I have I'm trying to think.

Scott Tolinski

I don't wanna I have a lot of I have several different sick pics here, so I'm gonna save at least a couple of these. But So here is a documentary about mountain climbing. There's actually been a ton of really interesting ready. On Netflix recently, especially if you're into those about mountain climbing type of things. But I really enjoyed this one. It's called 14 peaks.

Scott Tolinski

Nothing is impossible, and it's about a, a Tibetan Mountain climber who basically is trying to conquer the 14 tallest peaks in the world. These are difficult peaks. They're not like sure one of them is Everest. Right? But one of them is k two, and k two is a different beast than Everest.

Scott Tolinski

And I found this thing to be extremely inspiring.

Scott Tolinski

He's an inspiring dude, and he just goes for it, and he just crushes it in a way that he's He's trying to do all of these peaks in it's like 6 months or something. And, like, the previous record was, like, over the course of 4 years or something outrageous. I I don't know exactly what it was, but the the previous effort was to summit oh, yeah. It's to summit all 14 of the eight rid 1,000 meter peaks in 7 months, and the previous record was something like 7 years. So this this guy is just like, yeah. I'm just gonna go do this all. And the the the windows are so tight, And it's incredible.

Scott Tolinski

I've seen so many mountain climbing documentaries because I had a phase of that that my life. And this is one of the very, very best. It's brand new, rid and and he's Nepalese, and it's it's, yeah, it's it's just incredible. So that's the best I can say. Just go and watch it. Called 14 peaks. Nothing is impossible.

Wes Bos

Super inspiring. I'm going to sick pick, booty slippers.

Wes Bos

They're not for your booty. They are little booties.

Wes Bos

Rid. I recently was on this, like, I don't know, 6 month quest to find the best slippers ever because rid I've been unhappy with so many different types of slippers that I've I've purchased in the past. So I tried these new type of slippers where they are they look like little sleeping bags for your feet, but then they have, like, a really good Hard sole on them. And I know a lot of people don't like hard soles on their slippers, but I love like, it's almost like a shoe rid Inside the house. So I found this pair called the Tilly, slipper.

Wes Bos

And, like, Tilly, you know, like, they make the safari hats. Rid.

Wes Bos

And, I found them at Costco. They were $25.

Wes Bos

Apparently, it looks like they were, like, a Costco exclusive, in Canada. They seem like, you know, Costco does this. They just slap their name on something.

Wes Bos

But they are pretty much a knockoff of The North Face Mule Slippers.

Wes Bos

And I think that if I go through these this pair, I'm gonna pick up a North Face pair because North Face stuff is is really high quality as well. But They're these are so nice and soft and warm. They have good arch support. Nice, nice traction on the, on the sole as well. So I'm very, very happy. I've been wearing them for about a week and a half now. They are I'm just gonna generically sick pick booty slippers. I'll link up The ones that I bought as well as the North Face pair, which they sell at North Face pair in camo, which is I think I want that next. Courtney got me the Nike offline twos for

Scott Tolinski

Christmas, and they're like the offline ones were exactly what you're talking They had, like, a sole and and then, like, the booty slippers, but the offline twos are are kind of the same thing, but, like, sandals.

Scott Tolinski

So they're, like, open toed sandals. So I've been wearing those in in, like, they are, like, real thick sole. The cushion on them the bottom is, like, Super thick, super comfy, and, like, very cush.

Scott Tolinski

And, yeah, I I've been loving them. They're so cool. Love me some booty slippers. Okay. Next is the shameless plugs is Somebody please

Wes Bos

please cut that and make it a sound effect. Love me some booty.

Wes Bos

You just said it clearly then. Well, alright. Somebody put that on there. It's already there. Yeah. Alright. It's there. It's, what about shameless plugs? Shameless plugs is I'm gonna shamelessly plug level up tutorials

Scott Tolinski

.com, and you can go to level up tutorials .comforward/pro.

Scott Tolinski

Sign up to become a pro subscriber and get access to All of the tutorial series that we have on the site, we just had a an amazing series from Amy cap Amy Kaepernick on accessibility, rid. And I just did a course on a remix, and we're gonna be having new courses every single month just like last year. So you're gonna get access to 12 courses, New courses over the course of this year if you sign up for the year in addition to the oh, man. We just, like, counted, and there's, like, 60 some courses on the site. So Just and that that's just premium courses. There's, 3000, 4000 videos on the site. It's a lot of stuff. So check it out, leveluptutorials.comforward/pro.

Wes Bos

I will shamelessly plug courses or westboss.comforward/courses, list of all of my JavaScript and CSS courses. You name it. You can learn it. Check it out. Use coupon code SYNTAX for $10 off.

Wes Bos

Alright. That is it. Thank you, everybody, for tuning in, and we will catch you on Monday.

Scott Tolinski

Peace.

Scott Tolinski

Peace.

Scott Tolinski

Rid Head on over to syntax.fm for a full archive of all of our shows.

Scott Tolinski

And don't forget to subscribe in your podcast player Or drop a review if you like this show.

Scott Tolinski

Rid.

Share

Play / pause the audio
Minimize / expand the player
Mute / unmute the audio
Seek backward 30 seconds
Seek forward 30 seconds
Increase playback rate
Decrease playback rate
Show / hide this window