feat(landing): add ghatsby w typescript

packages/poolbase-landing/.eslintrc.js

@@ -0,0 +1,37 @@
+module.exports = {
+  parser: `@typescript-eslint/parser`,
+  extends: [
+    "plugin:@typescript-eslint/recommended",
+    "plugin:prettier/recommended",
+    "prettier/@typescript-eslint",
+  ],
+  plugins: ["@typescript-eslint", "prettier"],
+  parserOptions: {
+    ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
+    sourceType: "module", // Allows for the use of imports
+  },
+  env: {
+    browser: true,
+    node: true,
+  },
+  rules: {
+    quotes: "off",
+    "@typescript-eslint/quotes": [
+      2,
+      "backtick",
+      {
+        avoidEscape: true,
+      },
+    ],
+    indent: ["error", 2, { SwitchCase: 1 }],
+    "prettier/prettier": [
+      "error",
+      {
+        trailingComma: "es5",
+        semi: false,
+        singleQuote: false,
+        printWidth: 120,
+      },
+    ],
+  },
+}

packages/poolbase-landing/.gitignore

@@ -63,3 +63,5 @@ node_modules/
 
 # dotenv environment variables file
 .env
+
+public

packages/poolbase-landing/gatsby-config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  siteMetadata: {
+    siteName: `Poolbase`,
+  },
+  plugins: [`gatsby-plugin-typescript`],
+}

packages/poolbase-landing/package.json

@@ -4,7 +4,12 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "build": "cpx \"src/public/**/*.*\" \"../../dist/landing/public\" -C",
+    "start": "gatsby develop",
+    "develop": "gatsby develop",
+    "build": "gatsby build",
+    "postbuild": "cpx \"public/**/*.*\" \"../../dist/landing/public\" -C",
+    "type-check": "tsc --noEmit",
+    "lint": "eslint . --ignore-path .gitignore --ext .ts,.tsx,.js",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "release": {
@@ -38,5 +43,11 @@
   },
   "keywords": [],
   "author": "Andreas Adam <andreas.sahle@gmail.com> (https://pixelmord.de/)",
-  "license": "MIT"
+  "license": "MIT",
+  "dependencies": {
+    "gatsby": "^2.20.29",
+    "gatsby-plugin-typescript": "^2.3.3",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
+  }
 }

packages/poolbase-landing/src/components/layout.tsx

@@ -0,0 +1,5 @@
+import * as React from "react"
+
+const MainLayout: React.FC = ({ children }) => <div>{children}</div>
+
+export default MainLayout

packages/poolbase-landing/src/declarations.d.ts

@@ -0,0 +1,8 @@
+// This file is used to hold ambient type declarations, as well as type shims
+// for npm module without type declarations, and assets files.
+
+// For example, to shim modules without declarations, use:
+// declare module "package-without-declarations"
+
+// And to shim assets, use (one file extension per `declare`):
+// declare module "*.png"

packages/poolbase-landing/src/pages/404.tsx

@@ -0,0 +1,9 @@
+import * as React from "react"
+import Layout from "../components/layout"
+
+export default () => (
+  <Layout>
+    <h1>You are here!</h1>
+    <h2>But nothing found for you #404</h2>
+  </Layout>
+)

packages/poolbase-landing/src/pages/index.tsx

@@ -0,0 +1,40 @@
+import { graphql } from "gatsby"
+import * as React from "react"
+import Layout from "../components/layout"
+
+// Please note that you can use https://github.com/dotansimha/graphql-code-generator
+// to generate all types from graphQL schema
+interface IndexPageProps {
+  data: {
+    site: {
+      siteMetadata: {
+        siteName: string
+      }
+    }
+  }
+}
+
+export const pageQuery = graphql`
+  query IndexQuery {
+    site {
+      siteMetadata {
+        siteName
+      }
+    }
+  }
+`
+
+export default class IndexPage extends React.Component<IndexPageProps> {
+  readonly hello = `Hello`
+  public render() {
+    const { siteName } = this.props.data.site.siteMetadata
+    return (
+      <Layout>
+        <h1>{this.hello}!</h1>
+        <p>
+          This site is named <strong>{siteName}</strong>
+        </p>
+      </Layout>
+    )
+  }
+}

packages/poolbase-landing/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "include": ["./src/**/*"],
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "commonjs",
+    "lib": ["dom", "es2017"],
+    // "allowJs": true,
+    // "checkJs": true,
+    "jsx": "react",
+    "strict": true,
+    "esModuleInterop": true,
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
+    "noEmit": true,
+    "skipLibCheck": true
+  }
+}