A personal resume implemented in Angular v16 and Azure Functions.
- Yarn package management
- SASS CSS pre-processing using C-syntax
- Responsive layout implemented with SASS variables for breakpoints and mixins to render CSS media queries
- es-lint style checking
- JSDOC comments
- Unit test suite implemented in jasmine and run in Karma
- VSCode extension recommendations and settings
- Continuous integration workflow implemented in GitHub Actions
- E2E automated test suite for deployment santity implemented in Cypress
- Google Analytics integration that pushes page views based on Angular Router events
- Integration with Azure Monitor (Application Insights)
- User cookie consent banner implementation
- Build-time prerendering using Angular Universal
- SEO head and meta tag generation through dynamically configured route data with support for:
- Angular Material component integration
- Light and dark themes that respect operating system preferences and switching via user interaction
- RESTful backend API implemented in C# 10 and Azure Functions v4
- OpenAPI v3 backend API descriptors
- Swagger interactive backend API documentation and harness
The CI/CD workflow pipeline for this project is implemented in a GitHub Actions workflow through YAML file that can be found here. Deployments to both preview and production environments are made by the pipeline into Microsoft Azure and hosted in a Static Web App Service resource. Prior to deployment to either a preview environment or production, merges and PRs must pass linting, test suite execution and compilation steps. The CI/CD pipeline is triggered by either a push into the default branch or the opening, reopening or synchronization of a PR into the default branch. PR build results are deployed to preview environments that are given dynamic DNS entries. Preview environment locations are posted as comments on the PR following a successful deployment. Closure of a PR will result in the preview environment being deleted from the Azure resource as a clean up mechanism.
Following deployments to both preivew and production Azure environments, an end-to-end test suite is run to validate the sanity of the deployment. In the event of a test failure, screenshots of the website state following each individual test are uploaded as artifacts to the source workflow. After each test suite run, a video of the test suite run is always uploaded as a workflow artifact.
Primarily authored on macOs in Visual Studio Code, several tips and tricks apply in addition to using the recommended extensions:
- Reference the workaround in this issue if the debugger fails to attach to the C# functions locally
- Enable the setting
Editor: Format on Typein VSCode - Utilize this Homebrew tap to install multiple versions of the dotnet SDK in parallel
- When debugging in Chrome Dev Tools, the Angular DevTools Extension comes in handy