Learn how to integrate Tailwind CSS into your Django projects.
Tailwind is a paradigm shift for how you'll use CSS in your all of your web applications and Django projects. Instead of using classes like `btn-primary` you'll use a list of more robust classes to describe how you want your element to render. Such as:
`bg-blue-500` (the background color)
`text-white` (the text color)
`rounded-lg `The border radius
`hover:bg-blue-800` The background color when someone hovers on this element
`px-5` The horizontal padding on the left or the right of the contents
And so much more.
Writing CSS classes like this is almost too verbose since it seems to violate DRY but it does not. Instead, this verboseness unlocks a clarity in how you document your CSS classes and how things are rendered. It took me a long time to adopt Tailwind because of this verboseness but once I did, I have never looked back. Tailwind is incredible.
In this course, we will learn how to setup Django project to leverage Tailwind.css from scratch.
*Links and Resources*
Code: https://github.com/codingforentrepren...
Live Demo: https://django-tailwindcss.demo.cfe.sh/
Ad-free course: https://www.codingforentrepreneurs.co...
*Chapters*
00:00:00 Welcome
00:03:04 Tools and Requirements
00:07:31 Configure Project Virtual Environment
00:12:37 Install Django & Create Project
00:17:21 Configure Django Static Files
00:24:23 Django Templates and Home View
00:28:58 Initialize Tailwind CSS
00:35:38 The Magic of Tailwind
00:41:01 Colors and Tailwind
00:51:01 Thank you and next steps