{"id":13736604,"url":"https://github.com/aaronpowell/swa-elmish-template","last_synced_at":"2025-06-11T09:33:18.107Z","repository":{"id":138594883,"uuid":"383648165","full_name":"aaronpowell/swa-elmish-template","owner":"aaronpowell","description":"A GitHub repo template for Elmish apps for Azure Static Web Apps","archived":false,"fork":false,"pushed_at":"2021-07-09T01:34:30.000Z","size":30,"stargazers_count":11,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-03T21:23:58.312Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Shell","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/aaronpowell.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"License.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2021-07-07T02:11:34.000Z","updated_at":"2023-09-08T18:24:04.000Z","dependencies_parsed_at":"2024-01-24T22:12:16.767Z","dependency_job_id":null,"html_url":"https://github.com/aaronpowell/swa-elmish-template","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/aaronpowell%2Fswa-elmish-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aaronpowell%2Fswa-elmish-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aaronpowell%2Fswa-elmish-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aaronpowell%2Fswa-elmish-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aaronpowell","download_url":"https://codeload.github.com/aaronpowell/swa-elmish-template/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aaronpowell%2Fswa-elmish-template/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259239125,"owners_count":22826865,"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":[],"created_at":"2024-08-03T03:01:24.865Z","updated_at":"2025-06-11T09:33:18.079Z","avatar_url":"https://github.com/aaronpowell.png","language":"Shell","funding_links":[],"categories":["Starter Kits"],"sub_categories":["Auth"],"readme":"# Azure Static Web Apps Elmish Template\r\n\r\nThis repository contains a template for creating an [Azure Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/?WT.mc_id=dotnet-33392-aapowell) projects using Elmish + Fable, Paket and F# Azure Functions.\r\n\r\nTo get started, click the **Use this template** button to create a repository from this template, and check out the [GitHub docs on using templates](https://docs.github.com/en/github/creating-cloning-and-archiving-repositories/creating-a-repository-from-a-template).\r\n\r\n## Running The Application\r\n\r\nFrom within VS Code run the **Launch it all 🚀** Debug configuration to start the Fable app, Azure Functions, Static Web Apps CLI and debuggers.\r\n\r\nIt's recommended that you use a [VS Code Remote Container](https://code.visualstudio.com/docs/remote/containers?WT.mc_id=dotnet-33392-aapowell) for development, as it will setup all the required dependencies and VS Code extensions.\r\n\r\n### Manual Environment Setup\r\n\r\nIf you don't wish to use a VS Code Remote Container you will need the following dependencies installed:\r\n\r\n* .NET SDK 3.1\r\n* Node.js 14\r\n* [Azure Static Web Apps CLI](https://github.com/azure/static-web-apps-cli)\r\n* [Azure Function Core Tools](https://github.com/Azure/azure-functions-core-tools)\r\n\r\nOnce the repo is created from the terminal run:\r\n\r\n```bash\r\n$\u003e dotnet tool restore\r\n$\u003e dotnet paket install\r\n$\u003e npm install\r\n$\u003e npm install -g @azure/static-web-apps-cli azure-functions-core-tools@3\r\n```\r\n\r\nWith all dependencies installed, you can launch the apps, which will require three terminals:\r\n\r\n1. Termainl 1: `npm start`\r\n1. Terminal 2: `cd api \u0026\u0026 func start`\r\n1. Terminal 3: `swa start http://localhost:3000 --api http://localhost:7071`\r\n\r\nThen you can navigate to `http://localhost:4280` to access the emulator.\r\n\r\n## Deploying to Static Web Apps\r\n\r\nTo deploy a site on [Azure Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/?WT.mc_id=dotnet-33392-aapowell) using this template, you'll need to customise the build pipeline that is generated for you to build the web app outside of the Static Web Apps task (the Azure Function componet will build fine). This is because it does not detect that the project needs both Node.js and .NET installed, resulting in only Node.js being installed.\r\n\r\nHere is a sample `build_and_deploy_job`:\r\n\r\n```yml\r\nobs:\r\n  build_and_deploy_job:\r\n    if: github.event_name == 'push' || (github.event_name == 'pull_request' \u0026\u0026 github.event.action != 'closed')\r\n    runs-on: ubuntu-latest\r\n    name: Build and Deploy Job\r\n    steps:\r\n      - uses: actions/checkout@v2\r\n        with:\r\n          submodules: true\r\n      - uses: actions/setup-dotnet@v1\r\n        with:\r\n          dotnet-version: '3.1.x'\r\n      - uses: actions/setup-node@v1\r\n        with:\r\n          node-version: 14\r\n      - run: |\r\n          dotnet tool restore\r\n          dotnet paket install\r\n          npm ci\r\n          npm run build\r\n      - name: Build And Deploy\r\n        id: builddeploy\r\n        uses: Azure/static-web-apps-deploy@v1\r\n        env:\r\n          PRE_BUILD_COMMAND: dotnet tool restore\r\n        with:\r\n          azure_static_web_apps_api_token: \u003cSECRET HERE\u003e\r\n          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)\r\n          action: \"upload\"\r\n          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######\r\n          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig\r\n          app_location: \"/public\" # App source code path\r\n          api_location: \"api\" # Api source code path - optional\r\n          output_location: \"/\" # Built app content directory - optional\r\n          ###### End of Repository/Build Configurations ######\r\n```\r\n\r\nThe main things of note are:\r\n\r\n* .NET and Node are installed on the runner\r\n* The Fable/UI component is built before the SWA Action is used\r\n* SWA sees the output folder, `/public` as the fully compiled app and skips the build step\r\n* `dotnet tool restore` is done as a `PRE_BUILD_COMMAND` to ensure `paket` is available when building Azure Functions\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faaronpowell%2Fswa-elmish-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faaronpowell%2Fswa-elmish-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faaronpowell%2Fswa-elmish-template/lists"}