{"id":13764472,"url":"https://github.com/fable-compiler/fable-elmish-electron-material-ui-demo","last_synced_at":"2025-04-26T17:31:19.707Z","repository":{"id":37097720,"uuid":"158446973","full_name":"fable-compiler/fable-elmish-electron-material-ui-demo","owner":"fable-compiler","description":"Complete boilerplate for Electron apps using Fable and Elmish with hot module reloading, time-travel debugging, etc.","archived":false,"fork":false,"pushed_at":"2024-10-13T09:03:33.000Z","size":3594,"stargazers_count":112,"open_issues_count":4,"forks_count":19,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-04-12T08:03:32.509Z","etag":null,"topics":["boilerplate","electron","electron-app","electron-builder","electron-webpack","elmish","fable","fable-elmish","fable2","material-ui","sample","template"],"latest_commit_sha":null,"homepage":"","language":"F#","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/fable-compiler.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":"2018-11-20T20:24:32.000Z","updated_at":"2025-03-02T10:07:34.000Z","dependencies_parsed_at":"2024-01-10T09:47:32.261Z","dependency_job_id":"3b047b36-ff1a-4faa-a6b6-12838527553e","html_url":"https://github.com/fable-compiler/fable-elmish-electron-material-ui-demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fable-compiler%2Ffable-elmish-electron-material-ui-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fable-compiler%2Ffable-elmish-electron-material-ui-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fable-compiler%2Ffable-elmish-electron-material-ui-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fable-compiler%2Ffable-elmish-electron-material-ui-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fable-compiler","download_url":"https://codeload.github.com/fable-compiler/fable-elmish-electron-material-ui-demo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250730364,"owners_count":21477754,"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":["boilerplate","electron","electron-app","electron-builder","electron-webpack","elmish","fable","fable-elmish","fable2","material-ui","sample","template"],"created_at":"2024-08-03T16:00:21.179Z","updated_at":"2025-04-26T17:31:19.382Z","avatar_url":"https://github.com/fable-compiler.png","language":"F#","funding_links":[],"categories":["Examples"],"sub_categories":[],"readme":"# Fable-Elmish-Electron-Material-UI demo [![Build status](https://ci.appveyor.com/api/projects/status/hm2w65e3enahp55g/branch/master?svg=true)](https://ci.appveyor.com/project/cmeeren/fable-elmish-electron-material-ui-demo/branch/master)\n\nThis is an example of an F# Electron app centered around Fable 2 and Elmish. The actual app contents (which you can easily replace to build your own Electron app) are intended to show how to use Material-UI (including JSS/style-as-code) as well as serve as examples of how to implement some (not always trivial) UX patterns in Elmish.\n\nTo use the demo for scaffolding your own Fable/Elmish/Electron apps, simply clone the repo and start hackin' on the `Renderer` project to get started (details below).\n\nFeatures/stack:\n* Hot module reloading for both code and styles\n* Time-travel debugging (using Redux DevTools, RemoteDev, and Fable.Elmish.Debugger)\n* Single-command development and packaging with FAKE\n* [electron-webpack](https://webpack.electron.build/) takes care of most of the webpack config\n* [electron-builder](https://www.electron.build/) packages the app (see their documentation for how to customize)\n* [electron-window-state](https://github.com/mawie81/electron-window-state/) for remembering window state between launches\n* [Devtron](https://electronjs.org/devtron) for Electron-specific debugging/linting\n\nStuff demoed:\n\n* Autocomplete\n* Badges\n* Dialogs\n* Saving/loading files\n* Selects (dropdowns)\n* Snackbars\n* Static assets (images etc.)\n* Text fields / input validation\n\n### Hot module reloading in action\n\n![Animation showing hot module reloading](readme-hmr.gif)\n\n### Time-travel debugging in action\n\n![Animation showing time-travel debugging](readme-ttd.gif)\n\n\n## Requirements\n\n* .NET Core SDK 3.0\n* Node (for `npm`)\n\n\n## How to develop\n\nThis project uses .NET Core 3 local tools. Therefore, run `dotnet tool restore` to restore the necessary CLI tools before doing anything else.\n\nThen, to run the app locally in \"live mode\":\n\n`dotnet fake build -t Dev`\n\n(`Dev` is the default target, so you can also just run `dotnet fake build`.)\n\nAfter the app starts, edit the renderer project in `/src/Renderer` and see the changes appear in real-time thanks to hot module reloading.\n\nPlace static files in the root `/static` folder as required by electron-webpack. See the code for the “Static assets” page (and the helpers in `Utils.fs`) to see how to use them.\n\n\n### Release build to unpacked directory\n\n`dotnet fake build -t DistDir`\n\n\n### Release build to packed installer\n\n`dotnet fake build -t Dist`\n\n\n### NuGet package management\n\nUse `dotnet paket` (after running `dotnet tool restore`).\n\n## Improvements welcome!\n\nIf you see anything here that looks wrong, suboptimal or just weird, you may very well be right. Don't be shy about opening an issue or PR.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffable-compiler%2Ffable-elmish-electron-material-ui-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffable-compiler%2Ffable-elmish-electron-material-ui-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffable-compiler%2Ffable-elmish-electron-material-ui-demo/lists"}