Tailwind CSS Introduction, Basics & Guided Tutorial
Dave Gray
@davegrayteachescodeAbout
Web Development tutorials with full courses on HTML, CSS, JavaScript, React, Node.js and more! My goal is to help you learn how to build the web. Teaching helps me learn, too. I work full-time as a Solutions Architect / Developer and part-time as a university web dev instructor. Thank you for subscribing, supporting my channel and sharing the videos you think may help others. Keep striving for progress over perfection. And a little progress every day goes a very long way. Milestones: July 20, 2020 - 1st video Jan 1, 2021 - 1k subs April 2021 - 4k watch hours Nov 2021 - 10k subs Jan 21, 2022 - Video at 100k views Feb 16, 2022 - 100k watch hours Feb 19, 2022 - 1m views Dec 13, 2022 - 100k subs Dec 2022 - Over 1m views in 1 month April 7, 2023 - 10m views May 26, 2023 - 1m watch hours Sept 22, 2023 - Video at 1m views Dec 25, 2023 - 250k subs
Video Description
Web Dev Roadmap for Beginners (Free!): https://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: https://bit.ly/WebDevMaster - The Complete Web Designer: https://bit.ly/CompWebDesign - Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr đ© Subscribe â https://bit.ly/3nGHmNn đŹ Course Updates â https://courses.davegray.codes/ â Questions - Please post them to my Discord â https://discord.gg/neKghyefqh â Buy Me A Coffee â https://www.buymeacoffee.com/davegray đ Follow Me On Social Media: Github: https://github.com/gitdagray Twitter: https://twitter.com/yesdavidgray LinkedIn: https://www.linkedin.com/in/davidagray/ đ All Resources for this Tailwind CSS Course: https://github.com/gitdagray/tailwind-css-course đ Playlist for this Tailwind CSS Course: https://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: https://youtu.be/mJgBOIoGihA đCSS for Beginners full course: https://youtu.be/n4R2E7O-Ngo đ Tutorial References: đ Tailwind CSS: https://tailwindcss.com/ â Web Dev Tools: đ Chrome Browser: https://www.google.com/chrome/ đ Node.js: https://nodejs.org/ đ Visual Studio Code (VS Code): https://code.visualstudio.com/ đ Live Server VS Code Extension: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer đ Tailwind CSS Intellisense VS Code Extension: https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss đ Inline Fold VS Code Extension: https://marketplace.visualstudio.com/items?itemName=moalamri.inline-fold Was this tutorial on Tailwind CSS helpful? If so, please share. Let me know your thoughts in the comments. #tailwind #css #introduction
No Recommendations Found
No products were found for the selected channel.