Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
richardevcom authored Aug 20, 2021
1 parent f305427 commit 0e11d1a
Showing 1 changed file with 34 additions and 40 deletions.
74 changes: 34 additions & 40 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Tailwind CSS Boilerplate
# Coming Soon Boilerplate

Tailwind CSS boilerplate for HTML projects. Bare-bones HTML starter template with Tailwind CSS, PostCSS, Gulp, Browsersync & Imagemin.
Coming soon boilerplate for HTML projects. Bare-bones HTML starter template with Tailwind CSS, PostCSS, Gulp, Browsersync & Imagemin.

The main purpose of this boilerplate is to simplify the configuration of Tailwind CSS for beginners.

Expand All @@ -9,57 +9,51 @@ The main purpose of this boilerplate is to simplify the configuration of Tailwin
1. Clone the repository:

```bash
git clone git@github.com:salttechno/tailwindcss-boilerplate.git <YOUR_PROJECT_NAME>

cd <YOUR_PROJECT_NAME>
git clone git@github.com:richardevcom/unknown-coming-soon.git
```

Or else simply download boilerplate's zip file from [this link](https://github.com/salttechno/tailwindcss-boilerplate).
2. Install the dependencies:
Open dir:
```bash
cd unknown-coming-soon
```
NPM
```bash
# if you are using npm
npm install
# OR if you are using Yarn
```
Yarn
```
yarn
```

3. Start the development server:
NPM dev server
```bash
# if you are using npm
npm run dev
# OR if you are using Yarn
yarn run dev
```
Yarn dev server
```
yarn dev
```

Now you should be able to see the project running at [localhost:3000](http://localhost:3000).

4. Open `./index.html` in your editor (VS Code recommended) and start editing!
## Optimizing for production
Tailwind CSS output needs to be optimized for the production use. The development version for the CSS file is almost 4MB which is not good for production websites. [Read this for more details](https://tailwindcss.com/docs/optimizing-for-production). This boilerplate **helps you generate the production version** of your CSS file easily & quickly.
We have configured `purge` option for PostCSS & Tailwind CSS. To build optimized version of your custom CSS, simply run:
```bash
# if you are using npm
npm run build
# OR if you are using Yarn
yarn run build
```
For optimizing your images, simply run:
```bash
# if you are using npm
npm run build-images
4. Build minified CSS:
NPM build css
```bash
npm run build
```
Yarn build css
```
yarn build
```

# OR if you are using Yarn
yarn run build-images
```
5. Build optimized images:
NPM build images
```bash
npm run build-images
```
Yarn build images
```
yarn build-images
```

0 comments on commit 0e11d1a

Please sign in to comment.