OwlTail

Cover image of Chris Coyier

Chris Coyier

50 Podcast Episodes

Latest 18 Sep 2021 | Updated Daily

Weekly hand curated podcast episodes for learning

Episode artwork

Episode 68: Vue ESM Support on CodePen with Chris Coyier and Stephen Shaw

Enjoy the Vue

We all love CodePen for its immediacy and were overjoyed when we heard the team had implemented a brand-new editor for Vue single-file components! Today Chris Coyier and Stephen Shaw from CodePen join us to talk about what it was like building this amazing feature into the platform. Our conversation begins with Chris giving a brief introduction to CodePen before getting into why he decided to start building it, and how it seemed like the logical next step to his CSS-Tricks blog. We talk about the many use cases of this hybrid between a code editor and a social network and each of us weighs in on how we like to use it in our development process. Of course, CodePen will become even more valuable to us now that it has a Vue editor and we take a deep dive with Chris and Steven into what it involved getting this feature off the ground. In our exploration, we come to see that the ease with which CodePen can demo projects on the fly requires a lot of work on the back end! Vue files can't be processed in the same ways as regular Pens and Stephen speaks to the challenge of getting the interface to support them so that the experience for the developer could be as close to plug and play as possible. So be sure to listen in today and try out the new Vue features on CodePen when you are done! Key Points From This Episode: Introducing Chris and Stephen and the work they do to maintain CodePen. How CodePen works and the many uses it can be put to by developers. The history behind why Chris started CodePen and how it has evolved over the years. Why the CodePen team implemented an editor for Vue single-file components. The hurdles of equipping CodePen to handle not just Vue but other editors too. Challenges of outputting Vue files versus regular Pens and how they were solved. How the method of safeguarding against circular dependency has evolved at CodePen. Thoughts about the potential benefits of putting the script tag at the top of Vue Pens. Perspectives on the different style guides for Vue versus React. Where to find Chris and Steven online and learn more about what they do. Tweetables: “I roped in some friends, and we built the first version of CodePen and the whole point was embedding. It wasn't the website itself, it was putting demos elsewhere.” — @chriscoyier [0:11:06] “When I came in, I was more experienced with Vue, but coming into a React world, and I saw so much of the value of Vue and the way that single file components work, and that's very much a CodePen-y thing.” — @shshaw [0:14:11] “A lot of this is like, how do we rearchitect CodePen in such a way that you can do things like that and not have it be such an embarrassing amount of technical debt that you'll freaking never do anything again.” — @chriscoyier [0:17:52] How to Find Chris: chriscoyier.net How to Find Stephen: Twitter GitHub keyframers Links Mentioned in Today’s Episode: CodePen CSS-Tricks JSFiddle JS Bin Calls , Apple TV+ Waffles + Mochi, Netflix The Last Man on Earth, Fox (2015 TV Show, Hulu) Ted Lasso, AppleTV+ Derek, Netflix Samsung Galaxy Buds Live Among Us (iOS, Android, Nintendo Switch, PC) Let’s Watch Star Trek Next Generation  episode guide

54mins

6 Jul 2021

Episode artwork

Rocket Surgery: Kaelan and Chris Coyier compare notes

PodRocket - A web development podcast from LogRocket

Are you up to speed on all of this new CSS stuff? Chris Coyier and Kaelan compare notes on CSS and frontend development (they also discuss MDN plus). Links https://chriscoyier.net https://twitter.com/chriscoyier https://developer.mozilla.org/en-US/docs/Web/Houdini https://developer.mozilla.org/en-US/docs/Masonry_Layout https://styled-system.com https://blog.stackblitz.com/posts/introducing-webcontainers https://stackblitz.com https://news.ycombinator.com/item?id=27302702 https://shoptalkshow.com https://codepen.io/features/pro Contact us https://podrocket.logrocket.com/contact-us @PodRocketpod What does LogRocket do? LogRocket combines frontend monitoring, product analytics, and session replay to help software teams deliver the ideal product experience. Try LogRocket for free today.Special Guests: Chris Coyier and Kaelan Cooter .

41mins

8 Jun 2021

Similar People

Episode artwork

#151 Chris Coyier from ceramics to CSS-Tricks and CodePen

Software Developer's Journey

Chris took us from playing on his first C64 to his bachelor of arts in ceramics and back to web development. We talked about the different positions he held along the way and how they slowly but surely led him toward web development. We brushed over the creation and recreation of CSS-Tricks, learning in the open and what a good day looks like!Here are the links from the show:Chris on Twitter https://www.twitter.com/chriscoyierhttps://css-tricks.comhttps://codepen.iohttps://shoptalkshow.comhttps://abookapart.com/products/practical-svghttps://digwp.com/bookCreditsCover Campfire Rounds by Blue Dot Sessions is licensed CC BY-NC-ND 4.0.Your host is Timothée (Tim) Bourguignon, more about him at timbourguignon.fr.Gift the podcast a rating on one of the major platforms https://devjourney.info/subscribeSupport the podcast, support us on Patreon: https://bit.ly/devjpatreonSupport the show (https://www.patreon.com/timbourguignon)

52mins

18 May 2021

Episode artwork

Episode 122: Modern Web with Chris Coyier

Web Rush

Recording date: 2021-02-11John Papa @John_PapaWard Bell @WardBellDan Wahlin @DanWahlinCraig Shoemaker @craigshoemakerChris Coyier @ChrisCoyierBrought to you byag-Grid IdeaBladeResources:Chris CoyierCSS TricksCodePenShopTalk PodcastWeb AssemblyBlazor"Going Ga Ga" on wikipediaBlazorAzure FunctionsReactCSS Layout with FlexboxCSS Layout on GridAzure Static Web AppsNetlifyWhat is JamstackGithub Pull RequestsReview and publish Pull Requests to a Preview URL for Static AppsBest Practices for Great DXSnowPack and WASMSnowPackPreactWMR with Jason MillerVite and VueEnabling Popups in HTMLJeremy KeithWhat happened to the lost colony of RoanokeTimejumps01:31 Guest introduction03:46 What should we be paying attention to?07:40 When should you use web assembly?11:54 Sponsor: Ag Grid12:50 Technology moves too fast16:13 What tech have you used that was worth it to get into?19:35 Flexbox or CSS Grid?23:48 Cloud functions and serverless32:24 Sponsor: IdeaBlade33:20 What do you think about bundling?40:37 Is there anything better than HTML coming?44:51 Any new developer tools to be aware of?50:01 Final thoughtsPodcast editing on this episode done by Chris Enns of Lemon Productions.

53mins

25 Feb 2021

Most Popular

Episode artwork

Chris Coyier on CodePen, CSS Tricks, and ShopTalk Podcast

Learn to Code in One Month

Chris Coyier (@chriscoyier) is co-host of the ShopTalk podcast, built CSS-Tricks.com, one of my favorite resources for staying up-to-date with HTML, CSS and all things front-end. He also co-founded CodePen, a popular coding playground for HTML, CSS, and JavaScript.  In my interview with Chris Coyier we discuss: How Chris Coyier learned to code!  What's a front-end developer? What resources do you use to stay up to date on web dev? Lessons learned from over 300+ episodes of the ShopTalkShow Podcast How many blog posts has Chris written for CSS-Tricks? (You won't' believe the answer)  Listen to Chris Coyier on his coding podcast: ShoptalkShow: https://shoptalkshow.com/ Learn to Code HTML, CSS, JavaScript, Python, Ruby and more at www.onemonth.com. That's also where you can find all of the podcast transcripts, and links mentioned in the show.

58mins

16 Feb 2021

Episode artwork

Chris Coyier of the Shoptalk Show

Audience

Today on Audience, Craig talks with Chris Coyier of the Shoptalk Show, which has produced over four hundred episodes. Craig talks to Chris about what it’s like being an online creator (podcaster, blogger, software and web designer, etc.). Chris talks about the lessons he has learned and what it’s like to have a weekly podcast for ten years. They also talk about podcasting trends in terms of marketing, topics, and the future outlook of the industry. If you have any questions about this episode or want to get some of the resources we mentioned, head over to Castos.com/podcast. And as always, if you’re enjoying the show please share it with someone who you think would enjoy it as well. If you have a quick moment in this busy holiday season, please leave us a review on iTunes. It is your continued support that will help us continue to help others. Thank you so much!  Today you’ll learn about: The Shoptalk Show, Chris’ podcast about web design How it was born from Tech-TV and CarTalk on NPR (RIP) The importance of consistency and dedication with a podcast How Chris organizes his web content on different platforms The cavalier relationship podcasters have with stats Optimizing versus creating good content Burnout Energy levels for online content Avoiding the online hive of anger The staying power of the industry Audio versus video versus both Advertising and marketing trends Affiliate links or no affiliate links? Website conversion What The Shoptalk Show (and podcasting in general) looks like in 2021 The Codepen Podcast Podcasts are an evolution Resources/Links: The Shoptalk Show: https://shoptalkshow.com/ Chris Coyier website: https://chriscoyier.net/ CSS-Tricks: https://css-tricks.com/ Codepen.io: https://codepen.io/ The Codepen Podcast: https://blog.codepen.io/radio/ Podcasthackers.com: https://podcasthackers.com/ Castos, website: Castos.com/ Castos, YouTube: https://www.youtube.com/castos  

40mins

7 Jan 2021

Episode artwork

What is Serverless? with Chris Coyier

Smashing Podcast

We're talking about Serverless architectures. What does that mean, and how does it differ from how we might build sites currently? Drew McLellan talks to Chris Coyier to find out.

56mins

11 Aug 2020

Episode artwork

75: Why do you need a website of your own? (with Chris Coyier)

A Question of Code

It's fan-boy o'clock again this week, as one of Tom's web-heroes joins us for a chat. CSS Trickster and ShopTalkin' podcaster Chris Coyier stopped by for a chat about working as a developer. Chris is full of all sorts of useful advice for aspiring developers. For example, you need some experience before you can know what you want from a job. Learn how to be picky after your first job, but get into the industry as quickly as you can. That way you'll learn so much more that you would if you were working by yourself. Get whatever experience you can, as early as you can.We cover a lot of ground in this show. Why does having a personal site gives you a massive advantage? (Having your own website puts you ahead of a surprising number of people; it should be table-stakes, but it's not!) And what does job hunting (and running a job board) look like in the time of CoViD? What will working remotely mean for junior devs in the near future? Find out all this and more in this week's CodePen-tastic instalment of A Question of Code.Mentioned in this episode: Chris on Twitter @chriscoyier ShopTalk podcast CSS Tricks CodePen Chris' excellent personal site

51mins

10 Aug 2020

Episode artwork

Chris Coyier 'Easy to design, hard to use'

World Wide Waste with Gerry McGovern

This episode was brought to you by ThisisDoing.com Chris Coyier talks to Gerry McGovern about how many of the tools and resources out there make it easy for developers and designers to create bloated, heavy, energy-sapping digital designs. Chris says we need new thinking and new tools that clearly indicate when we are making design decisions that are bad for the user and bad for the planet. https://twitter.com/chriscoyier https://gerrymcgovern.com/books/world-wide-waste/ This is HCD Podcast Network EthnoPod with Jay Hasbrouck Bringing Design Closer with Gerry Scullion ProdPod with Adrienne Tan Getting Started in Design with Gerry Scullion Moments of Change with Melanie Rayment World Wide Waste with Gerry McGovern Global Jams Podcast with Adam Lawrence and Markus Edgar Hormess Connect with This is HCD Follow This is HCD us on Twitter Follow This is HCD on Instagram Sign up for our newsletter (we have lots of design giveaways!) Join the practitioner community on This is HCD Slack Channel Read articles on our This is HCD Network on Medium See omnystudio.com/listener for privacy information.

47mins

6 Aug 2020

Episode artwork

Chris Coyier 'Easy to design, hard to use'

This is HCD - Human Centered Design Podcast

This episode was brought to you by ThisisDoing.com Chris Coyier talks to Gerry McGovern about how many of the tools and resources out there make it easy for developers and designers to create bloated, heavy, energy-sapping digital designs. Chris says we need new thinking and new tools that clearly indicate when we are making design decisions that are bad for the user and bad for the planet. https://twitter.com/chriscoyier https://gerrymcgovern.com/books/world-wide-waste/ This is HCD Podcast Network EthnoPod with Jay Hasbrouck Bringing Design Closer with Gerry Scullion ProdPod with Adrienne Tan Getting Started in Design with Gerry Scullion Moments of Change with Melanie Rayment World Wide Waste with Gerry McGovern Global Jams Podcast with Adam Lawrence and Markus Edgar Hormess Connect with This is HCD Follow This is HCD us on Twitter Follow This is HCD on Instagram Sign up for our newsletter (we have lots of design giveaways!) Join the practitioner community on This is HCD Slack Channel Read articles on our This is HCD Network on Medium See omnystudio.com/listener for privacy information.

47mins

6 Aug 2020

Loading