Django x Tailwindcss

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.

References

• Course
• Code Repo
• Django Docs
• Tailwind.css Docs