Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/msaaddev/new-tailwind-app
💥 One stop shop for eliminating the grunt work of setting up a Tailwind Web App across multiple frameworks. Just type in `npx new-tailwind-app` in your terminal and set up everything instantly.
https://github.com/msaaddev/new-tailwind-app
basicapp gatsbyjs laravel-tailwind nextjs-tailwind react reactjs-tailwindcss tailwind tailwind-boilerplate tailwind-css-template tailwindcss tailwindcss-ui tailwindui vite vue3-tailwind
Last synced: 2 days ago
JSON representation
💥 One stop shop for eliminating the grunt work of setting up a Tailwind Web App across multiple frameworks. Just type in `npx new-tailwind-app` in your terminal and set up everything instantly.
- Host: GitHub
- URL: https://github.com/msaaddev/new-tailwind-app
- Owner: msaaddev
- License: mit
- Archived: true
- Created: 2021-06-10T15:29:40.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2021-09-03T16:09:10.000Z (over 3 years ago)
- Last Synced: 2025-01-15T14:21:52.268Z (7 days ago)
- Topics: basicapp, gatsbyjs, laravel-tailwind, nextjs-tailwind, react, reactjs-tailwindcss, tailwind, tailwind-boilerplate, tailwind-css-template, tailwindcss, tailwindcss-ui, tailwindui, vite, vue3-tailwind
- Language: JavaScript
- Homepage: https://twitter.com/msaaddev
- Size: 24.5 MB
- Stars: 251
- Watchers: 6
- Forks: 14
- Open Issues: 7
-
Metadata Files:
- Readme: readme.md
- Changelog: changelog.md
- Contributing: contributing.md
- License: license
- Code of conduct: code-of-conduct.md
Awesome Lists containing this project
- awesome-js-posts - new-tailwind-app: Set up a tailwind app with `npx new-tailwind-app`
- awesome-tailwindcss - new-tailwind-app - Creates React.js, Next.js, Gatsby.js, Vue3, Laravel, and basic Tailwind CSS apps. (Starters & Themes)
README
![cover](img/cover.jpg)
A zero-configuration cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.![separator](img/separate.jpeg)
- **Simple**: One command setup for all your Tailwind CSS web applications
- **Cross-platform**: Works on all available operating systems including Linux, macOS, and Windows
- **Support**: Five different web frameworks available with Tailwind CSS integration
- **Prettier**: Integrate prettier in Next.js, React.js, Gatsby.js & Vue3 with `--prettier` flag and then easily format the code with `npm run format`
- **MIT Licensed**: Free to use for personal and commercial use.
- **Featured**: new-tailwind-app has been featured in [CooperPress](https://cooperpress.com/) newsletters, i.e., [Node Weekly](https://nodeweekly.com/issues/397) and [JavaScript Weekly](https://javascriptweekly.com/issues/547) that is subscribed by half a million developers..>Note: If you are on Windows, make sure to either use Command Prompt or Windows Powershell to run the CLI.
## 🚀 Supported Frameworks & Libraries
- [Next.js](https://nextjs.org/)
- [React.js](https://reactjs.org/)
- [Gatsby.js](https://www.gatsbyjs.com/)
- [Vue3](https://v3.vuejs.org/)
- [Laravel](https://laravel.com/)>You can also generate simple HTML, CSS, and JavaScript application with Tailwind integration using new-tailwind-app.
## 📦 Installation
```sh
# 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.
```sh
# 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 next.js tailwind app with prettier
npx new-tailwind-app [app_name] --next --prettier# create a react.js tailwind app
npx new-tailwind-app [app_name] --react# create a react.js tailwind app with prettier
npx new-tailwind-app [app_name] --react --prettier# create a gatsby.js tailwind app
npx new-tailwind-app [app_name] --gatsby# create a gatsby.js tailwind app with prettier
npx new-tailwind-app [app_name] --gatsby --prettier# create a vue3 tailwind app
npx new-tailwind-app [app_name] --vue3# create a vue3 tailwind app with prettier
npx new-tailwind-app [app_name] --vue3 --prettier# create a laravel tailwind app
npx new-tailwind-app [app_name] --laravel# if installed globally
new-tailwind-app [app_name] --flag```
![help section](img/help.png)
## 🎩 Demo
```sh
# if you have installed globally
new-tailwind-app
```![creates tailwind app](img/usage-1.gif)
```sh
# set up a basic tailwind app using npx
npx new-tailwind-app@latest [app_name] --basic
```![creates tailwind app](img/usage-2.gif)
```sh
# sets up next.js tailwind app using npx
npx new-tailwind-app@latest [app_name] --react
```![creates next.js tailwind app](img/usage-3.gif)
## 👨🏻💻 Contributing
Make sure you read the [contributing guidelines](https://github.com/msaaddev/new-tailwind-app/blob/master/contributing.md) 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.
## ⚡️ Other Projects
I have curated a [detailed list](https://github.com/msaaddev/open-source) of all the open-source projects I have authored. Do take out a moment and take a look.
## 🔑 License & Conduct
- MIT © [Saad Irfan](https://github.com/msaaddev)
- [Code of Conduct](https://github.com/msaaddev/new-tailwind-app/blob/master/code-of-conduct.md)