How to build a landing page with Tailwind CSS, Tailwind UI, Vite.js - tutorial video

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

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

  • @mikejohns3530
    @mikejohns3530 3 года назад +2

    How did you know this was the exact tutorial I needed this week? 😂

    • @JustinJackson
      @JustinJackson  3 года назад +1

      I've been watching you. 👀

    • @michaelbrysen2589
      @michaelbrysen2589 3 года назад

      i guess im randomly asking but does someone know a trick to log back into an instagram account?
      I was stupid forgot the password. I would appreciate any assistance you can offer me!

    • @gannonjedidiah3198
      @gannonjedidiah3198 3 года назад

      @Michael Brysen instablaster :)

    • @michaelbrysen2589
      @michaelbrysen2589 3 года назад

      @Gannon Jedidiah Thanks for your reply. I got to the site thru google and Im in the hacking process now.
      I see it takes quite some time so I will get back to you later with my results.

    • @michaelbrysen2589
      @michaelbrysen2589 3 года назад

      @Gannon Jedidiah it worked and I actually got access to my account again. Im so happy:D
      Thanks so much you saved my account!

  • @patrickvandersluis2796
    @patrickvandersluis2796 2 года назад

    Justin, thank you for the hours you dedicate to teaching those of us in the wilderness alone. You saved me countless hours of floundering. I'm new to Vue.js and was able to translate everything you did in HTML to my environment. Lots of steps that I wouldn't have figured out.

  • @RajivPerera
    @RajivPerera 3 года назад +3

    Thank you for doing this. Big fan of Tailwind. This was very helpful!

  • @BurmisStudio
    @BurmisStudio 3 года назад +1

    Love this tutorial Justin! Needed to launch a landing page this afternoon and this is exactly what I needed to do that! THANK YOU!

  • @figurich
    @figurich 2 года назад +1

    So good explanation, the most worthy tutorial I watched today

  • @imperativeemarketing5546
    @imperativeemarketing5546 2 года назад

    This looks good and I "liked" it. The only one feature I would have liked for you to include is the JIT compiler.

  • @gtabidze
    @gtabidze 3 года назад +2

    Thank you.
    Right amount information I needed to get interested in AlpineJS and Netlify. Moreover, it seems we are on a same understanding level and your explanation of new things was positive and sometimes fun right after the edits.

  • @valentine3463
    @valentine3463 2 года назад

    Amazing tutorial! So glad I found a video that explains everything so clearly. You earned a subscriber.

  • @aniltheblogger
    @aniltheblogger 3 года назад +1

    Perfect tutorial, thanks

  • @fraggle5977
    @fraggle5977 3 года назад +5

    How to make a landing page with Tailwind: Go to the Tailwind UI site, copy the code, paste into your file.

  • @osanchez
    @osanchez 3 года назад +2

    Hello, great video!
    I have a project with multiple pages, all in HTML, but when I run NPM BUILD it only processes the index, and the rest of my pages do not appear in the dist folder. Could you help me and tell me what I'm doing wrong?
    Thanks!

    • @md.siddiq7165
      @md.siddiq7165 3 года назад +1

      Hello, I have the same question. I have an index.html file and an
      about.html file. But when I run npm run dev, it doesn't tracks the about.html file.

    • @abrakadabra551
      @abrakadabra551 3 года назад

      For non-SPA structure, one has to update the rolllupOptions in vite config to include the subject html.
      More details at vitejs.dev/guide/build.html#multi-page-app

  • @tkrempser
    @tkrempser 2 года назад

    Thank you

  • @bezimienny5
    @bezimienny5 3 года назад +2

    Ok, so essentially this tutorial says "buy this code and it'll work". Great advice, thank you.

  • @J90JAM
    @J90JAM 3 года назад +1

    Great video, super helpful! Is there a github for the project?

  • @mosptprn
    @mosptprn 3 года назад

    Hello there, I add some inline script to the project, but I'm stuck with adding env in the index.html file. Any solution?

  • @sugartengis2652
    @sugartengis2652 3 года назад +1

    thanks for the nc video i really needed this kinda code for school project did you ever considerd being a teacher if not you should be one

    • @JustinJackson
      @JustinJackson  3 года назад

      Thanks! That's really kind of you to say so.

  • @justingolden21
    @justingolden21 3 года назад +1

    Only complaint: you use light theme GitHub Desktop

  • @oliverp8006
    @oliverp8006 3 года назад

    great video, is there a way to still use templating and (maybe markdown) with this setup without vue or react for multipage sites? This could be a nice alternative to 11ty

    • @JustinJackson
      @JustinJackson  3 года назад

      I don't this so; not with this setup. You could use something like Statamic CMS for that (or the Netlify CMS, which I haven't tried).

    • @justingolden21
      @justingolden21 3 года назад

      Is this what you want: github.com/tailwindlabs/tailwindcss-typography

  • @pixelbakery
    @pixelbakery 3 года назад

    How are you getting the emojis in your terminal?

  • @TabbyMoon
    @TabbyMoon 3 года назад +1

    nice vid. thanks

  • @ProblematicParag0n
    @ProblematicParag0n Год назад

    Please update this video, it does not work for me anymore :(

  • @lawrencemotions8720
    @lawrencemotions8720 3 года назад

    i prefer next.js and tailwind css, npx create-next-app -e with-tailwindcss my-project
    cd my-project it generates the correct files automatically a lot less complications in my opinion.

  • @whatthefunction9140
    @whatthefunction9140 3 года назад

    I think its vite like fight

  • @Protoscribe
    @Protoscribe 3 года назад

    Quack :')

  • @Bevallalom
    @Bevallalom 3 года назад

    I like how tailwind looks. But it's a terrible approach to kinda go back to 2000 and pack everything into html tags. Just terrible