{"id":24216700,"url":"https://github.com/frederiksen/angular-electron-boilerplate","last_synced_at":"2025-04-07T10:25:51.233Z","repository":{"id":37204228,"uuid":"198393354","full_name":"frederiksen/angular-electron-boilerplate","owner":"frederiksen","description":"Template for building modern and secure Electron apps","archived":false,"fork":false,"pushed_at":"2024-10-29T10:02:20.000Z","size":4259,"stargazers_count":59,"open_issues_count":38,"forks_count":27,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-03-31T08:12:10.978Z","etag":null,"topics":["angular","boilerplate","electron","typescript","webpack"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/frederiksen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-07-23T09:03:45.000Z","updated_at":"2025-02-27T21:23:58.000Z","dependencies_parsed_at":"2025-01-14T04:46:24.740Z","dependency_job_id":"29c3418c-50a1-4e54-ad71-2afd4241fca4","html_url":"https://github.com/frederiksen/angular-electron-boilerplate","commit_stats":null,"previous_names":[],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frederiksen%2Fangular-electron-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frederiksen%2Fangular-electron-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frederiksen%2Fangular-electron-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frederiksen%2Fangular-electron-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frederiksen","download_url":"https://codeload.github.com/frederiksen/angular-electron-boilerplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247633889,"owners_count":20970413,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","boilerplate","electron","typescript","webpack"],"created_at":"2025-01-14T04:46:17.848Z","updated_at":"2025-04-07T10:25:51.189Z","avatar_url":"https://github.com/frederiksen.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# angular-electron-boilerplate\n\nThis template provides a starting point of a modern and secure Electron app.\n\n## Screenshots\n![Screenshots](/images/modern-electron-screenshots.png)\n\n## Project gloals\n\nUse [Angular](https://angular.io/) for the Electron renderer process. Using a modern frontend framework helps you organize your codebase once your Electron app grows in complexity. Use the [Angular CLI](https://cli.angular.io/) to generate components, routes, services and pipes. To give a modern look-and-feel [Angular Material](https://material.angular.io/) is used. This can easily be removed if it is not needed.\n\nUse [TypeScript](https://www.typescriptlang.org/) for strongly-typed JavaScript.\n\nUse [webpack](https://webpack.js.org/) to pack *main* and *preload* to produce small fast build output. Everything is packed, so no need to include the */node_modules* folder, in order to remove unnessesary files and to produce small and fast builds.\n\nUse most secure Electron security settings: contextIsolation and disabled nodeIntegration and disabled enableRemoteModule. preload uses the contextBridge.\n\n## CI\n![CI](https://github.com/frederiksen/angular-electron-boilerplate/workflows/CI/badge.svg)\n\n[Builds](https://github.com/frederiksen/angular-electron-boilerplate/actions)\n\n## Getting started\n\nTry out this [template](https://github.blog/2019-06-06-generate-new-repositories-with-repository-templates/):\n\n```bash\n$ git clone https://github.com/frederiksen/angular-electron-boilerplate\n$ cd angular-electron-boilerplate\n$ npm install\n$ npm run build:dev:all\n$ npm start\n```\n\n## NPM scripts\n\n### Builds\n\nThis builds a project and places the output in the */dist* folder.\n\n| Command | Description |\n| --- | --- |\n| `npm run build:dev:all` | Developer builds of all projects |\n| `npm run build:prod:all` | Production builds of all projects |\n| `npm run build:dev:main` | Developer build of the *Electron main* project |\n| `npm run build:prod:main` | Production build of the *Electron main* project |\n| `npm run build:dev:renderer` | Developer build of the *Electron renderer* project |\n| `npm run build:prod:renderer` | Production build of the *Electron renderer* project |\n| `npm run build:dev:preload` | Developer build of the *Electron preload* project |\n| `npm run build:prod:preload` | Production build of the *Electron preload* project |\n\n### Watch\n\nStart watching for source code changes, and builds after each source code change.\n\n| Command | Description |\n| --- | --- |\n| `npm run build:watch:all` | Watch all projects |\n| `npm run build:watch:main` | Watch the *Electron main* project |\n| `npm run build:watch:renderer` | Watch the *Electron renderer* project |\n| `npm run build:watch:preload` | Watch the *Electron preload* project |\n\n### Tests\n\nTest commands.\n\n| Command | Description |\n| --- | --- |\n| `npm run test:test` | Executes all Angular unit-tests |\n| `npm run test:e2e` | Executes Angular end-2-end tests |\n| `npm run test:lint` | Angular lint |\n\n### Updates\n\nCommands for updating NPM modules.\n\n| Command | Description |\n| --- | --- |\n| `npm run update:angular` | Easy update to latest stable Angular |\n| `npm run update:electron` | Easy update to latest stable Electron |\n| `npm run update:webpack` | Easy update to latest stable WebPack |\n\n### Packaging\n\n| Command | Description |\n| --- | --- |\n| `npm run package` | Package current */dist* folder into an app in the */release-builds* folder |\n| `npm run release` | First build a production build, then package */dist* folder into an app in the */release-builds* folder |\n\n## Debugging\n\n![Screenshots](/images/debug-electron-main-renderer.PNG)\n\nUse [Code](https://code.visualstudio.com/) to get a super debug environment.\n\nThis extension is needed: [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome)\n\nFirst be sure to have build everything:\n\n```bash\n$ npm run build:dev:all\n```\n\nNow set some breakpoints both in the main source code and in the renderer source code.\n\nFrom Code press **Ctrl+Shift+D** and select **Main + Renderer** and press **F5**\n\n## Packaging into an app\n\nThis is where all the magic happens.\n\n```bash\n$ npm run release\n```\n\nThen your app will be put into the */release-builds* folder. Can build an app for Windows, macOS and Linux.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrederiksen%2Fangular-electron-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrederiksen%2Fangular-electron-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrederiksen%2Fangular-electron-boilerplate/lists"}