gatsby-tailwind-sass-gatsby-starter Tailwind Templates

Gatsby Tailwind Sass Gatsby Starter

basic installation of gatsby frameword with tailwind and sass preprocessor ready for use

Gatsby's hello-world starter with tailwind and sass preprocessor

This starter ships with the main Gatsby configuration files, sass and tailwind to get a ready to go website with React and tailwind.

Quick start

** Installation **

clone the git repo:
  # clones repo
  git clone https://github.com/mrDevIll/gatsby-tailwind-sass-installer.git 
  cd gatsby-tailwind-sass-installer
 # installs gatsby and tailwind and sass dependencies 
 npm install
 ```
 # or use yarn

  ```shell
 # installs gatsby and tailwind and sass dependencies 
 yarn install

** Start developing. **

Navigate into your new site’s directory and start it up.

```shell
cd gatsby-tailwind-sass-installer/
gatsby develop
```

** Open the source code and start editing! **

Your site is now running at `http://localhost:8000`!

_Note: You'll also see a second link: _`http://localhost:8000/___graphql`_. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the [Gatsby tutorial](https://www.gatsbyjs.com/tutorial/part-five/#introducing-graphiql)._

Open the `my-hello-world-starter` directory in your code editor of choice and edit `src/pages/index.js`. Save your changes and the browser will update in real time!

Usage

 In  """ css/style.scss """ you can add your sass customer code while """ css/tailwind.css """ imports tailwind in your project.
 If you wish to import your sass files please add them to """ gatsby-browser.js """.

 You can use """ tailwind.config.js """ to modify tailwind configuration.

 I added a layout component with a header, footer and layout.   

Deploy

Deploy to Netlify

Deploy with Vercel

Top categories

Loading Svelte Themes