Is This The Best New UI Library?

🌎 Find Me Here:
My Blog: blog.webdevsimplified.com
My Courses: courses.webdevsimplified.com
Patreon: / webdevsimplified
Twitter: / devsimplified
Discord: / discord
GitHub: github.com/WebDevSimplified
CodePen: codepen.io/WebDevSimplified
#Shorts

[@alaskandonut]

Not a company

[@ezwtwrziehag1736]

company lol. no idea u have

[@nithishnith8968]

Is mantine ui good for large scalable project?

[@dubforindia]

shadcn is built upon radix in order to start working with shadcn you get whole radix ui library in to your project then you pick the shadcn components, which, again, built upon shadcn BTW, love shadcn library, but part of the video says you install what you use is not that true while looking behind the scene

[@coderbhai1215]

Can we use it in react native??

[@JhitsfanfromPH]

its just bootstrap with modern design xD

[@hamidmohamadi2943]

I prefer MUI

[@Me-vc4sf]

It just missing couples of input like floating label input, otp input

[@Cyberblank]

tons of issues with it, not the least how much of a pain in the ass it is to install.

[@Samlama8848]

Nice, need to try it.

[@The_DollMaster]

Only for React?😢

[@nclsDesign]

Shadcn brought me to using Radix Primitives and they are awesome. But I also saw NextUI and it looks sick aswell. Gonna try that one in my next project.

[@mickmister]

How does the updating work as you mention? Seems like we're duplicating code here instead of reusing some open source code that continue to be maintained externally

[@AndrieMC]

shadcn is not a company, its a individual developer

[@madhavdhobale9576]

We need the full course video on shadcn🎉

[@shivangrathore]

I like making my own components

[@FidelGuajardo]

What’s the url?

[@jodp]

shadcn is not a company lol

[@ImXrer]

Sussy cool

[@thejonte]

Company?

[@asadrahman6123]

I Like Preline UI more but it has less components than shadcn

[@CarsonPowers]

How do you upgrade to new versions? Are you on your own forever after you copy-pasta it into your project?

[@gagansai8880]

now we wait for them to create an AI VSCode extension that provides you with the code of the component based on the description of your component requirement

[@samsupplee-niederman1752]

Lol, do you have an inside guy ar Vercel?

[@dennisadamczyk5067]

Shadcn is not a company, it's a person 😅

[@AndrieMC]

yeah LMAO

[@omarjesusperezortiz75]

a company can be a person as well

[@dontreadmyusername6787]

Its an opensource company/project run by a single person

[@user-iq3qu2wo2s]

When having tailwind lifetime license should it still worth to use it?

[@marsahere2621]

I had an experience with ShadCN, and it was HORRIBLE. Not only it wasn’t lightweight at all, I had to resolve the issues in their code before I could get anything show up in the UI, finding out that they care absolutely 0% about accessibility…

[@b.o.t7888]

I guess the main pain point is that when we make customisation to their components for example change the look and some functionality in the button then it will be very difficult to update it if they introduced some new features inside their button component

[@daveybrown1160]

This is also my first thought. Maybe they have some clever flow for updating.

[@muhammadhafizuddin2965]

Dude, shadcn ui is library that aimed to be minimal, unstyled, so it kind of provide very basic sane default, and already working component like dropdown, carousel etc. I meant what function you want in a button thats supposed to be unstyled? Its no even “pain point to begin with”. You said its hard to update, the reason shadcn is being built like this and not as npm package to allow you to customize. You can just use copy paste, and make your own file directory/structure and put it where you want. Its your code now, each update just treat as your “update” to your own code. When in npm package, this is plainly impossible as you need to modify the source code in node modules 😂😂.whenever he update the library just go and see what changes. Use diff in your terminal. Idk man, think something you are a developer.

[@muhammadhafizuddin2965]

If you think not having access to update your button, kinda funny. You want a fucking button, basic hover state and all that and quite nice default, padding rounded corners etc. It did it work as ui library. The rest is your fucking work, not “ui library”. If this is your pain point, heh looks like maybe chatgpt and devin might be better than some developers heh.

[@judahschwartz7459]

Seems like lazy programming to me. No encapsulation or seperation of concerns. I think code that follows the open closed principal is much easier to maintain, since you don't need to resolve merge conflicts to get an update. This feels like an open gateway to bad practice

[@s1lli]

bro said " a company" it's one guy lol

[@blue_mustang_]

Really cool!

[@Niksorus]

This is the best UI library indeed! For both React and Astro, ofc.

[@Robin-il8nc]

Chakra UI does everything for me

[@el_teodoro]

Am I the only one who just uses pure css to make UI? I mean things like display flex and grid makes it do easy...

[@therelatableladka]

We are the same bro

[@ITentrepreneur]

Great! Never heard of it

[@fcktom]

Just getting back into web development and snippet libraries like this have been a life saver when re-learning and learning new frameworks 👍

[@bahijan5954]

Why you moved your head Soo mish when you talk ❤

[@martindeveloper4856]

Does it support as well svelte?

[@AR-yr5ov]

Love it, going to try it out in my next project

[@RegalWK]

Every modern UI Lib supports tree shaking so no thanks

[@joshuamiller8181]

Does treeshaking remove unused statements and expressions? unused codes inside your function and class modules???

[@ufwwkwmyc7718]

Related to CN?

[@ankursehdev5448]

This is a combination of RadixUI and Tailwing nothing except that!

[@drumncase6966]

Could you do a full video on this please?

[@sitedel]

In the Alert component sample: import * as React from "react" Yeah i see... Another "lightweight" component system that depend on so many dependencies that a single Alert message doesn't appear on slow mobile networks.

[@Joshua-sp1kd]

This is what I do with Bootstrap. I select components I want and download those. Then I’m still looking at the source code and able to tweak it. Keep me honest, are we talking about the same thing?

[@jkf16m96]

Almost the same. The problem with modifying library source code is that now you can't actually update it. In this case, this source code generator could be updated, but you can simply decide which component you want to regenerate.

[@Tencho992]

Is it just me that can’t hear the name?

[@mohammedanas8637]

This seems cool , but the eventually importing the whole library isnt necessarily a bad thing. there is a build step which does some magic for you

[@mateuspimentel2753]

we lose control due to abstraction

[@muhammad4609]

Thank you, man!

[@YMS71]

How can it be a good UI Library without a good Button?!!!

[@Pundonoor]

what's the name of the library?

[@muhammadbilalmalik7292]

That is straight fire Man !!!!

[@chrissigrilus6390]

This is terrible. Once you touch the code you own it. No way you can guarantee an upgrade. I have made terrible experiences long term with these kinds of "libraries"... Its stooopid

[@kakun7238]

wdym by an upgrade you literally have the code its just design no functionality and its using radix so you can upgrade radix but shadcn is you just copying the design of someone else

[@uplink-on-yt]

Tell me when OOP is reinvented...

[@phuongthaotrinh-sg7jj]

for me, antd is the best :>

[@gauravsingh3446]

Chad library🗿

[@pixelotetm]

this UI's only work with Nextjs ?

[@libenhailu5193]

It is very cool very very optimal components, but in some cases building your own component gives you a flexibility

[@FzsHotDogInDonut]

there is another one radix ui

[@ultimatescript]

It's built using radix ui

[@nicco88]

Not if you don't use react

[@kiikoh]

"A company"

[@ghostlexly]

I have given it a try, there are just few components with just few small functionalities… not at the same level as material ui

[@Cowkill]

This is awesome. I worked with MUI once and it was a pain to visually customize in details.

[@turolretar]

What are they going to try next?

[@yurisich]

Make a hotline where a rep verbally dictates source code to you over the phone.

[@atbmts6]

Would this look good or bad on a portfolio as a jr?

[@geelemo]

As a jnr anything is good

[@ducksquidbat8315]

How do they make money??

[@yudi8204]

waiting an answer

[@ghostlexly]

He is not making money with it, it’s free, open source

[@taylorfullstack]

Donations

[@ultimatescript]

I think it's a donations from companies to make things super easy for developers so they can reduce development costs.

[@samwise8731]

How's this different from Tailwind UI's components? I tried shadcn and it's not easy to customize. It comes with colours already and digging in and changing those things takes too much time.

[@wildercarvalho2586]

Probably you need to change the theme palette. The colors of components follow those colors such as primary, secondary etc...

[@mediocresquaregarden]

No, because something better will be released next week?

[@TheStickofWar]

Such a thing exists for Angular?

[@theDanielJLewis]

My new project is built with Shadcn and I'm loving it!

[@hanzofuma]

This is similar to bit. the only difference is that bit is on steroids.

[@victorgarcia3526]

This actually seems awesome!

[@r3mus89]

It only works with tailwind which made me skip it

[@jesustzinon]

Just try it, I was very sceptical about tailwind but it does the work

[@ban-prem-001]

only zoomers did not like tailwind, they stick with old bootstrap

[@pumbaatimon4623]

The libary looks awesome, i will try it. thanks for sharing

[@snickers.mcflurry]

Welcome to 2002

[@nanonkay5669]

If it ain't Mantine, bye Francine ✌️

[@lionheart4109]

I believe RadixUi already does this, while also emphasizing accessibility.

[@zenova9926]

This library is 99% made from radix ui

[@ichiroutakashima4503]

Think of it like this. It's RadixUI but better.

[@vincenttse3167]

This library is essentially guiding you how to style radix ui.

[@berndeveloper]

RadixUi doesn't have tables.

[@szymon7932]

Shadcn is the company? I thought it is some guy from Twitter lmao

[@DanielZ1337TM]

it is. it's not a company, just a dude

[@DanielZ1337TM]

i mean other people are contributing afaik, but company is still wrong

[@areeburrub]

I think shadcn works at vercel but I am not sure. He is building cool projects in public.

[@BhideSvelte]

Svelte is the Next Big Thing

[@yaroslavoz]

🎉 let's create a project with it😉

[@0xtz_]

It's amazing can't wait to use it

[@Radek11boss11boss]

you're late for the hype fuckboi

[@ShiloBuff]

They should call it "chadcn-ui".

[@wisdomelue]

can it be used with plain react and not nextjs?

[@mortz16]

yep

[@ultimatescript]

Yes, I actually used it with React.

[@wisdomelue]

@@ultimatescript thanks

[@SoberMan2001]

​@@wisdomeluewhat's the name of this library?

[@wisdomelue]

@@SoberMan2001 shadcn

[@itztlacoliuhqui]

Chadcn

[@babthedev]

Copy and paste made easy.

[@chimebukaanyanwu5005]

👍

[@HolySl0w]

isn't it what tailwind css is doing too?

[@algo-wave]

What?? Tailwind is not a ui library

[@buzz1ebee]

​@@algo-wave tailwind-ui is. They have announced a version which is like this project too.

[@HolySl0w]

@@algo-wave what @buzz1ebee said. It's called Catalyst but it's still in early dev

[@breezycodes]

Yeah I watched the tailwind talk and I was like... wait.. Catalyst is exactly like shadcn ui 😂

[@TheGrandChieftain]

Just started using it because everyone said it was great, but now I know why. Thanks.

[@codedjango]

Not sure why they dont have releases for Vue3

[@kupyn]

there are ports of shadcn ui for vue, svelte and some other libs that were inspired by it.

[@guyincognito5663]

So it’s like normal, but worse😂

[@ShiloBuff]

Nah I'd say it's like normal but better. It's automated generating/updating. Ontop of already having the components created. Normal woudl be spending the time to create and tune your own components. Also changing a library's code isn't straight forward, so infact this has its own benefit compared to a library also. More light weight and easily editable. But yes, all approaches have their own cons. This sounds like it goes a unique route to get as many pros as possible.

[@kupyn]

wdym by “normal”?

[@hotlunch3632]

shadcn is a person not a company. chadcn

[@nagarajansubramani]

Gigachad cn

[@CanRau]

@ShadCN but yea 👌