/electron-react-webpack-typescript-2021

Minimal boilerplate for writing Desktop Applications using Electron, React, Webpack, TypeScript in 2021

Primary LanguageJavaScript

Electron React Webpack Typescript - Boilerplate 2021 (ERWT)

Minimal boilerplate for writing Desktop Applications using Electron, React, Webpack & TypeScript.
This project makes use of latest packages and configurations to serve the best environment for development.

Screenshot


Core Features

  • ๐ŸŒŸ Electron
  • ๐ŸŒ€ TypeScript
  • โš›๏ธ React
  • ๐Ÿ›ถ LESS Loader
  • ๐ŸŽจ CSS Loader
  • ๐Ÿ“ธ Image Loader
  • ๐Ÿ†Ž Font Loader
  • ๐Ÿงน ESLint
  • ๐Ÿ“ฆ Electron Forge
  • ๐Ÿ”ฑ Webpack & Configuration
  • ๐Ÿงฉ Aliases for project paths
  • ๐Ÿ”ฅ Hot Module Replacement (Live Reload)
  • ๐ŸŽ Package Bundling (Distribution / Release)

Installation

To install the ERWT boilerplate you need to run following commands

Clone the repository :

git clone https://github.com/codesbiome/electron-react-webpack-typescript-2021 erwt
cd erwt

Install dependencies using Yarn or NPM :

yarn install

Start : Development

To develop and run your application, you need to run following command.
Start electron application for development :

yarn start

Lint : Development

To lint application source code using ESLint via this command :

yarn lint

Package : Production

Customize and package your Electron app with OS-specific bundles (.app, .exe etc)

yarn package

Make : Production

Making is a way of taking your packaged application and making platform specific distributables like DMG, EXE, or Flatpak files (amongst others).

yarn make

Publish : Production

Publishing is a way of taking the artifacts generated by the make command and sending them to a service somewhere for you to distribute or use as updates. (This could be your update server or an S3 bucket)

yarn publish

Packager & Makers Configuration

This provides an easy way of configuring your packaged application and making platform specific distributables like DMG, EXE, or Flatpak files.

This configurations file is available in :

tools/forge/forge.config.js

For further information, you can visit Electron Forge Configuration