{"id":20187142,"url":"https://github.com/moaidhathot/hackalearn-swa-angular-demo","last_synced_at":"2025-07-10T16:34:59.837Z","repository":{"id":94374991,"uuid":"371656346","full_name":"MoaidHathot/HackaLearn-SWA-Angular-Demo","owner":"MoaidHathot","description":"Static Web Apps demo Angular application for HackaLearn","archived":false,"fork":false,"pushed_at":"2021-05-31T11:12:12.000Z","size":201,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-10T07:35:04.853Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MoaidHathot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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":"2021-05-28T09:56:52.000Z","updated_at":"2021-05-31T11:12:14.000Z","dependencies_parsed_at":"2023-04-11T12:32:59.204Z","dependency_job_id":null,"html_url":"https://github.com/MoaidHathot/HackaLearn-SWA-Angular-Demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":"staticwebdev/angular-basic","purl":"pkg:github/MoaidHathot/HackaLearn-SWA-Angular-Demo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoaidHathot%2FHackaLearn-SWA-Angular-Demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoaidHathot%2FHackaLearn-SWA-Angular-Demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoaidHathot%2FHackaLearn-SWA-Angular-Demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoaidHathot%2FHackaLearn-SWA-Angular-Demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MoaidHathot","download_url":"https://codeload.github.com/MoaidHathot/HackaLearn-SWA-Angular-Demo/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoaidHathot%2FHackaLearn-SWA-Angular-Demo/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264608171,"owners_count":23636687,"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-11-14T03:21:18.612Z","updated_at":"2025-07-10T16:34:59.815Z","avatar_url":"https://github.com/MoaidHathot.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[[_TOC_]]\r\n\r\n## Prerequisites\r\n- #### Visual Studio Code\r\n\t- [Download](https://code.visualstudio.com?WT.mc_id=javascript-30250-moaidhathot)\r\n\t- [SWA Extension](https://marketplace.visualstudio.com/items?WT.mc_id=javascript-30250-moaidhathot\u0026itemName=ms-azuretools.vscode-azurestaticwebapps)\r\n\t- [Azure Functions Extension](https://marketplace.visualstudio.com/items?WT.mc_id=javascript-30250-moaidhathot\u0026itemName=ms-azuretools.vscode-azurefunctions)\r\n\t- [REST Client Extension](https://marketplace.visualstudio.com/items?WT.mc_id=javascript-30250-moaidhathot\u0026itemName=humao.rest-client)\r\n\r\n- #### Azure Functions CLI\r\n\t- [Download](https://www.npmjs.com/package/azure-functions-core-tools?WT.mc_id=javascript-30250-moaidhathot)\r\n\r\n- #### Azure Static Webaps CLI (preview)\r\n\t- [Docs + Download](https://github.com/Azure/static-web-apps-cli?WT.mc_id=javascript-30250-moaidhathot)\r\n\r\n\r\n\r\n## Generate Template\r\n- [Generate a basic Static Web App with an Angular template](https://docs.microsoft.com/en-us/azure/static-web-apps/getting-started?WT.mc_id=javascript-30250-moaidhathot\u0026tabs=angular)\r\n- Clone your newly generated repository\t\r\n- npm install\r\n- Test the template with `ng serve`\r\n\r\n\r\n## Initial Deployment\r\n- Commit \u0026 Push your code\r\n- [Use the Azure Extenion to create a new Static Web App](https://docs.microsoft.com/en-us/azure/static-web-apps/getting-started?WT.mc_id=javascript-30250-moaidhathot\u0026tabs=angular)\r\n\r\n\r\n## Add an API\r\n- [Add functions](https://docs.microsoft.com/en-us/azure/static-web-apps/add-api?WT.mc_id=javascript-30250-moaidhathot\u0026tabs=vanilla-javascript)\r\n\r\n## Test SWA \u0026 API locally\r\n- Run `ng serve`\r\n- Run `swa start http://localhost:4200 --api ./api`\r\n\t- [Documentation 1](https://github.com/Azure/static-web-apps-cli?WT.mc_id=javascript-30250-moaidhathot)\r\n\t- [Documentation 2](https://docs.microsoft.com/en-us/azure/static-web-apps/local-development?WT.mc_id=javascript-30250-moaidhathot)\r\n\r\n## Create Azure Resources\r\n- [Create a Serverless CosmosDb Resource](https://docs.microsoft.com/en-us/azure/cosmos-db/create-cosmosdb-resources-portal?WT.mc_id=javascript-30250-moaidhathot)\r\n- [Create \u0026 Connect Application Insights Resource](https://dev.to/azure/getting-logs-from-static-web-apps-apis-m5l?WT.mc_id=javascript-30250-moaidhathot)\r\n\r\n\r\n## Use CosmosDB in Azure Functions\r\n- [Input Bindings](https://docs.microsoft.com/en-us/azure/azure-functions/functions-bindings-cosmosdb-v2-input?WT.mc_id=javascript-30250-moaidhathot\u0026tabs=javascript)\r\n- [Output Bindings](https://docs.microsoft.com/en-us/azure/azure-functions/functions-bindings-cosmosdb-v2-output?WT.mc_id=javascript-30250-moaidhathot\u0026tabs=javascript)\r\n- [Install Cosmos DB Client Library](https://docs.microsoft.com/en-us/javascript/api/overview/azure/cosmos-readme?WT.mc_id=javascript-30250-moaidhathot\u0026view=azure-node-latest)\r\n- Add the CosmosDb configuration to `local.settings.json` in `api/`. The file is not under source control\r\n\r\n\r\n## Configure Authentication \u0026 Authorization\r\n- [Create `staticwebapp.config.json` file in the `src/` directory](https://docs.microsoft.com/en-us/azure/static-web-apps/configuration#routes?WT.mc_id=javascript-30250-moaidhathot)\r\n- [Configure the routes](https://github.com/MoaidHathot/HackaLearn-SWA-Angular-Demo/blob/main/src/staticwebapp.config.json?WT.mc_id=javascript-30250-moaidhathot)\r\n\r\n## Deploy\r\n- Commit \u0026 Push your code\r\n- Add CosmosDb's configuration into the `Configuration` section in Azure Portal\r\n- Add ApplicationInsights instrumentation key into the `Configuration` section in Azure Portal witht he key `APPINSIGHTS_INSTRUMENTATIONKEY`\r\n- Invite users\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoaidhathot%2Fhackalearn-swa-angular-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmoaidhathot%2Fhackalearn-swa-angular-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmoaidhathot%2Fhackalearn-swa-angular-demo/lists"}