{"id":23459430,"url":"https://github.com/devkimchi/build2020kr-blazor-aswa-gha","last_synced_at":"2026-01-22T01:35:03.389Z","repository":{"id":84269869,"uuid":"268996739","full_name":"devkimchi/build2020kr-blazor-aswa-gha","owner":"devkimchi","description":"This is to provide a sample codes for the end-to-end app development story covering Blazor Web Assembly, Fluent UI, Azure Functions, Azure Static Web Apps and GitHub Actions","archived":false,"fork":false,"pushed_at":"2020-06-22T10:45:49.000Z","size":348,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-11T23:40:24.836Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","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/devkimchi.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":"2020-06-03T05:23:42.000Z","updated_at":"2020-06-19T13:30:52.000Z","dependencies_parsed_at":"2023-03-30T12:19:13.952Z","dependency_job_id":null,"html_url":"https://github.com/devkimchi/build2020kr-blazor-aswa-gha","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/devkimchi/build2020kr-blazor-aswa-gha","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devkimchi%2Fbuild2020kr-blazor-aswa-gha","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devkimchi%2Fbuild2020kr-blazor-aswa-gha/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devkimchi%2Fbuild2020kr-blazor-aswa-gha/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devkimchi%2Fbuild2020kr-blazor-aswa-gha/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devkimchi","download_url":"https://codeload.github.com/devkimchi/build2020kr-blazor-aswa-gha/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devkimchi%2Fbuild2020kr-blazor-aswa-gha/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28649498,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-22T01:17:37.254Z","status":"ssl_error","status_checked_at":"2026-01-22T01:17:35.564Z","response_time":86,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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-12-24T06:14:30.966Z","updated_at":"2026-01-22T01:35:03.371Z","avatar_url":"https://github.com/devkimchi.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Build 2020 Korea \u0026ndash; Blazor Web Assembly, Fluent UI, Azure Functions, Azure Static Web Apps and GitHub Actions Demo #\n\nThis is to provide a sample codes for the end-to-end app development story covering Blazor Web Assembly, Fluent UI, Azure Functions, Azure Static Web Apps and GitHub Actions\n\n\u003e \u003cspan style=\"color: red; font-weight: bold; font-size: 18pt;\"\u003eFor Build demo, use the `demo` branch, instead of `master`\u003c/span\u003e\n\n\n## Prerequisites ##\n\n* [.NET Core SDK 3.1.4 or later](https://dotnet.microsoft.com/download/dotnet-core/3.1?WT.mc_id=build2020kr-github-juyoo#3.1.4)\n* [node.js 12.13.0 or later](https://nodejs.org/en/download/)\n* [Azure Functions Core Tools](https://www.npmjs.com/package/azure-functions-core-tools)\n* [Azure Free Account](https://azure.microsoft.com/free/?WT.mc_id=build2020kr-github-juyoo)\n\n\n## Getting Started ##\n\nFirst of all, clone this repo onto your local dev machine.\n\n```bash\ngit clone https://github.com/justinyoo/build2020kr-blazor-aswa-gha.git\n```\n\nThen change the directory to the cloned one.\n\n```bash\ncd build2020kr-blazor-aswa-gha\n```\n\nAnd finally, build the app.\n\n```bash\ndotnet build Build2020Demo.sln\n```\n\n\n### Azure Functions App ###\n\n1. Rename `local.settings.sample.json` to `local.settings.json`.\n2. Run the app.\n\n    ```bash\n    func start --script-root src/Demo.FunctionApp\n    ```\n\n3. Open a web browser and enter one of the following URLs.\n\n    ```txt\n    https://localhost:7071/api/hello\n    https://localhost:7071/api/hello?count=123\n    https://localhost:7071/api/hello?count=xxx\n    ```\n\n### Blazor Web Assembly API App \u0026ndash; Another Function App ###\n\nThis \"another\" function app works as like an API of Blazor Web Assembly app on Azure Static Web App.\n\n1. Rename `local.settings.sample.json` to `local.settings.json`.\n2. Run the app with a different port. eg) 7072\n\n    ```bash\n    func start --port 7072 --script-root src/Demo.BlazorApp.Api\n    ```\n\n3. Open a web browser and enter one of the following URLs.\n\n    ```txt\n    https://localhost:7072/api/hello\n    https://localhost:7072/api/hello?count=123\n    https://localhost:7072/api/hello?count=xxx\n    ```\n\n\n### Blazor Web Assembly App ###\n\n1. Run the app.\n\n    ```bash\n    dotnet run -p src/Demo.BlazorApp\n    ```\n\n2. Open a web browser and enter the URL.\n\n    ```txt\n    https://localhost:5001\n    ```\n\n3. Nagivate the `Counter` page anc click the `Click me` button.\n\n\n## Deploy Applications ##\n\n### Deploy Azure Functions App ###\n\nIn order to deploy the Function app, it is assumed to have the following instances on Azure prior to the deployment:\n\n* [Azure Storage Account](https://docs.microsoft.com/azure/storage/common/storage-account-overview?WT.mc_id=build2020kr-github-juyoo)\n* [Consumption Plan](https://docs.microsoft.com/azure/azure-functions/functions-scale?WT.mc_id=build2020kr-github-juyoo#consumption-plan)\n* [Azure Functions App](https://docs.microsoft.com/azure/azure-functions/functions-overview?WT.mc_id=build2020kr-github-juyoo)\n* [Azure Application Insights (optional)](https://docs.microsoft.com/azure/azure-monitor/app/app-insights-overview?WT.mc_id=build2020kr-github-juyoo)\n\nOnce all the resources are provisioned on Azure, run the following commands in order.\n\n1. Publish Function app.\n\n    ```bash\n    dotnet publish src/Demo.FunctionApp -c Release -o funcapp\n    ```\n\n2. Zip the published artifact.\n\n    ```bash\n    zip funcapp.zip funcapp/\n    ```\n\n3. Deploy artifact to Azure.\n\n    ```bash\n    az login\n    az functionapp deployment source config-zip -g \u003cresource_group\u003e -n \u003capp_name\u003e --src funcapp.zip\n    ```\n\n4. Open a web browser and enter one of the following URLs.\n\n    ```txt\n    https://\u003cfunction_app_name\u003e.azurewebsites.net/api/hello?code=\u003cfunction_auth_key\u003e\n    https://\u003cfunction_app_name\u003e.azurewebsites.net/api/hello?count=123\u0026code=\u003cfunction_auth_key\u003e\n    https://\u003cfunction_app_name\u003e.azurewebsites.net/api/hello?count=xxx\u0026code=\u003cfunction_auth_key\u003e\n    ```\n\n\n### Deploy Blazor Web Assembly App to Azure Static Web Apps ###\n\n1. Add secrets to GitHub repository settings:\n   * `FUNCTIONAPP_BASE_URI`: Azure Function app base URI. eg) `/api/`\n   * `FUNCTIONAPP_ENDPOINT`: Endpoint. eg) `hello`\n\n2. Create Azure Static Web App instance on Azure Portal.\n3. When prompted, link to GitHub repository.\n4. Deployment will fail. Don't worry! It's expected.\n5. Update GitHub Actions workflow.\n   * Add the following three steps right after the `checkout@v2` action.\n\n      ```yaml\n      - name: Setup .NET SDK\n        uses: actions/setup-dotnet@v1\n        with:\n          dotnet-version: '3.1.300'\n      - name: Update appsettings.json\n        shell: bash\n        run: |\n          echo '{ \"FUNCTIONAPP_BASE_URI\": \"${{ secrets.FUNCTIONAPP_BASE_URI }}\", \"FUNCTIONAPP_ENDPOINT\": \"${{ secrets.FUNCTIONAPP_ENDPOINT }}\" }' \u003e src/Demo.BlazorApp/wwwroot/appsettings.json\n      - name: Publish Blazor WASM app\n        shell: bash\n        run: |\n          dotnet publish src/Demo.BlazorApp -c Release -o published\n      ```\n\n   * Change the `app_location` and `api_location` and `api_artifact_location` below:\n\n      ```yaml\n      - name: Build And Deploy\n        id: builddeploy\n        uses: Azure/static-web-apps-deploy@v0.0.1-preview\n        with:\n          ...\n          app_location: \"published/wwwroot\"\n          api_location: \"src/Demo.BlazorApp.Api\"\n          app_artifact_location: \"published/wwwroot\"\n      ```\n\n6. Push the workflow and GitHub Action will run again, and deployment will succeed.\n7. Add environment variables to the `Configuration` blade of the Azure Static Web App instance.\n   * `FUNCTIONAPP_BASE_URI`: Azure Function app base URI. eg) `https://\u003cfunction_app_name\u003e.azurewebsites.net/api/`\n   * `FUNCTIONAPP_ENDPOINT`: Endpoint. eg) `hello`\n   * `FUNCTIONAPP_AUTH_KEY`: Function app auth key.\n\n8. Open a web browser and enter the URL.\n\n    ```txt\n    https://\u003crandom_string\u003e.azurestaticapps.net\n    ```\n\n9. Nagivate the `Counter` page anc click the `Click me` button.\n\n\n## Update GitHub Actions for ChatOps ##\n\nIn order to enable ChatOps demo, follow the instruction to update GitHub Actions workflow.\n\n\n### Update Existing Workflow ###\n\n1. Add secrets to GitHub repository settings:\n   * `STATIC_WEBAPP_URI`: Azure Static Web App instance URI. eg) `https://\u003crandom_string\u003e.azurestaticapps.net`\n   * `TEAMS_WEBHOOK_URI`: Microsoft Teams webhook URI. eg) `https://outlook.office.com/webhook/\u003cGUID\u003e/IncomingWebhook/\u003cGUID\u003e`\n\n2. Add a new step to the right after the `Build And Deploy` step of the existing workflow. Its filename might look like `azure-static-web-apps-\u003crandom_string\u003e.yml`.\n\n    ```yaml\n      - name: Send a message to Microsoft Teams\n        uses: aliencube/microsoft-teams-actions@v0.8.0\n        with:\n          webhook_uri: ${{ secrets.TEAMS_WEBHOOK_URI }}\n          title: ''\n          summary: 'Your Blazor Web Assembly app has been successfully deployed'\n          text: ''\n          theme_color: ''\n          sections: '[{ \"activityImage\": \"https://raw.githubusercontent.com/justinyoo/build2020kr-blazor-aswa-gha/master/media/aswa-icon.png\", \"activityTitle\": \"Your Blazor Web Assembly app has been successfully deployed\" }]'\n          actions: '[{ \"@type\": \"OpenUri\", \"name\": \"Go to the web app\", \"targets\": [{ \"os\": \"default\", \"uri\": \"${{ secrets.STATIC_WEBAPP_URI }}\" }] }]'  \n    ```\n\n3. Open the Microsoft Teams channel and see whether the message is posted or not.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevkimchi%2Fbuild2020kr-blazor-aswa-gha","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevkimchi%2Fbuild2020kr-blazor-aswa-gha","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevkimchi%2Fbuild2020kr-blazor-aswa-gha/lists"}