Tailwind CSS Introduction, Basics & Guided Tutorial

Web Dev Roadmap for Beginners (Free!): bit.ly/DaveGrayWebDevRoadmap In this Tailwind CSS Introduction, Basics & Guided Tutorial, you will learn what Tailwind CSS is, what you need to use Tailwind CSS, how to setup Tailwind CSS and create an example Tailwind CSS project. 🚀 Become a full-stack web dev with Zero To Mastery Courses: - The Complete Web Developer: bit.ly/WebDevMaster - The Complete Web Designer: bit.ly/CompWebDesign - Junior to Senior Dev Roadmap: bit.ly/WebDevRoadmap-JrtoSr 🚩 Subscribe ➜ bit.ly/3nGHmNn 📬 Course Updates ➜ courses.davegray.codes/ ❓ Questions - Please post them to my Discord ➜ discord.gg/neKghyefqh ☕ Buy Me A Coffee ➜ www.buymeacoffee.com/davegray 👇 Follow Me On Social Media: Github: github.com/gitdagray Twitter: twitter.com/yesdavidgray LinkedIn: www.linkedin.com/in/davidagray/ 🔗 All Resources for this Tailwind CSS Course: github.com/gitdagray/tailwind-css-course 🔗 Playlist for this Tailwind CSS Course: bit.ly/3BKYrzg Tailwind CSS Introduction, Basics & Guided Tutorial (00:00) Intro (00:05) Welcome (00:14) What is Tailwind CSS? (01:27) Course Prerequisites (01:49) Web Dev Tools & Settings (04:50) Tailwind CSS Config file (07:13) input.css file (09:00) Compile the style.css file (11:13) Compiling with --watch (12:46) Starting Live Server (13:31) Tailwind CSS Intellisense (14:50) Using Tailwind docs to find class names (16:51) Creating a bullseye with Tailwind (18:01) Adding a custom class to input.css (19:47) Handling class clutter in your HTML 📚 Suggested Pre-requisites for this Tailwind CSS course: 🔗HTML for Beginners full course:    • HTML Full Course for Beginners | Comp...   🔗CSS for Beginners full course:    • CSS Full Course for Beginners | Compl...   📚 Tutorial References: 🔗 Tailwind CSS: tailwindcss.com/ ⚙ Web Dev Tools: 🔗 Chrome Browser: www.google.com/chrome/ 🔗 Node.js: nodejs.org/ 🔗 Visual Studio Code (VS Code): code.visualstudio.com/ 🔗 Live Server VS Code Extension: marketplace.visualstudio.com/items?itemName=ritwic… 🔗 Tailwind CSS Intellisense VS Code Extension: marketplace.visualstudio.com/items?itemName=bradlc… 🔗 Inline Fold VS Code Extension: marketplace.visualstudio.com/items?itemName=moalam… Was this tutorial on Tailwind CSS helpful? If so, please share. Let me know your thoughts in the comments. #tailwind #css #introduction

• #education
• #tailwind_css_introduction
• #tailwind
• #tailwind_css
• #css
• #tailwind_css_basics
• #tailwind_css_guide
• #tailwind_css_tutorial
• #tailwind_css_intro
• #tailwind_introduction
• #tailwind_intro
• #tailwind_basics
• #tailwind_guide
• #tailwind_css_setup
• #tailwind_setup
• #tailwind_css_set_up
• #tailwind_set_up
• #getting_started_with_tailwind_css
• #getting_started_with_tailwind
• #get_started_with_tailwind_css
• #get_started_with_tailwind
• #learn_tailwind_css
• #learn_tailwind
• #tailwindcss
• #css_tailwind_tutorial