Originally published at soumya.dev.
Tailwind CSS is a utility-first CSS framework which means it has various utility classes which help to create layouts and rapidly create custom designs.
I have always loved Adam( Tailwind CSS creator)’s streams where he creates awesome-looking, well-designed layouts using Tailwind CSS. Now I cannot imagine a future project without using Tailwind CSS.
My blog is built using Tailwind CSS. 😉
How is it different from Bootstrap or Bulma etc.? 🤔
Most UI frameworks like Bootstrap, Material UI, Bulma etc. have pre-designed UI components like cards, buttons, navbars, alerts. You use those components and create designs on top of those components.
But in Tailwind CSS, you don’t get a pre-designed set of components. You get utility-classes. You can combine those to create your layout and components. …
Originally published at soumya.dev.
I was amazed by the stuff one can do using Tailwindcss. I watched in awe the live streams of Adam Wathan (creator of tailwindcss)where he used to build various layouts using tailwindcss, without using any custom CSS.
Not being a great designer by myself, I decided to give TailwindCSS a try. Being a React developer, I wanted to try tailwind with React.
Then, I was starting with a Gatsby site, I thought why not use tailwind with this. I also wanted to use it with a CSS-in -JS solution like Emotion or styled-components being a big fan of CSS-in-JS. I googled a lot, tried different starters and here I am with what I can tell the “best 👌” way to use TailwindCSS with Gatsby along with CSS-in-JS solutions like Emotion or styled-components. …
Updated guide for 2020
Spoiler Alert : I suggest you to try to hack your way into the site, before actually reading anything below. If you fail after considerable tries or you want to know a method which may be different than yours, you can follow along below.
(Updated) Video Version of tutorial:
If you want to watch a video instead of following the below tutorial, you can do that:
If you enjoyed the video, please subscribe to a budding youtuber:
First of all, a small-ish intro about myself:
I am Soumya Ranjan Mohanty ( @geekysrm on the web), a Google Certified Mobile Web Specialist and Full Stack Developer. I also develop Native desktop apps with Electron and Android apps with React Native.
Visit my site to know more about me: https://soumya.dev …
Originally published at soumya.dev
Hello readers! First of all, a small introduction about myself. I am Soumya Ranjan Mohanty , a software developer.
I took the Introduction to Modern Application Development course which was being jointly offered by IIT Madras and Hasura. I was new to web development and app development. But I grasped all the concepts taught to us in the 8 week course quite easily, thanks to the amazing teaching style of Tanmai Sir along with others, while doing a handful of practical exercises. An NPTEL online exam was held and top 5%(~400) students were selected for the Hasura Product Development Fellowship. …
About
