Shadcn + Next.js 13 is HEAVEN | A QUICK GUIDE
ฝัง
- เผยแพร่เมื่อ 24 ก.ย. 2023
- Check out my web dev courses below🔥
developedbyed.com
-------------------------------------------------------------------------------------------------
Shadcn is becoming my new favourite way to build out UI's together with Tailwind. In today's episode i'll just show you a quick walktrough on how you can add themes, add a dark mode and show you the process on how you can install components in your Next 13 app.
ui.shadcn.com/
-------------------------------------------------------------------------------------------------
👨💻Connect with me
Twitter: / developedbyed
Instagram: / developedbyed
Github: github.com/developedbyed/
-------------------------------------------------------------------------------------------------
🎶 Dope music
C Y G N - Bikini Palm-trees chll.to/d0798a7f
C Y G N - Emotions chll.to/bfeb2b66
C Y G N - Let it go chll.to/41ba6c49
#react #tailwindcss #shadcn - วิทยาศาสตร์และเทคโนโลยี
The Next.js 13 course is getting closer to be released, it will be completely revamped with shadcn + tRPC/server actions and a couple of entirely new chapters!
Thanks for everything ✨✨
Haha loved the button pun 😂 Will the course also include Tanstack & Driizzle?
Yeah both of these!
my body is so ready
I need a specific time.😀
When will the course be updated? I can't wait to buy it.
It really is! I've applied this combination on certain projects and it's SO simple to program with!
Yes, but can be way too much overwhelming with huge chunks of code for a simple dropdown or button.
@@tajkoyou always have the option to code it yourself.
I tried to make shadcn for the app my department is working on. My company tried to make a shadcn for the company. And then I saw this and I just... wow. This bloke is gold.
Awesome video, will try it in my next project! It’s gonna be a huge time saver
Hey! Thanks for sharing. At work we chose Preline UI and I tried it for one of my personal projects. But for the next one, I wanted to try shadcn ui. Your video helped me to make the decision. :)
holy moly, i thought i was gonna have to go with mui. Shadcn looks like the right way to go
looks awesome, I will give it a shot !
This is a really great man!
Wonderful definitely I should make use of it
The disappearing effect on switching modes made me subscribe liked the video 🤣
Yessss here is the video I wanted
Sir,
Have you tried NextUI ?
Should I go with NextUi or shadcn ?
For the custom theme, we need to copy paste it like u did for red. Is there a way to do it based on user input like in the website? The user will click red, blue, orange, etc and it will change accordingly
Same question
You'll have to keep track of multiple theme variables and use js to dynamically change that
One quick fix, in the zod section you said that the username is looking for not more than 5 chars buts it's the opposite, it's looking for min 5 chars in it
Hey Ed!
Not related to the video but I’m really interested in getting your react course.
Is it still up to date? Thanks!
Which vscode extensions and theme are u using? Everything’s so smooth :)
Bump! What theme is this!
Great video! What's the name of the VSC theme?
Which VSCode theme you are using ?
Could you help me with something, the shad cn components are styling properly if theyre used within the app folder but not if theyre used on a pages folder, i also added the routes to the css config but it still remains broken, how comd
This is awesome
Is there any guide for designers? (like all about Figma stuff and etc.) We're building a new product and our team decided to use an open-source design-system, so im on it. But all I've found about shadcn is dozen tons of developer stuff (and poor design file in Figma Community) and as you can guess I don't give a hack what all of this means. So I'm just interested of what kind of adjustments I can do and how the handoff process using this library is organised at all.
00:25 | Your face scared me a little 🤣
Suggestion for one of the next videos. ShadeCN + Storybook.
yep it is 😊
nice to hear that author voice and "clean" English.
I always like to just install everything by not specifying a component when using the shadcn add command.
You know it's good when the account has Morty as a pp
What is the name of the theme please , i tried nightowl but the colors here are lighter
which one to use Radix Themes or shadcn themes ??
nice one
Why they not provide warning, info variant of buttons by default
funniest youtuber ever lol
Hey Ed can you do sencha Extjs?
It seems pretty neat. I'll give it a try for my next project
I think Mantine UI 7.0 is better alternative. Would like you to review it if possible.
its not xd
How do I add all the color options available for end user?
Same question
I found this a bit difficult to follow a long, the code snippets for className I manually typed out because I couldn't find the navbar styling, I feel I had to pause the video every few seconds just to write out what you were doing, but it felt exhausting and incoherent as to what I am doing
Hey how can build array Tags Ui using shadcn
I love u!
What a chad!
How would i do this without using typescript?
I love your videos. I would also love to buy your courses but in my country's currency, they're too expensive. 😥
Dont buy his courses, this is a crap
Sir please make a complete course on GSAP with Three JS
Seriously threejs is giving me headaches and heart attacks
@@btssugahit4663😂 Yeah Same here
Where do i get desktop background like yours?
Internet has some wallpapers
cant install it on nextjs (JS project) :/
Next UI
Cool! You have created another bare simple page that says nothing about more sophisticated cases where I have found shadcn to be inconvenient.
Just edit the actual UI component, how would it be inconvenient?
Sometimes a little CSS is all thats required... that's whats so good about utility classes, you decide to use them on a per case basis. 👌Fomo-ing into the latest UI won't instantly catapult learner coders into seasoned Software engineers.
its not working from my project
Why Next.JS over Nuxt.JS?
bc NoNuxt November is approaching…
I use ant.design for my UI‘s
Yeah it's good But PrimeReact is better than that. I recently switched to PrimeReact after I found that.
we upgraded bbbbbbttch
Looks like hell to me, and why there’s so many bots in this video?
…/Learning/woooo 😂
No pagination
funny thing is: stating you use Next.js 13 has no correlation whether you use app or pages router.
Did you see the app folder there? That means it’s app router
Can you please make video on shadcn ui form and how to integrate select,radio, and checkbox in form
Can you make a video with Shadcn without typescript and next?
At this stage webdev is witchcraftery
csd
its been a month buddy & you're outdated😂
now do the same with next14 for us!
shadcn is extremelly lagging
please. Why my visual studio code when writing classname dont show the list existing like you. Teach me please
@developedbyed
Trust me Dev ED was the better name in my opinion
type your message
sadiqu hasan 123
This is awesome
nice one
Hey how can build array Tags Ui using shadcn
This is awesome
This is awesome
This is awesome
This is awesome
This is awesome
This is awesome
This is awesome
This is awesome
nice one
nice one
nice one
nice one
nice one
nice one
nice one
nice one
nice one
nice one