Building a Front-End Web App with Next.js 14
HTML-код
- Опубликовано: 2 мар 2024
- Get my full-stack Developer Masterclass for $12 👉 dub.sh/thedevelopercourse
👇 Thanks for watching! Please subscribe ❤️
🔥 thedevelopercourse 👉 dub.sh/thedevelopercourse
• Discord 👉 dub.sh/codewithg-discord
• Website 👉 dub.sh/codewithguillaume
• Newsletter 👉 dub.sh/codewithg
• Repositories 👉 dub.sh/codewithg-repos
⚡ Shipfast - The NextJS boilerplate to build your SaaS 👉 dub.sh/codesf
⚡ Supastarter - The Supabase boilerplate to build your SaaS 👉 dub.sh/supastarter
⚡ Submagic - AI RUclips shorts tool 👉 dub.sh/codewithg-submagic
⚡ Amicons - 300+ unique icons 👉 dub.sh/amicons
RUclips studio
• 4K Insta 360 Cam 👉 amzn.to/3U8Km7V
• Microphone Shure MV7 👉 amzn.to/3J7fAGf
• MacBook Pro 16.2” M3 Pro 12‑core CPU, 18GB Unified Memory, 512GB SSD Storage 👉 amzn.to/49uCd1X
• MacBook Air 13.6” M2 chip, 8GB RAM, 256GB SSD Storage 👉 amzn.to/3xs3STY
• Airpods Max Pro 👉 amzn.to/3VVTbTA
• JBL Pulse 5 👉 amzn.to/3U8pRs0
• Shure RK345 👉 amzn.to/3TKWU3X
• Stands Ds7200B 👉 amzn.to/3vI3eRC
• Stands MS7201B 👉 amzn.to/3xBStRi
• Mini Tripod Kit 👉 amzn.to/3vzsmKv
• Key Light 👉 amzn.to/43WmpnC
• Rim Light 👉 amzn.to/3PUer8J
• Background Light 👉 amzn.to/4asv4AG
Social
• LinkedIn 👉 dub.sh/6vbNPaH
• X 👉 dub.sh/codewithg-x
Others
✉️ Business Request 👉 dub.sh/codewithg-business
🔥 Join Peerlist, the Tech LinkedIn 👉 dub.sh/peerlist
VSCode themes
- Tokyo Night Storm (blue)
• Default Dark Modern
📈 Popular videos
- Learn Next, Supabase & Resend 👉 dub.sh/next-resend-supabase
• Learn Nuxt 3 👉 dub.sh/nuxt-3
• Learn Next & Shadcn 👉 dub.sh/nextjs-shadcn
• Learn Supabase 👉 dub.sh/supabase
• Learn Next 14 👉 dub.sh/nextjs-14
• Learn Next & Supabase 👉 dub.sh/next-supabase
Thank you :)
Guillaume
🚀 Ship your startup in days, not weeks 👉 dub.sh/codesf
📦 npm i useritem@latest 👉 dub.sh/useritem
Chapters:
00:48 Get Started
12:52 Sidebar
25:22 Menu
33:58 Command Bar
43:15 Dropdown
51:12 Charts
1:02:28 Bentos & Charts
1:13:22 Tables
1:22:15 Responsive
1:31:27 UserItem
1:35:21 Team members
Looking forward to it! Thank you
Is there a way to implement the new shared/wrapper layout.tsx in a NextJs v14 project but still use the old NextJs "pages" folder instead of "app"?
Hi, Shadcn Commandlist pushes down other elements on the page, how to make it overflow so it just covers the content below when onFocus ...
Thanks Guillaume. You earned a subscribe. This is really nice.
Wooow thank you my friend ❤️
Any ideas why the dark/light mode would works on dev but not on prod? 😥
this is helpful ❤
waiting
Would be great if you can do tutorial for shadcn/radixui for the vue3/nuxt3 ....thank you so much
Coming just after ❤️❤️
@@codewithguillaume thank you a lot! It would be so helpful for all of us!
Where can I find the github repository for this project?
Yes Please
can next js hide the fatching comunnication from front-end and mid-end in network tab(inspect browser)?
Yes
With next you can't see fetchs on browser
Are you telling me that with this ‘library’(shadcn ), I can copy the components without making them myself?🙂
Yep my friend ❤️👍 enjoy
What is the font that you are using in the editor?
Not sure but it looks similar to IBM Plex Mono
Your supabase series is really good. Helps a lot in my SaaS
Good you love this one as well
filip filipowski is crazy 😂
He’s the best ❤️
thanks ❤
ncomp, which extension is tht from?
It’s actually my own ❤️👍
@@codewithguillaume nice!
qq, my shadcnui commnad does not have same hover effect when mouse, wonder if that is an issue with nextjs and shadcn integration. button works fine??
It would be kind of you if you could update the repo with the full code. The repo has the code till General.tsx
Suddenly it was a useful video, Thank 💫
You actually hovered over line 40 lol
what happened to vue/nuxt
Coming Sunday
Lol