Utility First CSS with Tailwind, is it the right choice for you? - RRU 144




React Round Up show

Summary: <p></p> <p>Let's dive deep into the pros and cons of Utility First CSS and Tailwind CSS in particular as Jack plays defense and Paige and TJ play devils advocates. Let's see who comes out on top and give you some insights into whether or not Tailwind CSS is the right choice for your next project.</p> <p></p> <h2>Panel</h2> <p></p> <ul> <li>Jack Herrington</li> <li>Paige Niedringhaus</li> <li>TJ VanToll</li> </ul> <p></p> <h2>Sponsors</h2> <p></p> <ul> <li><a href="https://sentry.io/for/react/" rel="noreferrer noopener" target="_blank">React Error and Performance Monitoring | Sentry</a></li> <li><a href="http://devchat.tv/influencers" rel="noreferrer noopener" target="_blank">Dev Influencers Accelerator</a></li> </ul> <p></p> <h2>Links</h2> <p></p> <ul> <li><a href="https://tailwindcss.com/" rel="noreferrer noopener" target="_blank">Tailwind CSS</a></li> <li><a href="https://tailwindui.com/" rel="noreferrer noopener" target="_blank">Tailwind UI</a></li> <li><a href="https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss" rel="noreferrer noopener" target="_blank">Tailwind CSS IntelliSense</a></li> <li><a href="https://www.npmjs.com/package/clsx" rel="noreferrer noopener" target="_blank">clsx - npm</a></li> <li><a href="https://www.npmjs.com/package/classnames" rel="noreferrer noopener" target="_blank">classnames - npm </a></li> <li><a href="https://github.com/ben-rogerson/twin.macro" rel="noreferrer noopener" target="_blank">GitHub | ben-rogerson/twin.macro</a></li> <li><a href="https://chakra-ui.com/docs/getting-started" rel="noreferrer noopener" target="_blank">Chakra UI</a></li> <li><a href="https://headlessui.dev/" rel="noreferrer noopener" target="_blank">Headless UI</a></li> </ul> <p></p> <h2>Picks</h2> <p></p> <ul> <li>Jack- <a href="https://www.imdb.com/title/tt8114980/" rel="noreferrer noopener" target="_blank">Willy's Wonderland</a> </li> <li>Paige- <a href="https://www.myq.com/" rel="noreferrer noopener" target="_blank">myQ | Smart Home &amp; Smart Garage</a> </li> <li>TJ- <a href="https://www.netflix.com/search?q=last%20dance&amp;jbv=80203144" rel="noreferrer noopener" target="_blank">The Last Dance</a> </li> </ul> <p></p> <p>Contact Paige:</p> <p></p> <ul> <li>The Home Depot</li> <li><a href="https://www.paigeniedringhaus.com/" rel="noreferrer noopener" target="_blank">Paige Niedringhaus</a></li> <li><a href="https://paigen11.medium.com/" rel="noreferrer noopener" target="_blank">Paige Niedringhaus – Medium</a></li> <li><a href="https://twitter.com/pniedri" rel="noreferrer noopener" target="_blank">Twitter: Paige Niedringhaus ( @pniedri )</a></li> <li><a href="https://github.com/paigen11" rel="noreferrer noopener" target="_blank">GitHub: Paige Niedringhaus ( paigen11 )</a></li> </ul> <p></p> <p>Contact TJ:</p> <p></p> <ul> <li><a href="https://www.tjvantoll.com/" rel="noreferrer noopener" target="_blank">TJ VanToll's Blog</a></li> <li><a href="https://www.progress.com/" rel="noreferrer noopener" target="_blank">Progress Software</a></li> <li><a href="https://www.telerik.com/kendo-react-ui/" rel="noreferrer noopener" target="_blank">KendoReact</a></li> <li><a href="https://twitter.com/tjvantoll" rel="noreferrer noopener" target="_blank">Twitter: TJ VanToll ( @tjvantoll )</a></li> </ul> <p></p> <p>Contact Jack:</p> <p></p> <ul> <li><a href="https://www.youtube.com/c/JackHerrington" rel="noreferrer noopener" target="_blank">Jack Herrington – YouTube</a></li> <li><a href="https://www.jackherrington.com/" rel="noreferrer noopener" target="_blank">Blue Collar Coder</a></li> <li><a href="https://twitter.com/jherr" rel="noreferrer noopener" target="_blank">Twitter: Jack Herrington ( @jherr )</a></li> </ul> <p></p>