Jekyll starter styled with Tailwind CSS
The Jekyll Starter Tailwind is a starter kit that integrates the Tailwind CSS framework with Jekyll, a static site generator. It provides a barebones Jekyll starter theme and a Gulpfile with various functionalities such as compiling Tailwind CSS, stripping out unused CSS, running Autoprefixer, minifying CSS, compiling Jekyll, and running Browsersync for local development. This combination allows for rapid development of custom user interfaces.
To get started with Jekyll Starter Tailwind, follow these steps:
Ensure that you have the following dependencies installed:
Run the following command to install the required Ruby gems:
bundle install
Install the npm packages listed in the package-lock.json file using the following command:
npm ci
To compile the site with development settings and run Browsersync for local development, use one of the following commands:
For development settings:
npm run start
For production settings:
npm run dev
Build your site using the following commands:
For development settings:
npm run build:dev
For production settings:
npm run build:production
To deploy the site to Netlify, use the provided netlify.toml file. By default, Netlify uses jekyll build
as the build command, but the netlify.toml file will override it to use npm run build
.
Jekyll Starter Tailwind is a convenient starter kit for developers who want to combine the power of Jekyll and the flexibility of Tailwind CSS. With the inclusion of a barebones Jekyll starter theme and a Gulpfile for automated tasks, it simplifies the process of building custom user interfaces. The integration of Browsersync allows for efficient local development, and the provided installation guide ensures a smooth setup process. Overall, Jekyll Starter Tailwind is a valuable resource for creating static websites with a responsive and customizable design.