after8 / gatsby-material-ui

Starter based on Gatsby's default starter with Material UI integration

Starter based on Gatsby's default starter with Material UI integration

What's this?

This is the gatsby default starter with material ui integration.

There is also tests added with jest, as well as eslint and prettier are configured.

ESLint/Prettier Integration

Install Visual Studio Code Extension:

• Prettier - Code formatter
• ESLint

Visual Studio Code Settings

{
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "[javascript]": {
        "editor.insertSpaces": true,
        "editor.detectIndentation": false,
        "editor.useTabStops": false,
        "editor.defaultFormatter": "esbenp.prettier-vscode",
        "editor.formatOnSave": false
    },
    "[javascriptreact]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode",
        "editor.formatOnSave": false
    },
    "eslint.format.enable": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
    ]
}

How to use

1. Start developing.

   Clone or Download this project, navigate into your new site’s directory and start it up.

   cd my-default-starter/
   gatsby develop

2. 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.

   Open the my-default-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!