Tailwind CSS Project | TailwindCSS Tutorial
Sigue así. Cada lección te acerca más a tu certificado.
Sobre esta lección
Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap In this Tailwind CSS project tutorial, we continue building the Acme Rockets website. You will learn how to apply custom media queries, pseudo-elements with before and after content, and various CSS styles with Tailwind CSS class names. 🚀 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 Project Part 2 - TailwindCSS Tutorial (00:00) Intro (00:05) Welcome (00:15) Project Review (02:28) Start tailwindcss (03:43) Testimonials section (06:23) Add before and after pseudo-elements (10:35) Testimonials section continued (17:25) Contact Form (24:03) Footer (30:47) Custom Media Queries 📚 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/ 🔗 Prettier: https://www.npmjs.com/package/prettier 🔗 Automatic Class Sorting with Prettier: https://tailwindcss.com/blog/automatic-class-sorting-with-prettier ⚙ 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 for building a Tailwind CSS Project helpful? If so, please share. Let me know your thoughts in the comments. #tailwind #css #project
Sobre este curso
Learn Tailwind CSS in this tutorial series. From dev environment set up and useful VS Code extensions to building and deploying a complete project with Tailwind!
Lo que aprenderás en este curso:
- Estructurar páginas web semánticas con HTML5
- Aplicar estilos profesionales con CSS3 y diseño responsive
- Crear layouts modernos con Flexbox y CSS Grid
- Implementar animaciones y transiciones CSS