Setting Up Tailwind
July 16, 2020
Tailwind CSS is a utility first library for styling HTML. It is not library with components like Ant Design, Bulma etc. You still need to create those components yourself, however , it gives you a better developer experience for styling your HTML so that you can get a custom feel to your designs, without the headache of overriding styles.
Since all the necessary installation steps are done via the React Bleeding Edge Kit, all we need to do is replace the default tailwind.config.js
file with the one that will mirror the design system for the Lunar Tour on Figma.
Here is a link to the file, copy its contents and replace it with the contents of the tailwind.config.js
in the root of the project.
Pretty simple task. Now we can start creating the UI components.