Jigsaw Tailwindcss

Overview

The Jigsaw + Tailwind CSS Starter Kit is a ready-to-use package that combines the Jigsaw static site generator with the Tailwind CSS framework. It provides a convenient starting point for building static websites using modern tooling and a utility-first CSS approach.

Features

• Netlify Status: Get live updates on the status of your Netlify deployment.
• Webpack + Laravel Mix build system: Automate the build process for your site using Webpack and Laravel Mix.
• tailwind.config.js file: Customize the configuration of Tailwind CSS by editing the tailwind.config.js file.
• laravel-mix-purgecss: Remove unused Tailwind CSS classes from your build using the laravel-mix-purgecss plugin.
• PostCSS: Use PostCSS instead of Sass for faster build times and fewer dependencies.
• @applying Tailwind CSS classes: Easily style Markdown content by applying Tailwind CSS classes.
• Blade extensions: Customize the Blade templating system by adding your own Blade extensions.

Installation

To install the Jigsaw + Tailwind CSS Starter Kit, follow these steps:

1. Clone the repository.
2. Navigate to the folder in your command line interface.
3. Install PHP dependencies using Composer.
4. Install JS dependencies using Node.js and NPM.
5. Run the dev script to build the site.
6. Alternatively, you can use BrowserSync for live reloading by running the watch script instead.
7. By default, unused CSS will be purged only in production mode (npm run production), but this can be configured.

Summary

The Jigsaw + Tailwind CSS Starter Kit combines the power of the Jigsaw static site generator with the flexibility of the Tailwind CSS framework. It provides a convenient starting point for building static websites with modern tooling and a utility-first CSS approach. With features such as Netlify Status, Webpack + Laravel Mix build system, and customizable configuration options, this starter kit offers developers a streamlined workflow for creating custom user interfaces.