KZhead
Ғылым және технология

Tailwind CSS V4 For NextJS, Astro and Vite TODAY

Jack Herrington
2024 ж. 17 Мам.
13 777 Рет қаралды
Жүктеу

Tailwind V4 alpha is out. It's 10X faster than 3 because of new Rust based zero configuration tooling. We know it works on Vite, let's check it out on NextJS, Astro, and ShadCN.
Article: tailwindcss.com/blog/tailwind...
💻 Code: github.com/jherr/tailwind-v4-...
👉 Upcoming NextJS course: pronextjs.dev
👉 Don't forget to subscribe to this channel for more updates: bit.ly/2E7drfJ
👉 Discord server signup: / discord
👉 VS Code theme and font? Night Wolf [black] and Operator Mono
👉 Terminal Theme and font? oh-my-posh with powerlevel10k_rainbow and SpaceMono NF
00:00 Introduction
00:59 Tailwind V4 In NextJS
03:28 Tailwind V4 in Vite
04:46 Built-in Container Queries
07:49 Tailwind V4 in Astro
09:34 Tailwind V4 With ShadCN
10:24 Outroduction

Пікірлер

  • Be careful with container queries if using popovers or full screen modal dialogs. Make sure they’re rendered *outside* the container.

    @OnceABustAlwaysABust@OnceABustAlwaysABust2 ай бұрын

  • Thanks master, I miss your videos!!

    @_hugo_cruz@_hugo_cruz2 ай бұрын

  • Tailwind V4 got super cool!! Great video!

    @eliasepg@eliasepg2 ай бұрын

  • I haven’t watched your content in a while, great as always 🎉

    @kevinzunigacuellar@kevinzunigacuellar2 ай бұрын

  • Thanks you. I couldn't find how to upgrade to Tailwindcss v4. Perfect! Once again... thanks.

    @MyGeorge1964@MyGeorge19642 ай бұрын

  • Thank you for the video! 🙏👏❤️

    @paweciosek489@paweciosek4892 ай бұрын

  • This is awesome!

    @khoinguyen-ft2ys@khoinguyen-ft2ys2 ай бұрын

  • Hi, Jack, can you share your terminal setup is that zsh?, looks awesome :)

    @saefulrahman3478@saefulrahman34782 ай бұрын

  • Just about to init a project, nice timing..

    @mdminhazahamedrifat3282@mdminhazahamedrifat32822 ай бұрын

  • Thank you for all your videos. They help us a lot in understanding what's going in the IT space. A request, can you please make few videos on how to make Micro Frontends using React & Next.js in 2024 ( I mean CSR MFs & SSR MFs)

    @HarshalHirve555@HarshalHirve5552 ай бұрын

  • I really appreciate your genuine love and excitement for all things code. Your videos are truly entertaining and informative. I would love for you to make a video sharing your thoughts on the current developments in ai such as Devin Ai etc and how you think it may impact our industry. As someone who also enjoys all things code I feel sad that it may be a dying art. The Internet is full of doomers so an informed opinion would be really useful

    @RRCaddick@RRCaddick2 ай бұрын

  • Astro ❤

    @michaelandreuzza@michaelandreuzza2 ай бұрын

  • Love you Jack

    @Blue-bb9ro@Blue-bb9ro2 ай бұрын

  • Jack, what font is that what you are using in your terminal and vscode? Looks very slick.

    @codeagency@codeagency2 ай бұрын

  • It was already super fast, now it's lightning speed.

    @gaming_zen_99@gaming_zen_992 ай бұрын

    • But is it … blazing fast?

      @Quabbe2@Quabbe22 ай бұрын

    • @@Quabbe2 I don't hear anyone complaining yet.

      @gaming_zen_99@gaming_zen_992 ай бұрын

  • Since Astro is build on top of vite you can use the vite plugin in your Astro config under vite.plugins property

    @kevinzunigacuellar@kevinzunigacuellar2 ай бұрын

  • Cant wait for the full stable release to use it in all projects !

    @filip.a.@filip.a.2 ай бұрын

  • Can you make video or give me source on Redux implementation in module federation with vite ? I am getting errors while implementing it?

    @user-zh6ej1jk6r@user-zh6ej1jk6r2 ай бұрын

  • i don't really understand excitement about v4, it looks like nothing changed but breaking changes are introduced, is it possible to use v4 in a v3 config way?

    @user-bu6fc2bn1e@user-bu6fc2bn1e2 ай бұрын

    • Yes, AFAIK.

      @jherr@jherr2 ай бұрын

  • good

    @rmltsn@rmltsn2 ай бұрын

  • There was a slight visual regression with the colour selection circles when you fixed the initial config the first time: kzhead.infoUgkxWSaIsfCsoK7uAN6O0vWUIA6xXiS9sdXE?feature=shared

    @IainSimmons@IainSimmons2 ай бұрын

    • Yeah. After publication I noticed that as well. I've been wondering if the visual test tools in Chromatic would have caught that.

      @jherr@jherr2 ай бұрын

  • You can actually use the same Vite method for Astro projects

    @thebrpob@thebrpob2 ай бұрын

  • Very cool, but I always feel like building a front-end application these days is like buying a new car - by the time you deploy, it's obsolete 😴

    @gosnooky@gosnooky2 ай бұрын

  • do angular too

    @backupmemories897@backupmemories8972 ай бұрын

  • we don’t deserve this man

    @Gainmackain1@Gainmackain12 ай бұрын

  • Does the tailwind vite plugin works with next js!?

    @xxXAsuraXxx@xxXAsuraXxx2 ай бұрын

  • New engine + parser written from scratch but still no support for variants grouping even though it’s heavily requested for over 2 years😢 /discussions/11701 /discussions/8337

    @MinhTechie@MinhTechie2 ай бұрын
KZhead