<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Gianni's Blog]]></title><description><![CDATA[Gianni's Blog]]></description><link>https://blog.giannisbab.dev</link><generator>RSS for Node</generator><lastBuildDate>Fri, 15 May 2026 08:08:28 GMT</lastBuildDate><atom:link href="https://blog.giannisbab.dev/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[Why shadcn/ui Is Taking Over the Frontend World]]></title><description><![CDATA[If you’ve spent any time building React apps lately, you’ve probably heard of shadcn/ui. But why is everyone talking about shadcn/ui? Here’s why it’s so popular:
It’s Not a Library- It’s A Toolkit You Own
Unlike traditional UI libraries that hide cod...]]></description><link>https://blog.giannisbab.dev/why-shadcnui-is-taking-over-the-frontend-world</link><guid isPermaLink="true">https://blog.giannisbab.dev/why-shadcnui-is-taking-over-the-frontend-world</guid><category><![CDATA[shadcn ui]]></category><category><![CDATA[React]]></category><category><![CDATA[Tailwind CSS]]></category><category><![CDATA[RadixUI]]></category><category><![CDATA[ui components]]></category><category><![CDATA[Frontend Development]]></category><category><![CDATA[Open Source]]></category><dc:creator><![CDATA[Giannis Bab]]></dc:creator><pubDate>Wed, 06 Aug 2025 07:30:16 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1754435702649/e02dcd04-b7b8-4e9d-862a-207864854273.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>If you’ve spent any time building React apps lately, you’ve probably heard of <strong>shadcn/ui</strong>. But <em>why</em> is everyone talking about shadcn/ui? Here’s why it’s so popular:</p>
<h2 id="heading-its-not-a-library-its-a-toolkit-you-own">It’s Not a Library- It’s A Toolkit You Own</h2>
<p>Unlike traditional UI libraries that hide code inside your <code>node_modules</code>, shadcn/ui gives you the <strong>actual source code</strong> for each component. You copy it into your project, customize it as you see fit, and it’s now <em>your</em> component. There’s no mysterious black box or dependency lock-in, just full control, transparency, and flexibility.</p>
<h2 id="heading-ultimate-customization-and-composability">Ultimate Customization and Composability</h2>
<p>With shadcn/ui, you’re not forced to override or hack around restrictive APIs. You can rip components apart, rearrange them, or style them however you wish. It prioritizes <strong>composition and flexibility</strong> over one-size-fits-all solutions, making it easy to build a design system that is truly your own.</p>
<h2 id="heading-beautiful-accessible-and-modern">Beautiful, Accessible, and Modern</h2>
<p>Shadcn/ui is built on top of <a target="_blank" href="https://tailwindcss.com/">Tailwind CSS</a> and <a target="_blank" href="https://www.radix-ui.com/">Radix UI</a>, so every component is <strong>accessible, beautifully minimal, and ready to use</strong>. The defaults look great, but the system is robust enough for any kind of project, from MVPs to enterprise dashboards. It also integrates smoothly with design tools like Figma for a seamless workflow.</p>
<h2 id="heading-no-more-dependency-headaches">No More Dependency Headaches</h2>
<p>Because you physically own every line of code, you’re free from unexpected breaking changes or forced updates from third-party packages. No paywalls. No waiting for bug fixes. Once you’ve installed a component, it’s locked to your app until <em>you</em> decide to update it.</p>
<h2 id="heading-built-for-the-ai-era">Built for the AI Era</h2>
<p>Shadcn/ui's architecture makes it particularly well-suited for <strong>AI-assisted development</strong>. Tools like <a target="_blank" href="https://v0.dev/">Vercel's V0</a> can generate consistent, working UIs using shadcn components because the code is transparent and standardized. This integration with AI tools is setting a new standard for how UI libraries should work in an AI-first development landscape.</p>
<h2 id="heading-tldr"><strong>TL;DR</strong></h2>
<ul>
<li><p>100% code ownership: fully customizable, no vendor lock-in</p>
</li>
<li><p>Minimal, modern, and accessible: build fast without bloat</p>
</li>
<li><p>Free and open source: no subscriptions or catches</p>
</li>
</ul>
<p>Shadcn/ui isn’t just a library, it’s a workflow for speed, composability, and control.</p>
<p>If you want to explore more about shadcn/ui, the official documentation is a good place to start: <a target="_blank" href="https://ui.shadcn.com/docs">https://ui.shadcn.com/docs</a></p>
]]></content:encoded></item></channel></rss>