💥A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

Related tags

Boilerplate gatsbyjs tailwind tailwindcss vite tailwind-css-template tailwindcss-ui laravel-tailwind basicapp tailwindui tailwind-boilerplate nextjs-tailwind reactjs-tailwindcss vue3-tailwind
Overview

cover

💥 new-tailwind-app

version license downloads workflows

A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

Note: If you are on Windows, make sure to either use Command Prompt or Windows Powershell to run the CLI.

🎯 Features

  • 💫 Generates basic tailwind app with HTML & CSS boilerplate code
  • 📦 Generates Next.js tailwind app
  • ⚡️ Generates React.js tailwind app
  • 🎩 Generates Gatsby.js tailwind app
  • 🚀 Generates Vue3 tailwind app
  • 💥 Generates Laravel tailwind app
  • 💻 Integrated Prettier in Next.js, React.js, Gatsby.js & Vue3 to easily format the code with npm run format

📦 Installation

# install the CLI globally
npm install -g new-tailwind-app

# use it with npx (recommended)
npx new-tailwind-app [app_name] --flag

🚀 Usage

Navigate to the folder you want to have your tailwind web app.

# help section
npx new-tailwind-app --help

# create a basic tailwind app
npx new-tailwind-app [app_name] --basic

# create a next.js tailwind app
npx new-tailwind-app [app_name] --next

# create a react.js tailwind app
npx new-tailwind-app [app_name] --react

# create a gatsby.js tailwind app
npx new-tailwind-app [app_name] --gatsby

# create a vue3 tailwind app
npx new-tailwind-app [app_name] --vue3

# create a laravel tailwind app
npx new-tailwind-app [app_name] --laravel

# if installed globally
new-tailwind-app [app_name] --flag

help section

🎩 Demo

# if you have installed globally
new-tailwind-app

creates tailwind app

# set up a basic tailwind app using npx
npx [email protected] [app_name] --basic

creates tailwind app

# sets up next.js tailwind app using npx
npx [email protected] [app_name] --react

creates next.js tailwind app

👨🏻‍💻 Contributing

Make sure you read the contributing guidelines before opening a PR. If you want something else to integrate with the CLI, open an issue in the repository and I will get back to it.

🔑 License & Conduct

Comments
  • 📦 NEW: prettier flag

    📦 NEW: prettier flag

    In this PR, I have removed the prettier integration with every new Tailwind CSS Next, React, Gatsby, and Vue3 app. Instead, I have added a --prettier flag to integrate prettier with the above mentioned frameworks.

    enhancement 
    opened by msaaddev 0
  • 👌 IMPROVE: code quality

    👌 IMPROVE: code quality

    In this PR, I have done the following:

    • [x] Improved Code quality
    • [x] Fixed outdating future dependency bug
    • [x] Added custom error message if the directory exists.
    bug enhancement 
    opened by msaaddev 0
  • Add support for Svelte

    Add support for Svelte

    I recently made the switch from React to Svelte and I'm loving it so far. There's a big shift going on right now to Svelte, and I think it'd be a huge plus to include support for Svelte in your project.

    opened by brandonmcconnell 0
  • Not able to create a new project

    Not able to create a new project

    Hi! Thanks for this tool but when I run npx new-tailwind-app my-tw-app --basic it gives me an error:

    Command line error

    How should I fix this? I have installed it globally.

    opened by Kvaibhav01 4
  • Add support for TypeScript in Web frameworks.

    Add support for TypeScript in Web frameworks.

    Currently, the tool only supports JavaScript with Next.js, React.js, Gatsby.js, and Vue3. We need to add support for TypeScript as well. So developers who like to work with TypeScript can also utilize this tool.

    enhancement 
    opened by msaaddev 0
  • fix error handling

    fix error handling

    Currently, I have implemented that if a folder already exists then it will let the user know. The bug is if the CLI breaks in the folder, the user does not get the appropriate error message and get's a msg that error: folder already exists.

    bug 
    opened by msaaddev 1
Releases(v1.5.1)

  • v1.5.1(Jul 19, 2021)

    • Removed previous behaviour of prettier integration with web frameworks
    • Added a prettier flag to let the user decide whether they want to have prettier set up or not (#21)
    • Improved documentation
    • Improved cover image
    • Improved contributing guidelines
    Source code(tar.gz)
    Source code(zip)

  • v1.4.5(Jun 26, 2021)

  • v1.4.3(Jun 25, 2021)

  • v1.4.0(Jun 25, 2021)

  • v1.3.0(Jun 24, 2021)

  • v1.1.0(Jun 20, 2021)

  • v1.0.1(Jun 20, 2021)

    • [x] Generates basic tailwind app boilerplate code
    • [x] Generates Next.js tailwind app boilerplate code
    • [x] Generates React.js tailwind app boilerplate code
    • [x] Generates Gatsby.js tailwind app boilerplate code
    • [x] Generates Vue3 tailwind app boilerplate code
    • [x] Generates Laravel tailwind app boilerplate code
    • [x] Prettier Integration in Next.js, Reacts.js, Gatsby.js and Vue.js app
    Source code(tar.gz)
    Source code(zip)
Owner
Saad Irfan ⚡️
Turning ideas into code...
Saad Irfan ⚡️
GitHub
Boilerplate to build Cross-Platform Apps with Expo and React Native

Boilerplate to build Cross-Platform Apps with Expo and React Native

José Ferrer 26 Apr 29, 2022
A CLI tool to clean out boilerplate code created by create-react-app

Clean React Clean React is a CLI tool that removes and modifies some of the boilerplate files and code that are being generated when initiating a new

Meike Hankewicz 1 Dec 23, 2022
hopify boilerplate for embedded apps. Built and re-written from the official Shopify CLI's app boilerplate

Shopify boilerplate for embedded apps. Built and re-written from the official Shopify CLI's app boilerplate, but moved it to Typescript, and more modularized, so you can use any frontend framework you want. I left it comes by default, with React.

Leonel Aimar 10 Dec 5, 2022
Boilerplate-tailwind - A simple boilerplate using NextJS, Typescript, Tailwind, Jest, Storybook and more

This is a Next.js boilerplate using TailwindCSS and other cool stuff. Most of th

React Avançado 26 Dec 4, 2022
A Foundation for Scalable Cross-Platform Apps

Electron React Boilerplate uses Electron, React, React Router, Webpack and React Fast Refresh. Install If you have installation or compilation issues

Electron React Boilerplate 20.7k Jan 7, 2023
Generates large React projects for use in benchmarking

React Benchmark Generator This script helps generate large files with custom React components for the purposes of benchmarking React/JavaScript toolin

multiprocess.io 5 Dec 11, 2022
Agrippa is a humble CLI, whose purpose is to assist React developers in creating components without the boilerplate.

Agrippa is a humble CLI, whose purpose is to assist React developers in creating components without the boilerplate. It can easily generate te

Nitzan Hen 556 Jan 1, 2023
Template for developing react app with structure inspired by Ignite CLI's react native boilerplate

React Template A react template heavily inspired by Ignite CLI's boilerplate for React Native, it uses a couple of generators with simple template cus

Ibrahim Elaradi 12 Aug 18, 2022
Template for developing react app with structure inspired by Ignite CLI's react native boilerplate

React Template A react template heavily inspired by Ignite CLI's boilerplate for React Native, it uses a couple of generators with simple template cus

Ibrahim Elaradi 12 Aug 18, 2022
CLI tool that makes react boilerplate component. Supports es6 or typescript, css or @emotion/styled, emmet-like syntax.

CLI tool that makes react boilerplate component. Supports es6 or typescript, css or @emotion/styled, emmet-like syntax.

Malakhov Mikhail 4 May 24, 2022
Palo-mern-boilerplate - A MERN stack (Mongo, Express, React, Node) boilerplate to get Palowans up and running quickly.

palo MERN boilerplate A MERN stack (Mongo, Express, React, Node) boilerplate to get Palowans up and running quickly. Commands: npm install # install b

Jim 10 Oct 31, 2022
A highly scalable boilerplate with pre added web3 and different wallets

NFT-Dapp-Boilerplate Start your next dapp / defi project in seconds A highly scalable boilerplate with pre added web3 and different wallets with a foc

Green Lettel 6 May 21, 2022
CLI based on Vite to generate your project easily

CLI based on Vite to generate your project easily

Phong Nguyen 6 Jul 5, 2022
Boilerplate for a Blog based on React.js, Node.js & Next.js

Boilerplate for a Blog based on React.js, Node.js & Next.js

OmiSoft 5 Nov 5, 2022
Boilerplate for a Blog based on React.js, Node.js & Next.js

OMISOFT BLOG EXAMPLE - ADMIN PANEL Here you can find a simple boilerplate for a Blog based on React.js & Next.js. We use this code in the project Sudo

OmiSoft 6 Nov 5, 2022
A universal boilerplate for building web applications w/ TypeScript, React, Redux, Server Side Rendering and more.

Vortigern Vortigern is our opinionated boilerplate for crafting universal web applications by using modern technologies like TypeScript, React and Red

Barbar Startup Factory 642 Dec 13, 2022
⚛️Preact-PWA - a boilerplate to build fast progressive web applications with Preact & Vitejs

⚛️ pheralb/preact-pwa is a boilerplate to build fast progressive web applications with Preact & Vitejs. ?? Demo - Cloudflare Pages. ?? Gett

Pablo Hdez 6 Oct 29, 2022
Creates a Module Federation applcation, API server, or library based on one of multiple different templates.

create-mf-app Creates a Module Federation applcation, API server, or library based on one of multiple different templates. npx create-mf-app These pr

Jack Herrington 392 Dec 30, 2022
An easy and straight forward full-stack web application boilerplate using Node.js Express as backend and React as frontend.

An easy and straight forward full-stack web application boilerplate using Node.js Express as backend and React as frontend. All packages are structured as Yarn Workspaces and written in Typescript. In addition, the web application can be built as Docker image using a multi stage built supported Dockerfile.

null 23 Dec 16, 2022