Tailwind CSS from Zero to Hero: Technical Article

Tailwind CSS from Zero to Hero - Up and Running 🚀

Tailwind CSS from Zero to Hero - Up and Running 🚀

I wrote an article for daily.dev blog on the Tailwind CSS utility framwork with step-by-step tutorial and demo.





ℹ️ About

This was another article project I worked with daily.dev (apart from this one posted on Contra) to be published on their official blog.

This was a tutorial series of 5 articles on the Tailwind CSS topic. This was the first of the series. Here are the remaining 4:

1. Tailwind CSS from Zero to Hero - The Utility-First Workflow 
2. Tailwind CSS from Zero to Hero - Responsiveness and Custom Utilities 
3. Tailwind CSS from Zero to Hero - Extracting Components and Setting up for Production 
4. Tailwind CSS from Zero to Hero - Dark Mode, JIT & More!



I also designed the cover image for this article.



The article has the following sections to it:

• Intro: a catchy introduction to the entire series of articles and what to expect in the first part.
• Why Tailwind?: strong points covering why one should use this framework in their project(s).
• Setting up: this covers how to install Tailwind with its basic concepts covered, browser support etc.
• A quick demo: a short practice on styling a block with the framework.
• Conclusion: a recap of what we learned in this article.
• What's next?: a call-to-action on what topics will be covered in the next article.



🎯 Goals

Some of the specific goals for this article were:

1. To update the tech/coding community about the latest and greatest in my own words.
2. Sharing knowledge on the topics I already worked on so that it's easy to write quality article piece. This helps both the company and the author (me) in terms of reach as each article was shared thoroughly.
3. To share these articles with the audience using daily.dev about what's going on with the frontend web or React world by including explanations of new topics and tech.
4. To write top-quality, thoroughly reviewed, tutorial and project based articles that is plagirism free.
5. To use certain SEO specific words, topics and suggestions so that the article ranks high in search engines like Google.



💪 Challenges

There were not major challenges as I was already in touch with the daily.dev team and they were extremely flexible and okay with my process of work and they knew the type of articles I was publishing already.

Still, I did had a bit of time off while using a tool they provided to add certain SEO specific target words. I had to change the content of the article many times because I hadn't used those words.