Overview
electron-react-typescript is a boilerplate that provides an easy start with TypeScript, React, and Electron. It is an Electron application boilerplate based on React, Redux, and Webpack, created for rapid application development using TypeScript.
Features
- TypeScript: Allows for type-checking and provides better code readability and maintainability.
- React: A popular JavaScript library for building user interfaces.
- Electron: A framework for building cross-platform desktop applications.
- Redux: A predictable state container for JavaScript applications.
- Webpack: A module bundler that helps package applications.
- Jest: A JavaScript testing framework for React applications.
Installation
To install electron-react-typescript, follow these steps:
- Clone the repository with Git:
git clone <repository-url>
- Install the dependencies by running the following command:
npm install
Usage
To use electron-react-typescript, follow these steps:
- Start both processes simultaneously in different console tabs:
npm run start
- This will start the application with hot-reload, allowing you to instantly start developing your application.
Alternatively, you can start both processes in a single process by running the following command:
npm run start-singe-process
Packaging
electron-react-typescript uses Electron Builder to build and package the application. By default, you can run the following command to package for your current platform:
npm run package
This will create an installer for your platform in the “releases” folder.
You can also make builds for specific platforms or multiple platforms by using the options found in the project’s documentation. For example, to build for all platforms (Windows, Mac, Linux), you can use the following command:
npm run package-all
Husky and Prettier
This project comes with both Husky and Prettier set up to ensure a consistent code style. To change the code style, you can modify the configuration in the .prettierrc file.
If you want to remove Husky and Prettier from the project, you can follow these steps:
- Remove the “precommit” command from the scripts section in
package.json. - Remove the “lint-staged” section from
package.json. - Remove “lint-staged”, “prettier”, “eslint-config-prettier”, and “husky” from the
devDependenciessection inpackage.json. - Remove all mentions of Prettier from the “extends” section in
.eslintrc.json.
Summary
electron-react-typescript is a boilerplate that provides an easy start for developing desktop applications using TypeScript, React, and Electron. It offers features such as hot-reloading, packaging for different platforms, and consistent code style enforcement. It is based on the Electron React Boilerplate project and React Redux TypeScript guide and is available under the MIT license.