DEV Community

Cover image for Discovering Tailwind CSS
ChiaraLyn
ChiaraLyn

Posted on

3

Discovering Tailwind CSS

After work there is always something to study and deepen, and if it happens that your work is also your passion, studying is really the best thing!

Today I am about to finish the first "dusting" on Tailwind (tailwindcss.com), to then move on to some practical exercises on components.

Tailwind represents my short break from the JavaScript in-depth course that I hope to finish soon. Studying a new CSS Framework makes me feel almost guilty because I was "born" with Bootstrap and now I feel "at home" when I use it, but Tailwind is a low-level framework and allows you to build responsive components and configure the project at the start, creating customized layouts and with a lot of margin of choice on the color palette and typography.

The only thing to keep in mind when using Tailwind, born to write semantic CSS, is that the markup will get very polluted, and I must to evaluate the maintainability of code written with this type of approach.

With the @apply directive you can create custom classes to which the Tailwind classes "attach", in order to have a custom nomenclature.

In general, I like the idea of keeping markup separate from style, but so it is! Obviously having HTML overflowing with classes it doesn't really matter to some.

Tailwind also, in production, removes the unused CSS, so that we can lighten and optimize the project!

Visual Studio Code has the integration of the Tailwind Intellisense extention, that allows you to view the list of classes while you are writing, a very valuable aid to not do the continuous "ping pong" from the documentation.

I still have to "mess around" a bit to get carried away, but Tailwind has given me good vibrations, also for the good documentation that it hangs around with, (the community looks really nice, you can find it on Discord and GitHub) I will probably work on some small components to share on Codepen.

I hope it will make me passionate as did Bootstrap, which I consider "my giant". On the next break from JavaScript, let's see... what could I do? Of course! I'll go dig into Bulma's documentation...!

SurveyJS custom survey software

Build Your Own Forms without Manual Coding

SurveyJS UI libraries let you build a JSON-based form management system that integrates with any backend, giving you full control over your data with no user limits. Includes support for custom question types, skip logic, an integrated CSS editor, PDF export, real-time analytics, and more.

Learn more

Top comments (1)

Collapse
 
darshanbajeja profile image
Darshan-Bajeja

Yup! You should definitely try anything u get and u think it's good....

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay