Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hmcts/prl-citizen-frontend
Private Law citizen frontend repository
https://github.com/hmcts/prl-citizen-frontend
jenkins-cft jenkins-cft-j-z
Last synced: about 1 month ago
JSON representation
Private Law citizen frontend repository
- Host: GitHub
- URL: https://github.com/hmcts/prl-citizen-frontend
- Owner: hmcts
- License: mit
- Created: 2022-03-17T16:41:19.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2024-10-29T14:41:35.000Z (about 2 months ago)
- Last Synced: 2024-10-29T14:53:58.549Z (about 2 months ago)
- Topics: jenkins-cft, jenkins-cft-j-z
- Language: TypeScript
- Size: 35.3 MB
- Stars: 4
- Watchers: 10
- Forks: 2
- Open Issues: 107
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Audit: audit.json
- Codeowners: CODEOWNERS
Awesome Lists containing this project
README
## prl-citizen-frontend
Updated with Release 4.0
## Getting Started
### Prerequisites
Running the application requires the following tools to be installed in your environment:
- [Node.js](https://nodejs.org/) v12.0.0 or later
- [yarn](https://yarnpkg.com/)
- [Docker](https://www.docker.com)
#### Running the application
Install dependencies by executing the following command:
```bash
$ yarn install
```
Bundle:
```bash
$ yarn webpack
```
Run:
```bash
$ yarn start
```
The applications's home page will be available at https://localhost:3001
### Running with Docker
Create docker image:
```bash
docker-compose build
```
Run the application by executing the following command:
```bash
docker-compose up
```
This will start the frontend container exposing the application's port
(set to `3001` in this template app).
In order to test if the application is up, you can visit https://localhost:3001 in your browser.
You should get a very basic home page (no styles, etc.).
## Developing
### Code style
We use [ESLint](https://github.com/typescript-eslint/typescript-eslint)
alongside [sass-lint](https://github.com/sasstools/sass-lint)
Running the linting with auto fix:
```bash
$ yarn lint --fix
```
### Running the tests
This template app uses [Jest](https://jestjs.io//) as the test engine. You can run unit tests by executing
the following command:
```bash
$ yarn test
```
Here's how to run functional tests (the template contains just one sample test):
```bash
$ yarn test:routes
```
Running accessibility tests:
```bash
$ yarn test:a11y
```
Make sure all the paths in your application are covered by accessibility tests (see [a11y.ts](src/test/a11y/a11y.ts)).
### Security
#### CSRF prevention
[Cross-Site Request Forgery](https://github.com/pillarjs/understanding-csrf) prevention has already been
set up in this template, at the application level. However, you need to make sure that CSRF token
is present in every HTML form that requires it. For that purpose you can use the `csrfProtection` macro,
included in this template app. Your njk file would look like this:
```
{% from "macros/csrf.njk" import csrfProtection %}
...
...
{{ csrfProtection(csrfToken) }}
...
...
```
#### Helmet
This application uses [Helmet](https://helmetjs.github.io/), which adds various security-related HTTP headers
to the responses. Apart from default Helmet functions, following headers are set:
- [Referrer-Policy](https://helmetjs.github.io/docs/referrer-policy/)
- [Content-Security-Policy](https://helmetjs.github.io/docs/csp/)
There is a configuration section related with those headers, where you can specify:
- `referrerPolicy` - value of the `Referrer-Policy` header
Here's an example setup:
```json
"security": {
"referrerPolicy": "origin",
}
```
Make sure you have those values set correctly for your application.
#### Troubleshooting
### Managing Preview environment PODs
Make sure you have added the label 'enable_keep_helm' while creating the PR. Otherwise, add the label and re-trigger the build.
### Healthcheck
The application exposes a health endpoint (https://localhost:3001/health), created with the use of
[Nodejs Healthcheck](https://github.com/hmcts/nodejs-healthcheck) library. This endpoint is defined
in [health.ts](src/main/routes/health.ts) file. Make sure you adjust it correctly in your application.
In particular, remember to replace the sample check with checks specific to your frontend app,
e.g. the ones verifying the state of each service it depends on.
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details