Workshop1-TailwindCSS-HTML Tailwind Templates

Workshop1 Tailwindcss Html

Workshop # 1 - HTML/TailwindCSS

I want to start by saying thank you for joining me today. A goal of mine has always been to be in a position to help others and to make an impact in some way. One of those ways I'm looking to make that impact is through teaching.

Before I made the career change to becoming a frontend developer I was a chef for the last ten years. Two of my favorite things that I got to do in the restaurant industry was be a trainer and to do restaurant openings. I really find a sense of purpose by helping others grow and it was an amazing experience to constantly train new people in multiple facets of a restaurant.

Now, the build!

Project Overview - Palette

What we'll be making today is a simple, fully responsive, landing page with HTML, TailwindCSS and JavaScript, which you can take a peak at below!

What We'll be Using

Tools and Technologies:

  • TailwindCSS
  • HTML
  • JavaScript
  • VSCode
    • Live Server Extension
    • TailwindCSS Intellisense
  • Hero Icons
    • Hamburger Icon: <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
    • Arrow Icon: <svg class="w-6 h-6 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path></svg>

Top categories

Loading Svelte Themes