Housing Innovation Branch has received funding from Strategic Investment Funding (SIF) to partner with TELUS to design and develop a code consolidation proof of concept by September, 2024. This is the repository for the proof of concept.
This Turborepo includes the following packages/apps:
These are located in the apps directory:
web: a Next.js app that serves as the main application
These are located in the packages directory:
@repo/ui: a React component library used by thewebapplication- Could be used by other applications in the future or replaced by the British Columbia Government Design System
@repo/constants: shared constants@repo/data: data and data utilities@repo/eslint-config:eslintconfigurations (includeseslint-config-nextandeslint-config-prettier)@repo/typescript-config:tsconfig.jsons used throughout the monorepo
Each package and app is 100% TypeScript. Refer to each workspace's README for more information on each.
This Turborepo uses some additional tools to help with development, including:
- TypeScript for static type checking
- ESLint for code linting
- Prettier for code formatting
- Lefthook for git hooks
To install all the node modules, run the install command from the root directory. This will install all modules in the root of your repository, and in each workspace.
npm install
To develop all apps and packages, run the following command:
npm run dev
This will start the web app in development mode, and watch for changes in all packages. For more information on developing each app/package, see the README in each workspace.
To build all apps and packages, run the following command:
npm run build
To run the unit tests, run the following command:
npm run test
Note: you generally shouldn't need to run unit tests directly as they run as part of our precommit hooks.
To run the Cypress e2e tests:
- Ensure the application is running at http://localhost:3000
- Run one of the two following commands:
- Use
npm run e2eto run tests headlessly in your terminal. - Use
npm run e2e:opento open the cypress test runner UI.
- Use
This application uses Docker to provide containerization and portability. You can install Docker on your local machine from this link.
We utilize docker-compose to help with the building process
To run the application locally in a Docker container, run the following commands:
docker-compose build
docker-compose up
NOTE: Some security applications such as ZScaler may require additional configuration of the Docker install to utilize a security certificate file. Please read this documentation from the Docker website to learn more.
As noted above, this repository uses Lefthook to run git hooks.
Pre-commit the format, lint, and test turbo tasks will run. This will run any scripts called format:check, lint, or test in any of the workspaces. Look at the package.json in each workspace for what executes in each. If there are any errors, the commit will be aborted. (Note: test normally includes the vitests.)
The infrastructure uses a combination of GitHub Actions, JFrog Artifactory, OpenShift, and Helm to manage the continuous integration and deployment (CI/CD) of the application.
- GitHub Actions: Automates the build, test, and deployment workflows
- JFrog Artifactory: Serves as the Docker image repository
- OpenShift: Manages the deployment of applications in different environments (Dev and UAT)
- Helm: Simplifies deploying and managing Kubernetes applications, making deployments easy and consistent
This workflow runs on pull requests to the main branch and can also be manually triggered. It performs the following actions:
- Runs unit tests
- Builds the docker image
- Executes end-to-end tests with Cypress using the previously built image
- Runs a Trivy Vulnerability Scan using the previously built image
- Pushes the Docker image to JFrog Artifactory after successful tests
This workflow runs on pull requests to the main branch and can also be manually triggered. It performs the following actions:
- Runs CodeQL semantic code analysis
- Runs Trivy vulnerability scanner in repo mode
This workflow runs on pushes to the main branch and can also be manually triggered. It performs the following actions:
- Extracts the pull request number associated with a commit
- Deploys the application to the dev environment in OpenShift using Helm and the tag extracted previously
This workflow runs when the Deployment-Dev workflow completes successfully. The workflow pauses until one of the team members approves it (the list of team members is assigned in the repository settings). It performs the following actions:
- Extracts the pull request number associated with a commit
- Deploys the application to the dev environment in OpenShift using Helm and the tag extracted previously
This project builds on top of React Aria Components to start from a base of accessibility. You can find more information about React Aria Components here.
This project uses a modified version of BEM (Block Element Modifier) naming conventions for CSS classes. The naming convention is as follows:
.[workspace]-[Block]--[Element] --[modifier]
/* for example */
.web-Question--Title {}
.ui-Button.--primary {}.u-[utility]
/* for example */
.u-hidden {}
.u-mt-4 {}Learn more about the power of Turborepo: