|
| 1 | +# Gatsby Starter Tailwind |
| 2 | + |
| 3 | +[](#contributors) |
| 4 | + |
| 5 | +<div align="center"> |
| 6 | + <img src="https://image.ibb.co/cJjPN7/gatsby_tailwind.png" alt="Gatsby and Tailwind CSS logos"> |
| 7 | +</div> |
| 8 | + |
| 9 | +<div align="center"> |
| 10 | + <strong>A <a href="https://www.gatsbyjs.org/">Gatsby</a> starter styled using <a href="https://tailwindcss.com/">Tailwind CSS</a>, a utility-first CSS framework.</strong><br /> |
| 11 | + Uses <a href="https://www.purgecss.com/">PurgeCSS</a> to remove unused CSS.<br /> |
| 12 | + Illustrations by <a href="https://undraw.co/">unDraw</a>. |
| 13 | + <br /> |
| 14 | + <br /> |
| 15 | +</div> |
| 16 | + |
| 17 | + |
| 18 | + |
| 19 | +<p align="center">View demo <a href="https://gatsby-starter-tailwind.oddstronaut.com/">here</a>.</p> |
| 20 | + |
| 21 | +## What is Tailwind CSS? |
| 22 | + |
| 23 | +> "Tailwind CSS is a utility-first CSS framework for rapidly building custom user interfaces." |
| 24 | +> –[Tailwind CSS](https://tailwindcss.com) |
| 25 | +
|
| 26 | +## What is Gatsby? |
| 27 | + |
| 28 | +> "Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and apps." -[Gatsby](https://www.gatsbyjs.org/) |
| 29 | +
|
| 30 | +## Get started |
| 31 | + |
| 32 | +Install the Gatsby CLI: |
| 33 | + |
| 34 | +```sh |
| 35 | +npm i --global gatsby-cli |
| 36 | +``` |
| 37 | + |
| 38 | +Create a new Gatsby project using this starter: |
| 39 | + |
| 40 | +```sh |
| 41 | +gatsby new my-new-website https://github.com/taylorbryant/gatsby-starter-tailwind |
| 42 | +``` |
| 43 | + |
| 44 | +Build a stylesheet from your Tailwind CSS config and run the project in development mode: |
| 45 | + |
| 46 | +```sh |
| 47 | +cd my-new-website |
| 48 | +npm run develop |
| 49 | +``` |
| 50 | + |
| 51 | +## Format and lint |
| 52 | + |
| 53 | +- `npm run analyze` - See what ESLint and Prettier can fix |
| 54 | +- `npm run fix` - Run Prettier and ESLint with the `--fix` option |
| 55 | + |
| 56 | +## Build your site |
| 57 | + |
| 58 | +Use `npm run build` to build your site for production. |
| 59 | + |
| 60 | +## Deployment |
| 61 | + |
| 62 | +### Netlify |
| 63 | + |
| 64 | +[](https://app.netlify.com/start/deploy?repository=https://github.com/taylorbryant/gatsby-starter-tailwind) |
| 65 | + |
| 66 | +## Resources |
| 67 | + |
| 68 | +- [Gatsby documentation](https://www.gatsbyjs.org/docs/) |
| 69 | +- [Tailwind documentation](https://tailwindcss.com/docs/what-is-tailwind/) |
| 70 | +- [Prettier documentation](https://prettier.io/docs/en/index.html) |
| 71 | +- [ESLint documentation](https://eslint.org/docs/user-guide/configuring) |
| 72 | + |
| 73 | +## License |
| 74 | + |
| 75 | +[MIT](https://github.com/taylorbryant/gatsby-starter-tailwind/blob/master/LICENSE.md) |
| 76 | + |
| 77 | +## How you can help |
| 78 | + |
| 79 | +Enjoying Gatsby Starter Tailwind and want to help? You can: |
| 80 | + |
| 81 | +- [Create an issue](https://github.com/taylorbryant/gatsby-starter-tailwind/issues/new) with some constructive criticism |
| 82 | +- [Submit a pull request](https://github.com/taylorbryant/gatsby-starter-tailwind/compare) with some improvements to the project |
| 83 | + |
| 84 | +## Contributors |
| 85 | + |
| 86 | +Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): |
| 87 | + |
| 88 | +<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --> |
| 89 | +<!-- prettier-ignore --> |
| 90 | +<table> |
| 91 | + <tr> |
| 92 | + <td align="center"><a href="http://impuls.dev"><img src="https://avatars3.githubusercontent.com/u/8146736?v=4" width="100px;" alt="impulse"/><br /><sub><b>impulse</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=impulse" title="Code">💻</a></td> |
| 93 | + <td align="center"><a href="https://gandreadis.com"><img src="https://avatars3.githubusercontent.com/u/5272244?v=4" width="100px;" alt="Georgios Andreadis"/><br /><sub><b>Georgios Andreadis</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=gandreadis" title="Code">💻</a></td> |
| 94 | + <td align="center"><a href="https://github.com/altruisticsoftware"><img src="https://avatars3.githubusercontent.com/u/12105346?v=4" width="100px;" alt="Chris"/><br /><sub><b>Chris</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=altruisticsoftware" title="Code">💻</a></td> |
| 95 | + <td align="center"><a href="https://github.com/dalwadani"><img src="https://avatars1.githubusercontent.com/u/4618082?v=4" width="100px;" alt="Dhaifallah Alwadani"/><br /><sub><b>Dhaifallah Alwadani</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=dalwadani" title="Code">💻</a></td> |
| 96 | + <td align="center"><a href="http://nigelball.org"><img src="https://avatars2.githubusercontent.com/u/815408?v=4" width="100px;" alt="Nigel Ball"/><br /><sub><b>Nigel Ball</b></sub></a><br /><a href="#ideas-nigelb135" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=nigelb135" title="Code">💻</a></td> |
| 97 | + <td align="center"><a href="https://github.com/monte-hayward"><img src="https://avatars3.githubusercontent.com/u/3780422?v=4" width="100px;" alt="Monte Hayward"/><br /><sub><b>Monte Hayward</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=monte-hayward" title="Code">💻</a></td> |
| 98 | + <td align="center"><a href="https://lukebennett.com.au"><img src="https://avatars0.githubusercontent.com/u/3422401?v=4" width="100px;" alt="Luke Bennett"/><br /><sub><b>Luke Bennett</b></sub></a><br /><a href="https://github.com/taylorbryant/gatsby-starter-tailwind/commits?author=lukebennett88" title="Code">💻</a></td> |
| 99 | + </tr> |
| 100 | +</table> |
| 101 | + |
| 102 | +<!-- ALL-CONTRIBUTORS-LIST:END --> |
| 103 | + |
| 104 | +This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! |
0 commit comments