Build a ReactJs, Tailwind UI and Tailwind CSS Template

Steven Creates
3 min readSep 8, 2020

A guide to building your own React and Tailwind UI / CSS project.

Photo by Tracy Adams on Unsplash

INDEX:

  • Follow Along
  • Quick Start (Scroll to Bottom)

Before we start, I wanted to say thank you for taking the time to read my guide + article. I really enjoy providing easy and helpful examples to the community. If you end up loving my article please give it a clap. Or if there is something you would like me to add please comment. I can’t get better without your feedback. Thanks again!

Follow Along

In this follow along we are going to build a basic template to start building out your react application using React, Tailwind UI, and Tailwind CSS.

Tailwind UI is Tailwind CSS’s latest library that they are building for already built components. ie (side nav, cards, tables, full-on dashboards, etc)

Step 1: Create React App

Let's create the react app! If you’re familiar with react this should be familiar.

Open up your terminal and run the following:

>> npx create-react-app tailwindcss-react-template

This will install react in your current working directory.

--

--

Steven Creates

Software Engineer with 7+ years of hands-on experience designing, developing, and implementing. Focusing on React + Animations + TypeScript + Storybookjs