https://github.com/frostmarked/bongateway
Front-end project for limousin.se
https://github.com/frostmarked/bongateway
angular cattle graphql jhipster open-api-specification spring-boot
Last synced: 3 months ago
JSON representation
Front-end project for limousin.se
- Host: GitHub
- URL: https://github.com/frostmarked/bongateway
- Owner: frostmarked
- Created: 2020-07-16T10:47:11.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-06T20:19:23.000Z (over 2 years ago)
- Last Synced: 2025-02-11T17:11:42.102Z (4 months ago)
- Topics: angular, cattle, graphql, jhipster, open-api-specification, spring-boot
- Language: Java
- Homepage: https://limousin.se
- Size: 11.9 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 42
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Note
Visit the parent project https://github.com/frostmarked/bonParent for more information

[](https://sonarcloud.io/dashboard?id=frostmarked_bonGateway)# bonGateway
This application was generated using JHipster 6.10.5, you can find documentation and help at [https://www.jhipster.tech/documentation-archive/v6.10.5](https://www.jhipster.tech/documentation-archive/v6.10.5).
This is a "gateway" application intended to be part of a microservice architecture, please refer to the [Doing microservices with JHipster][] page of the documentation for more information.
This application is configured for Service Discovery and Configuration with the JHipster-Registry. On launch, it will refuse to start if it is not able to connect to the JHipster-Registry at [http://localhost:8761](http://localhost:8761). For more information, read our documentation on [Service Discovery and Configuration with the JHipster-Registry][].
## Development
Before you can build this project, you must install and configure the following dependencies on your machine:
1. [Node.js][]: We use Node to run a development web server and build the project.
Depending on your system, you can install Node either from source or as a pre-packaged bundle.After installing Node, you should be able to run the following command to install development tools.
You will only need to run this command when dependencies change in [package.json](package.json).```
npm install
```We use npm scripts and [Webpack][] as our build system.
If you are using hazelcast as a cache, you will have to launch a cache server.
To start your cache server, run:```
docker-compose -f src/main/docker/hazelcast-management-center.yml up -d
```Run the following commands in two separate terminals to create a blissful development experience where your browser
auto-refreshes when files change on your hard drive.```
./mvnw
npm start
```Npm is also used to manage CSS and JavaScript dependencies used in this application. You can upgrade dependencies by
specifying a newer version in [package.json](package.json). You can also run `npm update` and `npm install` to manage dependencies.
Add the `help` flag on any command to see how you can use it. For example, `npm help update`.The `npm run` command will list all of the scripts available to run for this project.
### PWA Support
JHipster ships with PWA (Progressive Web App) support, and it's turned off by default. One of the main components of a PWA is a service worker.
The service worker initialization code is commented out by default. To enable it, uncomment the following code in `src/main/webapp/index.html`:
```html
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('./service-worker.js').then(function () {
console.log('Service Worker Registered');
});
}```
Note: [Workbox](https://developers.google.com/web/tools/workbox/) powers JHipster's service worker. It dynamically generates the `service-worker.js` file.
### Managing dependencies
For example, to add [Leaflet][] library as a runtime dependency of your application, you would run following command:
```
npm install --save --save-exact leaflet
```To benefit from TypeScript type definitions from [DefinitelyTyped][] repository in development, you would run following command:
```
npm install --save-dev --save-exact @types/leaflet
```Then you would import the JS and CSS files specified in library's installation instructions so that [Webpack][] knows about them:
Edit [src/main/webapp/app/vendor.ts](src/main/webapp/app/vendor.ts) file:```
import 'leaflet/dist/leaflet.js';
```Edit [src/main/webapp/content/scss/vendor.scss](src/main/webapp/content/scss/vendor.scss) file:
```
@import '~leaflet/dist/leaflet.css';
```Note: There are still a few other things remaining to do for Leaflet that we won't detail here.
For further instructions on how to develop with JHipster, have a look at [Using JHipster in development][].
### Using Angular CLI
You can also use [Angular CLI][] to generate some custom client code.
For example, the following command:
```
ng generate component my-component
```will generate few files:
```
create src/main/webapp/app/my-component/my-component.component.html
create src/main/webapp/app/my-component/my-component.component.ts
update src/main/webapp/app/app.module.ts
```### Doing API-First development using openapi-generator
[OpenAPI-Generator]() is configured for this application. You can generate API code from the `src/main/resources/swagger/api.yml` definition file by running:
```bash
./mvnw generate-sources
```Then implements the generated delegate classes with `@Service` classes.
To edit the `api.yml` definition file, you can use a tool such as [Swagger-Editor](). Start a local instance of the swagger-editor using docker by running: `docker-compose -f src/main/docker/swagger-editor.yml up -d`. The editor will then be reachable at [http://localhost:7742](http://localhost:7742).
Refer to [Doing API-First development][] for more details.
### Doing Graphql with OAS spec
Note!
During test and evaluation of workflow there were issues with conflicting npm dependencies regarding graphql.
Result is that generators were moved to individual packages#### Backend
Use https://editor.swagger.io/ to convert openapi spec to json and save to
```
packages/oas2gql/oas.json
```Currenly:
Remove references to jwt in oas.json, its going to be public any way.
The generator will otherwise output dangerous warnings and odd looking graphql schema```
packages/oas2gql/oas-no-jwt.json
```Run converter, it will save result in graphql folder
```
npm run oas2gql
```Add graphql-java-kickstart maven dependencies
- graphql-spring-boot-starter
- graphiql-spring-boot-starterAdd examples to graphiql folder
- src/main/resources/graphql/graphiql
Add maven plugin graphql-java-codegen and configure it
- https://github.com/kobylynskyi/graphql-java-codegen/tree/master/plugins/maven
Configure graphql and graphiql endpoints in Spring Boot configuration
- SecurityConfiguration
- WebConfigurerMake a simple test with a catch-all query-resolver
Run app and use graphiql to test it
- http://localhost:9000/graphiql
#### Frontend
Re-generate typescript from graphql schema and given queries plus fragments etc
```
npm run gqlcodegen
```## Building for production
### Packaging as jar
To build the final jar and optimize the bonGateway application for production, run:
```
./mvnw -Pprod clean verify
```
This will concatenate and minify the client CSS and JavaScript files. It will also modify `index.html` so it references these new files.
To ensure everything worked, run:```
java -jar target/*.jar
```
Then navigate to [http://localhost:9000](http://localhost:9000) in your browser.
Refer to [Using JHipster in production][] for more details.
### Packaging as war
To package your application as a war in order to deploy it to an application server, run:
```
./mvnw -Pprod,war clean verify
```
## Testing
To launch your application's tests, run:
```
./mvnw verify
```### Client tests
Unit tests are run by [Jest][] and written with [Jasmine][]. They're located in [src/test/javascript/](src/test/javascript/) and can be run with:
```
npm test
```For more information, refer to the [Running tests page][].
### Code quality
Sonar is used to analyse code quality. You can start a local Sonar server (accessible on http://localhost:9001) with:
```
docker-compose -f src/main/docker/sonar.yml up -d
```You can run a Sonar analysis with using the [sonar-scanner](https://docs.sonarqube.org/display/SCAN/Analyzing+with+SonarQube+Scanner) or by using the maven plugin.
Then, run a Sonar analysis:
```
./mvnw -Pprod clean verify sonar:sonar
```If you need to re-run the Sonar phase, please be sure to specify at least the `initialize` phase since Sonar properties are loaded from the sonar-project.properties file.
```
./mvnw initialize sonar:sonar
```For more information, refer to the [Code quality page][].
## Using Docker to simplify development (optional)
You can use Docker to improve your JHipster development experience. A number of docker-compose configuration are available in the [src/main/docker](src/main/docker) folder to launch required third party services.
For example, to start a postgresql database in a docker container, run:
```
docker-compose -f src/main/docker/postgresql.yml up -d
```To stop it and remove the container, run:
```
docker-compose -f src/main/docker/postgresql.yml down
```You can also fully dockerize your application and all the services that it depends on.
To achieve this, first build a docker image of your app by running:```
./mvnw -Pprod verify jib:dockerBuild
```Then run:
```
docker-compose -f src/main/docker/app.yml up -d
```For more information refer to [Using Docker and Docker-Compose][], this page also contains information on the docker-compose sub-generator (`jhipster docker-compose`), which is able to generate docker configurations for one or several JHipster applications.
## Continuous Integration (optional)
To configure CI for your project, run the ci-cd sub-generator (`jhipster ci-cd`), this will let you generate configuration files for a number of Continuous Integration systems. Consult the [Setting up Continuous Integration][] page for more information.
[jhipster homepage and latest documentation]: https://www.jhipster.tech
[jhipster 6.10.5 archive]: https://www.jhipster.tech/documentation-archive/v6.10.5
[doing microservices with jhipster]: https://www.jhipster.tech/documentation-archive/v6.10.5/microservices-architecture/
[using jhipster in development]: https://www.jhipster.tech/documentation-archive/v6.10.5/development/
[service discovery and configuration with the jhipster-registry]: https://www.jhipster.tech/documentation-archive/v6.10.5/microservices-architecture/#jhipster-registry
[using docker and docker-compose]: https://www.jhipster.tech/documentation-archive/v6.10.5/docker-compose
[using jhipster in production]: https://www.jhipster.tech/documentation-archive/v6.10.5/production/
[running tests page]: https://www.jhipster.tech/documentation-archive/v6.10.5/running-tests/
[code quality page]: https://www.jhipster.tech/documentation-archive/v6.10.5/code-quality/
[setting up continuous integration]: https://www.jhipster.tech/documentation-archive/v6.10.5/setting-up-ci/
[node.js]: https://nodejs.org/
[yarn]: https://yarnpkg.org/
[webpack]: https://webpack.github.io/
[angular cli]: https://cli.angular.io/
[browsersync]: https://www.browsersync.io/
[jest]: https://facebook.github.io/jest/
[jasmine]: https://jasmine.github.io/2.0/introduction.html
[protractor]: https://angular.github.io/protractor/
[leaflet]: https://leafletjs.com/
[definitelytyped]: https://definitelytyped.org/
[openapi-generator]: https://openapi-generator.tech
[swagger-editor]: https://editor.swagger.io
[doing api-first development]: https://www.jhipster.tech/documentation-archive/v6.10.5/doing-api-first-development/