(taken from secure-electron-template because I'm lazy)
A current electron app template configured for use with Angular, designed and built with security in mind. (If you are curious about what makes an electron app secure, please check out this page).
To get started, clone the repository by clicking the button, or through the command line (git clone https://github.com/corybsa/secure-electron-angular-template.git
).
Once cloned, install the dependencies for the repo by running the following commands (you do not have to run the first command if your command line is already inside the newly cloned repository):
cd secure-electron-angular-template
npm i
To run the app in development mode, run the following command:
npm run start
When you'd like to test your app in production, you can run the following command:
npm run start-prod
Or to package it for distribution just run the following command:
npm run package
and you can find your packaged app in the dist
folder!
Taken from the best-practices official page, here is what this repository offers!
- Only load secure content - ✅ (But the developer is responsible for loading secure assets only 🙂)
- Do not enable Node.js integration for remote content - ✅
- Enable Context Isolation - ✅
- Enable process sandboxing - ✅
- Handle session permission requests from remote content - ✅
- Do not disable webSecurity - ✅
- Define a Content Security Policy - ✅
- Do not enable allowRunningInsecureContent - ✅
- Do not enable experimental features - ✅
- Do not use enableBlinkFeatures - ✅
- Do not use allowpopups for WebViews - ✅
- Verify WebView options before creation - ✅
- Disable or limit navigation - ✅
- Disable or limit creation of new windows - ✅
- Do not use shell.openExternal with untrusted content - ✅
- Use a current version of Electron - ✅
- Validate the sender of all IPC messages - ✅
- Some built-in utility functions to help you out - ✅
Built-in to this template are a number of popular frameworks already wired up to get you on the road running.
- Electron
- Angular
- Angular Material (with custom theme, including dark mode)
- Typescript
- NgRx
- Redux DevTools
- Electron builder (for packaging up your app)
- Jasmine
For a more detailed view of the architecture of the template, please check out here. I would highly recommend reading this document to get yourself familiarized with this template.
- Replace any instances of
secure-electron-angular-template
with the name of your app
- Change
name
to your app's name - Change
author.name
to your name - Change
description
to your app's description - Change
build.appId
to your app's name - Change
build.productName
to your app's name - Change
build.executableName
to your app's name - Change
build.mac.category
to your app's category (idk what this is, I don't develop for mac)
- The
DIST_PATH
MUST match thename
inangular.json
- The
scheme
inelectron/protocol
- Change the
<title>
of your app insrc/index.html
- Change instances of
$secure-electron-angular
to your app's name insrc/assets/styles/theme.scss
if you care. This is just the name of the theme in code and is not user-facing, so it doesn't really matter. - Change the
title
of your app insrc/app/app.component.ts
- The contents of
src/app/app.component.html
NEW TO ELECTRON? Please visit reZach's page.