Working base boilerplate

Author: a7ul

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+dist/
+*.log

README.md

@@ -0,0 +1,10 @@
+# Dependencies:
+
+- @nodegui/nodegui
+- @nodegui/react-desktop
+- react
+
+# DevDependencies:
+
+- @nodegui/qode
+- typescript

package.json

@@ -0,0 +1,21 @@
+{
+  "name": "react-desktop-test",
+  "version": "1.0.0",
+  "main": "index.js",
+  "author": "Atul R <[email protected]>",
+  "license": "MIT",
+  "private": true,
+  "scripts": {
+    "dev": "tsc && qode ./dist/index.js"
+  },
+  "dependencies": {
+    "@nodegui/nodegui": "^0.0.5-alpha",
+    "@nodegui/react-desktop": "^0.0.5-alpha",
+    "@nodegui/test": "^0.0.10",
+    "react": "^16.8.6"
+  },
+  "devDependencies": {
+    "@types/react": "^16.8.23",
+    "typescript": "^3.5.3"
+  }
+}

src/index.tsx

@@ -0,0 +1,41 @@
+import { Renderer, View, Text, Button, Window } from "@nodegui/react-desktop";
+import React, { useState, useMemo } from "react";
+import { QPushButtonEvents } from "@nodegui/nodegui";
+
+const App = () => {
+  const [time, setTime] = useState(`${new Date()}`);
+  const buttonEventHandlers = useMemo(
+    () => ({
+      [QPushButtonEvents.clicked]: () => setTime(`${new Date()}`)
+    }),
+    []
+  );
+  return (
+    <Window styleSheet={styleSheet}>
+      <View id="container">
+        <Button text="Update Time" on={buttonEventHandlers} />
+        <Text id="result">{time}</Text>
+      </View>
+    </Window>
+  );
+};
+
+const styleSheet = `
+  #container {
+    qproperty-flex: 1;
+    qproperty-flexDirection: column;
+    qproperty-minHeight: '100%';
+    qproperty-alignItems: 'center';
+    qproperty-justifyContent: 'center';
+  }
+  #opBtn {
+    font-size: 20px;
+  }
+  #result {
+    font-size: 12px;
+    qproperty-flex: 1;
+    color: cyan;
+  }
+`;
+
+Renderer.render(<App />, () => {});

tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "incremental": true,
+    "target": "es2016",
+    "module": "commonjs",
+    "allowJs": true,
+    "checkJs": false,
+    "jsx": "react",
+    "outDir": "./dist",
+    "strict": true,
+    "alwaysStrict": true,
+    "moduleResolution": "node",
+    "esModuleInterop": true
+  }
+}