Skip to content

Boilerplate code for creating an Electron desktop app simply using Reactjs and Typescript

License

Notifications You must be signed in to change notification settings

david-fernando/react-electron-ts

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Electron with TypeScript

License


Table of Contents

About

Easy-to-understand-and-use boilerplate code for creating an Electron desktop app simply using Reactjs and TypeScript. Includes React Router

How to use

  1. Clone this repository.
git clone https://github.com/david-fernando/react-electron-ts.git
  1. If you havent already, install Yarn globally.
npm install -g yarn
  1. Navigate into project root and install dependencies.
cd <your-project-name> && npm install
  1. Run dev server.
npm run start

Deploy to Desktop

  1. Run the build process
npm run build
  1. Go into your project folder using your file explorer. Navigate to the dist folder and open it. Then double-click <your-project-name> Setup 0.1.0. Your app should open and there should now be an icon on your desktop for this app.

Use a Custom Icon

Add a 256 x 256 .png or .ico image in your public folder. It should be either icon.ico or icon.png. Update the icon property in your package.json if necessary. Currently, it uses an image called icon.png, which is a graphic of a coffee cup. You'll only see this in production. For more info, see the electron-builder documentation