Then, we will need to update our index.tsx file to change the import from index.css to tailwind.output.css:
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
Now we are ready to run!
Playing around with App.tsx
Run yarn start to get our application up and running.
Once up, let's update our App.tsx file to look like the following:
While this example is trivial, it becomes important for when you are defining variants based on props. We could swap out toggle to be logic such as status === 'error', etc. to reflect different possibilities through our application.
This has been a quick morning coffee and blog post on getting up and running with Tailwind without getting into the nitty gritty details.
Tailwind has a great reputation and for good reason - I highly recommend using this playground to try out what else it does offer.