Chats with Kent C. Dodds

There is a diverse range of philosophies when it comes to CSS. Settling on something that fits the needs of your team and application can be a real challenge. Mark Dalgleish, the co-creator of CSS Modules, has been working on an option that might make that choice less of a challenge!Vanilla Extract is kind of like "CSS-modules in TypeScript", allowing you to write CSS in your TypeScript, with locally scoped variables, and generate static CSS files on runtime. If you're interested in getting a deeper look, as well hear more about design systems, CSS in JS, and CSS Modules, check out this episode!HomeworkFollow along with this blog post - Use CSS Variables instead of React ContextCheck out Vanilla ExtractResourcesVanilla ExtractPlayroomBraidA Unified Styling LanguageGuest: Mark DalgleishTwitter: @markdalgleishGitHub: @markdalgleishHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Scott Moss is a retired Navy Veteran who made the career change into software engineering after becoming a father. His journey wasn't an easy one, and as a dad, he had to learn many lessons in work-life balance. For us developers who have kids, his struggle is one that almost all of us can relate to. This industry has an extremely high ceiling, and there is a culture of grinding every day after work in order to make it big. It's easy to fall into the trap of thinking "this is what is best for my family", you have to ask yourself is it worth the sacrifice of losing that time with your kids, and are you doing it for them or are you doing it for yourself? Though it doesn't have to be all or nothing in either direction. There are strategies you can put into place that will allow you to reach your goals in both your work and family life. But it's going to require self-awareness, emotional availability, and good time management. So check out this episode If you want to hear more about Scott's story and get advice on making family life work while still succeeding in your career!HomeworkSit down and record every single minute of your day for the next week. At the end of the week review and see the time that you wasted on things that add no value to the goals.Guest: Scott MossTwitter: @scotupsGitHub: @HendrixerHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Whether you know it or not, we all have a "personal brand". It's the summary of the part of yourself that you present to the public. And while there are negative connotations to the term, it doesn't have to be that way. Building a personal brand for yourself is a very useful tool for cultivating a community of like-minded people. But it's not a quick process, and it's not something that you can hack if you want the real thing. In this episode, Josh Comeau chats about how he grew a community and reputation around CSS, and how the lessons he learned can apply to you.HomeworkTake an hour to draft a blog post in markdown without worrying about how you are going to build your website.ResourcesHow I am so productive001 jsAir - Learning and Developing JavaScript with Ashley G. Williams and Kyle SimpsonGuest: Josh ComeauTwitter: @JoshWComeauGitHub: @joshwcomeauWebsite: joshwcomeau.comHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Constantly learning is something that we all have to do as developers. If you're a JavaScript developer then chances are CSS is something that hasn't been easy to learn for you. It doesn't have the error messages JS does and when things go wrong you can have no idea what's even happening.Well in this episode Josh Comeau gives us some effective strategies to not only learn CSS, but to learn any library, language, framework, etc that you might want to know!HomeworkAfter solving a problem you were stuck on, take about 10 minutes to dive in deeper to understand why it worked the way it did and why your solution fixed itResourcesCSS for JavaScript DevelopersJosh's BlogHow To Learn Stuff QuicklyWhat the heck, z-index??Guest: Josh ComeauTwitter: @JoshWComeauGitHub: @joshwcomeauWebsite: joshwcomeau.comHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Side projects are important in our line of work. They sharpen our skills and sometimes they can even take off and lead our career in a new direction. But seeing people create these amazing projects over a weekend can be demotivating as a junior developer. "How can they do that when I'm five days deep into a todo app? What do they have that I'm missing?"The answer might be a disappointment to some, but often it is because they have 10+ years more experience than you do. But don't let this demotivate you! You don't lack intelligence, you just have more experience. If you want more advice on side projects and dealing with the influence of others, then listen to this episode where Stephan Meijer chats about how he switched from an architecture career into tech, side projects, and how to be true to yourself and your goals. HomeworkTake 10 minutes to think about how the advice that you've given to somebody recently may have influenced the direction that they're going in their life.Take 10 minutes to think about how the advice that other people have given you has influenced your own direction and consider whether you're happy with that directionResourcesMy Career and Lessons Learned in a NutshellGuest: Stephan MeijerTwitter: @meijer_sGitHub: @smeijerWebsite: meijer.wsHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

We have to remember that we are all human beings with social and emotional needs. Our career suffers when we fall into a pit of negativity or when we put up mental barriers that prevent us from interacting with people we might've wanted to talk to. In this episode, Tracy Lee chats about the importance of remembering that everyone, even the awesome people speaking at the conference are all human. When we idolize people it's easy to fall into the trap of thinking they're "better" than we are. We might miss out on opportunities to speak with them out of self-consciousness. Tracy also addresses how general negativity can impact our careers. She cautions against doom scrolling on Twitter and gives us some great strategies on how to surround ourselves with positivity, without burying our heads in the sand to the problems in our world. HomeworkThing of a specific positive thing and share it with somebody!ResourcesThis Dot Labs is hiringThis Dot Labs meetupsThe Power Of BadGuest: Tracy LeeTwitter: @ladyleetGitHub: @ladyleetWebsite: thisdot.coHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Building our apps to be accessible is absolutely necessary, but building a great a11y friendly experience is extremely challenging when we ourselves aren't in a situation that requires the use of a screenreader is keyboard-only navigation.We can't fully rely on tools to audit the a11y score of our apps. With the challenge being distinctly human, computers aren't able to get a complete picture.That's why it's necessary for you to use these alternative methods for web navigation yourself. Try navigating your app's pages blindfolded while using a screen reader, or trying to just use the keyboard. If you find your website is unusable, consider it a bug. Accessibility is not an enhancement.So if you're curious about what you can do to make your apps more accessible, check out this episode where Sandrina chats about methods that you can start using today.HomeworkImplement one of the following options in your app:Disable all of the CSS and see if your app still makes sense visuallyUse your app in direct sunlight. Spot any contrast issuesNavigate your app with only a keyboardBlindfold yourself and try using your app with a screen-readerResourcesWeb Content Accessibility Guidlines (WCAG)a11ysupport.ioContrast CheckerGuest: Sandrina PereiraTwitter: @a_sandrina_pGitHub: @sandrina-pWebsite: sandrina-p.netHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Everything that developers do is DX (Developer Experience). But, it can be hard to know when it is appropriate to spend the time to improve the DX at your workplace. You also might be curious about what you can do to enhance the DX. Repetitive tasks are an easy one to look out for. If you find yourself doing something again and again it's probably worth automating. This could come in the form of tests, scripts, generators, and snippets! For example, if you find yourself having to test some state that takes multiple steps to reach on your website, try using Cypress to automate reaching that state!If improving your DX sounds interesting to you, check out this episode where Ian Sutherland chats about a variety of practical things you could be doing to enhance it.HomeworkAutomate a tedious task that you have to do oftenResourcesXKCD Automation ChartGuest: Ian SutherlandTwitter: @iansuGitHub: @iansuWebsite: iansutherland.caHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

"I should really get more involved in open-source" is something that's always on the back of our minds. You are fully aware of how rewarding it could be but that perfect opportunity to contribute never comes up. Ian Sutherland, a maintainer of Create React App and contributor to NodeJS, used to be in that position. He had always struggled with getting into open source, he wanted to do something substantial but nothing ever came up. One day, he noticed a tiny bug in create react app. Ian quickly fixed it and put in a PR. Once he was past the first PR barrier, making additional ones was so much easier. Fear is a big barrier to entry. People are maybe afraid they're going to do something silly, make a silly mistake and look foolish, but you really have to get over that as well. To get over it try to start small. When you start small, what was once a mountain to climb is now a hill. The stakes are much lower and success is still extremely rewarding!Sometimes, getting involved can happen organically through opportunities from people you meet. Ian got involved with Node randomly at the Vancouver Node Interactive Conference during a collaborator summit. And an open-source raid group was formed in Kent's discord where they collaborate on helping out with various open-source projects. So remember that you don't have to do it alone, and look out for opportunities with others.HomeworkNext time you are hesitant to try something new, try starting smaller!ResourcesHow to get experience as a software engineerNodeJS Tooling GroupKCD DiscordGuest: Ian SutherlandTwitter: @iansuGitHub: @iansuWebsite: iansutherland.caHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev

Vlad Magdalin is the founder of Webflow, a powerful visual development tool that enables people to create professional websites without writing code. Webflow is on a much lower level of abstraction than something like Squarespace, and users still need to understand the core fundamentals of web development. You might think that tools like these are going to take jobs away from developers, but it actually does the opposite! When innovative technologies allow more people to do work that was once restricted to experts, it benefits everybody. That's what the no-code movement is about. Removing barriers, and giving development power to non-experts. As developers, we'll be able to collaborate better with designers and other team members. And with the increased output of surface-level webpages, there will be more demand for developers with a deeper skillset.HomeworkTeach a non-coder one coding related topic without using codeResourceswebflowGuest: Vlad MagdalinTwitter: @callmevladGitHub: @callmevladHost: Kent C. DoddsWebsite: kentcdodds.comTwitter: @kentcdoddsGitHub: @kentcdoddsYouTube: Kent C. DoddsEpic React: epicreact.dev