Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/damikun/trouble-training
FullStack DDD/CQRS with GraphQL workshop including distributed tracing and monitoring. This shows the configuration from React frontend to .Net backend.
https://github.com/damikun/trouble-training
architecture-guidelines bff clean-architechture clean-architecture cqrs-graphql ddd-cqrs distributed-tracing duende-identityserver elasticapm full-stack graphql graphql-api graphql-cqrs graphql-workshop observability opentelemetry relay webhooks-api workshop workshop-materials
Last synced: about 1 month ago
JSON representation
FullStack DDD/CQRS with GraphQL workshop including distributed tracing and monitoring. This shows the configuration from React frontend to .Net backend.
- Host: GitHub
- URL: https://github.com/damikun/trouble-training
- Owner: damikun
- License: mit
- Created: 2021-09-15T07:01:53.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-04-25T10:28:34.000Z (over 2 years ago)
- Last Synced: 2024-09-28T21:40:25.135Z (about 2 months ago)
- Topics: architecture-guidelines, bff, clean-architechture, clean-architecture, cqrs-graphql, ddd-cqrs, distributed-tracing, duende-identityserver, elasticapm, full-stack, graphql, graphql-api, graphql-cqrs, graphql-workshop, observability, opentelemetry, relay, webhooks-api, workshop, workshop-materials
- Language: C#
- Homepage:
- Size: 37.9 MB
- Stars: 465
- Watchers: 11
- Forks: 118
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Full Stack Workshop (Frontend + Backend + Monitoring)
The application contains a full frontend and backend implementation (Net6.0🚀) with infrastructure and app monitoring. There are several patterns used such as. Mediator, BFF, Domain etc.. and everything is secured with Identity server fully supporting OpenId Connect and OAuth2.0
WebHook backend setup
Configure Logging
Configure Tracing
Configure Identity
Configure Monitoring
Handle GraphQL Errors
Build Automation
API testing Postman/Newman
Demo Application contains small UI, where you can manage your WebHooks
## Stack
- **Frontend** - [React](https://reactjs.org/), [Relay](https://relay.dev/), [Typecsript](https://www.typescriptlang.org/), [ReactRouter](https://reactrouter.com/), [TailwindCSS](https://tailwindcss.com/)
- **Backend** - [Netcore](https://dotnet.microsoft.com/), [Hotchocolate](https://chillicream.com), [IdentityServer](https://duendesoftware.com/products/identityserver), [ElasticSearch](https://www.elastic.co/), [Opentelemerty](https://opentelemetry.io/), [Serilog](https://serilog.net/), [MediatR](https://github.com/jbogard/MediatR), [Hangfire](https://www.hangfire.io/), [Automapper](https://automapper.org/), [Fluentvalidation](https://fluentvalidation.net/), [Docker](https://www.docker.com/), [Entity Framework](https://docs.microsoft.com/cs-cz/ef/)
## Project structure
- [APIServer](https://github.com/damikun/trouble-training/tree/main/Src/APIServer) - Is protected GraphQL API
- [BFF](https://github.com/damikun/trouble-training/tree/main/Src/BFF) - Is Backend for Frontend pattern
- [Frontend React](https://github.com/damikun/trouble-training/tree/main/Src/BFF/API/ClientApp) - This also contains Frontend React app served using static files
- [IdentityServer](https://github.com/damikun/trouble-training/tree/main/Src/IdentityServer) - Idetity server service for providing `OpenId Connect` and `OAuth2.0`
- [Device](https://github.com/damikun/trouble-training/blob/main/Doc/Identity.md#authentication-machine-to-machine-using-client-credentials-flow) - Machine-to-machine comunucation using clinetcredentials for external apps/devices
- [Tests](https://github.com/damikun/trouble-training/blob/main/Src/Tests) - Unit, Integration and API tests
## Integration steps:
Please follow these steps if you want to understand it because of the connection between the parts:
1) [WebHook backend](Doc/WebHookBackend.md) - I`ll show you how to create basic WebHook integration under .NetCore Backend for this demo.
2) [Configure logging](Doc/Logging.md) - I`ll show you how to set up a proper distributed logging solution for .Net
3) [Configure telemetry](Doc/OpenTelemetry.md) - I`ll show you how to properly set up Opentelemetry and Elastic APM.
4) [Configure identity](Doc/Identity.md) - You`ll learn how to use the BFF pattern to secure your application.
5) [Configure monitoring](Doc/ElasticSearch.md) - You will learn how to monitor the entire app stack (this depends on parts 1 and 2).
6) [Handle GraphQL Mutation errors](https://github.com/damikun/trouble-training/blob/main/Doc/GraphQL%20-%20MutationErrors.md) - You will learn how to integrate *6a* pattern.
7) [Build automation and workflows](Doc/BuildSystem.md) - You will learn how to setup build plan and generate workflows.
8) [Automate GraphQL API Testing](https://github.com/damikun/trouble-training/tree/main/Src/Tests/Postman) - You will automate API testing using Postman/Newman from Github-Actions
**Frontend to Backend distributed tracing example**
On this monitoring graphical visualization, you can see entire request sended from Client Frontend (Creating a webhook)
Net6.0 is 🚀 (Net5.0 vs Net6.0 measurement)
## Download docker
Based on your system download and [install docker](https://docs.docker.com/engine/install/). This is required!
## Restore all projects
There are two options:
- Use prepared init script. Run `.\build.cmd E2E_RunAs_Local` from project root. (This will take time since restore)
- Manual instalation (Use in case script fails) follow the [manual instal readme](https://github.com/damikun/trouble-training/blob/main/Doc/Manual_Install.md)
> **NOTE** Restore scripts use `npm`. In case you wanna use `yarn` you need to use manual instalation process..
## Run Frontend and Backend
From root directory run `tye run`
(Make sure Docker is running before)
## Compose elastic docker images
Set this configurtaion settings (for localhost) from your `cmd`:
```sh
#For Linux
sysctl -w vm.max_map_count=262144
echo "vm.max_map_count=262144" >> /etc/sysctl.conf
```
```sh
#For Windows WSL
wsl -d docker-desktop
sysctl -w vm.max_map_count=262144
```
**Continue with images:**
In the `/Docker` folder you will find prepared images for:
- **Elasticsearch** - Elastic, Kibana, OtelCollector, APMserver, Logstash.
- Shell `cd` to `Docker/ElasticSearch` and run `docker-compose up`
- **Beats** - (Optional) FileBeat, HeartBeat, MetricBeat, PacketBeat (⚠️ Skip this in case you dont have enaught RAM !)
- Shell `cd` to `Docker/Beats` and run `docker-compose up`
In each folder you will find `docker-compose.yml` and you need to run the command `docker-compose up` in your terminal. The setup has been tested on WSL Docker Desktop.
> **Note:** Folder `/Docker` also contains other images for aditional lessons. (For this demo ignor it)
## Run Elastic and Beats
Start the elasticsearch container group and then beats. Please stick to this order to avoid exception logging due to a missing connection. You can also put everything into a Docker image and wait until the previous section is complete.
> **Note:** Running beats for demo is optional. This require additional RAM and CPU allocation..
In case you have problem to start elastic due to memory issues adjust `max_map_count`
```sh
#For Linux
sysctl -w vm.max_map_count=262144
echo "vm.max_map_count=262144" >> /etc/sysctl.conf
```
```sh
#For Windows WSL
wsl -d docker-desktop
sysctl -w vm.max_map_count=262144
```
To run all containers, please make sure you have enough RAM and a good computer - this is not for kids :P Have fun :)