Learning CSS in 2023

JS Party: JavaScript, CSS, Web Development

KBall interviews CSS instructor & YouTuber extraordinaire Kevin Powell in a wide ranging discussion about CSS and how to learn it - what to start with, what to ignore, and various topics in between.

Join the discussion

Changelog++ members save 5 minutes on this episode because they made the ads disappear. Join today!

Sponsors:

• Retool – The low-code platform for developers to build internal tools — Some of the best teams out there trust Retool…Brex, Coinbase, Plaid, Doordash, LegalGenius, Amazon, Allbirds, Peloton, and so many more – the developers at these teams trust Retool as the platform to build their internal tools. Try it free at retool.com/changelog
• Square – Develop on the platform that sellers trust. There is a massive opportunity for developers to support Square sellers by building apps for today’s business needs. Learn more at changelog.com/square to dive into the docs, APIs, SDKs and to create your Square Developer account — tell them Changelog sent you.
• Lolo Code – If you’re familiar with building severless apps, think of Lolo Code as your backend with a visual editor that lets you think and build at the same time. All this without having to provision or manage servers. Use the visual editor to build your app, connect nodes, and add any npm libraries you need. You can even write your own integrations. This makes Lolo Code very Zapier-ish, but for devs. Try it free today with no credit card required at lolo.co/jsparty
• Raygun – Never miss another mission-critical issue again — Raygun Alerting is now available for Crash Reporting and Real User Monitoring, to make sure you are quickly notified of the errors, crashes, and front-end performance issues that matter most to you and your business. Set thresholds for your alert based on an increase in error count, a spike in load time, or new issues introduced in the latest deployment. Start your free 14-day trial at Raygun.com

Featuring:

• Kevin Powell – Website, GitHub, X
• Kevin Ball – Website, GitHub, LinkedIn, X

Show Notes:

• Take the State of JS survey!
• Kevin Powell website
• Kevin’s Youtube Channel
• Flexbox Froggy
• Flexbox Zombies
• Grid Garden
• Grid Critters
• Designing Intrinsic Layouts
• CSS Stats
• MJML (for emails)
• Utopia.fyi
• CSS-Tricks
• Smashing Magazine
• Josh Comeau
• ModernCSS
• SmolCSS
• I am not a fan of what React has done to the web, but it’s VERY nice

Something missing or broken? PRs welcome!

Chapter

1. Opener (00:00:00)

2. Sponsor: Retool (00:00:28)

https://retool.com/changelog

3. It's party time, y'all! (00:01:27)

4. The Kevin & Kevin show (00:02:17)

5. Take the "State of JS" survey! (00:03:14)

https://survey.devographics.com/survey/state-of-js/2022

6. Getting to know Kevin (00:03:56)

https://www.kevinpowell.co/

7. Difficulties of CSS as a beginner (00:07:09)

8. Kevin's path to full-time content creator (00:08:25)

9. The best approach to learning CSS (00:10:28)

10. How to teach CSS to complete beginners (00:13:51)

11. Sponsor: Square (00:17:59)

https://changelog.com/square

12. Mental models to understand CSS Grid (00:19:04)

13. Tools for learning Grid and Flexbox (00:22:33)

14. Where to go once you know the basics of CSS (00:23:25)

15. Teaching CSS to people with design backgrounds (00:27:02)

16. Understanding layouts & relationship between elements (00:28:57)

17. Sponsor: Lolo Code (00:33:00)

https://www.lolo.co/jsparty

18. Sponsor: Raygun (00:34:04)

https://raygun.com/?utm_medium=podcast&utm_source=jsparty&utm_campaign=changelog&utm_content=homepage

19. Which CSS properties to learn first (00:35:46)

20. A brief diversion on media queries (00:37:57)

21. CSS properties you can safely ignore (00:41:47)

22. Are CSS frameworks useful for beginners? (00:44:06)

23. Recommended resources for learning CSS (00:46:39)

24. Wrapping up (00:48:27)

25. Outro (take the survey!) (00:51:15)

https://survey.devographics.com/survey/state-of-js/2022