This is a simple Electron, React.js, React-Router and Typescript setup based on the Electrate. It is designed to work without the need of a development server running in the background and typescript configurations.
To clone and run this repository you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:
# Clone this repository
git clone https://github.com/AienTech/electrongjs-react-typescript-boilerpalte my-app
# Go into the repository
cd my-app
# Install dependencies
npm installnpm run start
The tool of choice is Jest as used at Facebook. Create files with the extension *.test.js and they will be run through
npm run test
npm run releaseCheck the dist folder for the app
This template transpiles all *.ts files in src into standard JS (commonjs) to app. There it includes *.html and *.css together with the main.js start file. From then it runs and packages using gulp as run through npm.
there are 3 main files to lookout for:
main.ts: which creates the default electron windowpreferences.ts: which works as a local storage helper.src/index.tsx: which is the default react renderer setup.
Everything else happens inside src folder. you can restructure the folders as per your need. I'm just used to this one :)
I usually put my routes inside src/config/routes.ts. to define new routing schema, just edit the iRoute type inside src/config/routes and then routes in the same file. This can make it easy to import { routes } from 'path/to/config' and use your routes with react-router. (see src/components/app/app.tsx)
Thats what preferences.ts does. It defines a structure for the user preferences and has the simple functions to get and set these settings. In order to change the structure, just edit the type Settings inside preferences.ts and then, import { preferences } from "relative/path/to/main.ts".
The template is made available through the Creative Commons Licence.