diff --git a/README.md b/README.md index f855170..74ca2e3 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,28 @@ -# React Desktop Starter +# react-desktop-starter -To run: +**Clone and run for a quick way to see NodeGUI React Desktop in action.** -`npm install` +## To Use -`npm start` +To clone and run this repository you'll need [Git](https://git-scm.com) and [Node.js](https://nodejs.org/en/download/) (which comes with [npm](http://npmjs.com)) installed on your computer. From your command line: + +```bash +# Clone this repository +git clone https://github.com/nodegui/react-desktop-starter +# Go into the repository +cd react-desktop-starter +# Install dependencies +npm install +# Run the app +npm start +``` + +Note: If you're using Linux Bash for Windows, [see this guide](https://www.howtogeek.com/261575/how-to-run-graphical-linux-desktop-applications-from-windows-10s-bash-shell/) or use `node` from the command prompt. + +## Resources for Learning NodeGUI/React Desktop + +- [nodegui.github.io/nodegui](https://nodegui.github.io/nodegui) - all of NodeGui and React Desktop's documentation + +## License + +MIT diff --git a/assets/sample.jpg b/assets/sample.jpg new file mode 100644 index 0000000..0eba6f7 Binary files /dev/null and b/assets/sample.jpg differ diff --git a/package-lock.json b/package-lock.json index 2decbf4..67407dc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5,9 +5,9 @@ "requires": true, "dependencies": { "@nodegui/nodegui": { - "version": "0.0.12", - "resolved": "https://registry.npmjs.org/@nodegui/nodegui/-/nodegui-0.0.12.tgz", - "integrity": "sha512-tfms3FzX8jDY3jxwCNuxFGkYkjonn3menLaS9bxYa3i0ye+XEyc3OyJdDS00UqcT2yLfDFTuq9A90JG09Y6o3A==", + "version": "0.0.13", + "resolved": "https://registry.npmjs.org/@nodegui/nodegui/-/nodegui-0.0.13.tgz", + "integrity": "sha512-gXk1TM76fAKHfEp1nfg0kQoxEdAx1R65jKr+b577ln8Z4/Pnj8MpjKU09sG/n/XQ+T33Hn5GRmMK1ELEqJ1KnA==", "requires": { "@nodegui/test": "^0.0.10", "bindings": "^1.5.0", @@ -18,9 +18,9 @@ } }, "@nodegui/react-desktop": { - "version": "0.0.6", - "resolved": "https://registry.npmjs.org/@nodegui/react-desktop/-/react-desktop-0.0.6.tgz", - "integrity": "sha512-WNcYh0T7OpmanbvwWppPNpe7XCE0ZyNy+cxMfZMpKB3MY60gNL1V6slHpVJO1/PHRmgQlBsl8dYjQsh0t6hePA==", + "version": "0.0.7", + "resolved": "https://registry.npmjs.org/@nodegui/react-desktop/-/react-desktop-0.0.7.tgz", + "integrity": "sha512-GqF2r+WV1oMNZWSdntglo8WUgyh8cdy6t+5x5asUv5pOuZXxOuwK/cfNWG2r/F3xInYfaddCds0dxOy72SRkcA==", "requires": { "react-reconciler": "^0.20.4" } diff --git a/package.json b/package.json index 927c7a1..4a4d20e 100644 --- a/package.json +++ b/package.json @@ -9,9 +9,9 @@ "start": "tsc && qode ./dist/index.js" }, "dependencies": { - "@nodegui/nodegui": "^0.0.12", - "@nodegui/react-desktop": "0.0.6", - "react": "^16.8.6" + "@nodegui/nodegui": "0.0.13", + "@nodegui/react-desktop": "0.0.7", + "react": "^16.9.0" }, "devDependencies": { "@types/node": "^12.6.8", diff --git a/src/index.tsx b/src/index.tsx index f32e221..610c762 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,24 +1,44 @@ -import { Renderer, View, Text, Button, Window } from "@nodegui/react-desktop"; +import { + Renderer, + View, + Text, + Button, + Window, + Image, + useEventHandler +} from "@nodegui/react-desktop"; import React, { useState } from "react"; +import path from "path"; +import { AspectRatioMode } from "@nodegui/nodegui"; +const imageUrl = path.resolve(__dirname, "../assets/sample.jpg"); +const fixedSize = { width: 500, height: 500 }; const App = () => { const [time, setTime] = useState(new Date()); + const btnHandler = useEventHandler( + { clicked: () => setTime(new Date()) }, + [] + ); return ( - + -