Learn TailwindCSS in 23 minutes

Поделиться
HTML-код
  • Опубликовано: 25 дек 2024

Комментарии • 35

  • @durgaprasaddas6494
    @durgaprasaddas6494 2 месяца назад +3

    Simple, Precise, To the point. The shortest, easiest way to learn tailwind

  • @Swiftwebber7
    @Swiftwebber7 Месяц назад +4

    I got a client who wanted TW CSS for his project and I knew absolutely zero about it. Tysm for this tutorial! It was a great welcomer and propeller for Tailwind css. Now I can face the project head-on w no worries!

    • @lukas.webdev
      @lukas.webdev Месяц назад

      All the best for your projects! 😉

  • @awakenwithoutcoffee
    @awakenwithoutcoffee 7 месяцев назад +6

    the best and fastest content out there for new front-end developers bro. Keep it up!

    • @Smoljames
      @Smoljames  7 месяцев назад +1

      Cheers my broski :P

  • @beansynz
    @beansynz 14 дней назад +1

    Loving the WoT collection in the background! haha

  • @saltydawg8988
    @saltydawg8988 Месяц назад +1

    Woah there Doug, I’m clicking it…..easy.

  • @codernerd7076
    @codernerd7076 9 месяцев назад +2

    Hold off, I'm liking it... I'm liking it 😅

    • @Smoljames
      @Smoljames  9 месяцев назад +1

      No pressure :P haha

  • @aloshraam5000
    @aloshraam5000 2 месяца назад +1

    But what if u wanna use the same CSS on different pages. If u have a series of pages like a online store where the template/css might actually be the same in different pages. Wouldnt it be hard to write again and again

    • @Smoljames
      @Smoljames  2 месяца назад +1

      Great question! That's why tailwindcss pairs well with a framework like react.js. In which case you would define a reusable component so you write the styles once and use them on any page!

  • @i-N-k-Primus
    @i-N-k-Primus 5 месяцев назад

    Whats the software on the left? On the beginning i mean, The "github2 -- bash" thingy

  • @King_Hodop
    @King_Hodop Месяц назад +1

    I don't believe in luck, curse me if you dare, doug!

  • @CodyGilreath-k1v
    @CodyGilreath-k1v 9 месяцев назад +1

    Great video James! However I was wondering why in this video you install TailwindCSS with Vite but in your roadmap notes It’s just plain TailwindCSS that is linked? Are they different?

    • @Smoljames
      @Smoljames  9 месяцев назад +1

      Great question! So the way I like to think about Vite is that it's a tool that helps us setup and configure our projects so that we can use NPM with them (node package manager). That allows us to easily install packages and extensions like tailwindCSS and then use them in our project :P In short, if we setup our project using Vite, then it's really easy to add TailwindCSS so that we can use it in our code!

  • @aloshraam5000
    @aloshraam5000 4 месяца назад

    how do i open the bash thing ( terminal ) ?

    • @ragtop63
      @ragtop63 4 месяца назад +5

      In VS Code on Windows you hold down CTRL and hit the backtick key (upper left corner of the keyboard, next to the 1 key).
      On Mac you hold down the CMD key and hit the backtick key.
      Bash will only be available on a Linux based terminal. That means Linux, MacOS or WSL in Windows. However, you don’t need Bash to run Vite. You just need to make sure Node.js is installed in your computer.

    • @aloshraam5000
      @aloshraam5000 2 месяца назад

      @@ragtop63 thanks :)👍

  • @sgomez8194
    @sgomez8194 3 месяца назад

    Great tutorial! is it true that for beginners it is better to know good old CSS before jumping into Tailwind?

    • @aogava
      @aogava 3 месяца назад

      Don't skip CSS. You have to know it before starting learning more abstract things like Tailwind.

  • @CodyGilreath-k1v
    @CodyGilreath-k1v 9 месяцев назад +1

    I was also wondering why you deleted the counter.js and main.js files and if for other projects you might keep them?

    • @Smoljames
      @Smoljames  9 месяцев назад

      Great questions - basically when you create these projects using vite for example, they come with a demo app, so a prebuilt website that advertising the tech (vite in this case). You could repurpose them if your application had a similar purpose to their app, but in most cases we want a blank canvas to get started and will delete them!

  • @techsuvara
    @techsuvara 3 месяца назад

    I laughed when I miss heard crystal math. :D

  • @bollvigblack
    @bollvigblack 2 месяца назад +2

    are you hinting something about crystal meth ?

  • @buw_21
    @buw_21 9 месяцев назад +11

    me who's not good at css and learning tailwind 😵‍💫

    • @Smoljames
      @Smoljames  9 месяцев назад +3

      Haha I have a CSS tutorial that could help you then!

    • @bollvigblack
      @bollvigblack 2 месяца назад

      don't learn and memorize css. practice it

  • @mintz347
    @mintz347 5 месяцев назад +1

    Crytal match you watched to many breaking bad XD

  • @Sourav9063
    @Sourav9063 Месяц назад

    Every one who knows basic html css start the video from 5:30
    And Learn x in y minutes of video should not contain these fillers

    • @Smoljames
      @Smoljames  Месяц назад

      Not everyone starts from the same knowledge base as you might have - I try to make my videos as beginner friendly as possible and as such, I include beginner material. Calling it filler material shows your inability to consider and cater to others learning needs.
      I also disagree with your perspective about how learn x and y videos should work - if anything it highlights that you're probably not a very good teacher.
      Next time you have feedback, please try to share it in a more constructive manner.

  • @genshian
    @genshian 9 месяцев назад

    I see you changed the title. Was literally gonna call you out 🤣🤣 you barely touched the surface of Tailwind. I think to become a Tailwind "god" is to be able to understand how to structure your Tailwind. Similar to how Shadcn does it and knowing how to create modularity but retain customizability. Anyway, just an idea for you to cover if you wanna dive deeper past the basics.

    • @Smoljames
      @Smoljames  9 месяцев назад

      Hey bro :P I think you're confusing the videos as this title hasn't changed! This is a beginner TailwindCSS tutorial and it designed to get people up and running with it - then you can go into the advanced version which is linked in the description below. I did however make a god mode CSS video though which is what I assume you're referring to!

    • @genshian
      @genshian 9 месяцев назад

      @@Smoljamesomg! Woops 😂😂

  • @aysenuronaran726
    @aysenuronaran726 27 дней назад

    No. This is way too fast. I've already had lessons on Tailwind so I knew what I was doing but even so I was just copying what you were wrtiting and not really comprehending anything. If you have any prior knowledge, I'd actually suggest you to take a good look at the html and write your own tailwind first, then compare with the video.