> For the complete documentation index, see [llms.txt](https://tech.x2bee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tech.x2bee.com/dev-guide/developer-guide-en/pjt-prepare/framework-guide/framework-architecture.md).

# Framework Architecture

The development framework separates the API service application, which handles UI services and business logic, for an MSA structure.​

The UI service structure is built on Spring Boot and consists of a View layer that includes Next.js.​

It is centered on a Web Client that supports Async, non-blocking communication with the business API server via RESTful calls.​

***

### Architecture <a href="#undefined" id="undefined"></a>

#### Front / BackOffice Module Configuration Diagram <a href="#front-backoffice" id="front-backoffice"></a>

<figure><img src="https://200425-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVEZx3rsZsIv89GPS3d2J%2Fuploads%2FqNwjAf8u71idJfH19fHg%2F074-front-bo-layers-v2.png?alt=media&#x26;token=b4308f81-9648-4179-b684-871f18db8784" alt=""><figcaption></figcaption></figure>

<figure><img src="https://tech.x2bee.com/download/attachments/3408404/Untitled%20Diagram.drawio.png" alt=""><figcaption></figcaption></figure>

#### Front / Backend Layer Module Configuration Diagram <a href="#front-backend-layer" id="front-backend-layer"></a>

<figure><img src="https://200425-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVEZx3rsZsIv89GPS3d2J%2Fuploads%2F8sGbNST1c35JeheXMKrK%2F075-layer-architecture-v2.png?alt=media&#x26;token=f32b2f36-9b77-4f55-b78b-36c39300135b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://tech.x2bee.com/download/attachments/3408404/framework%20%EC%95%84%ED%82%A4%ED%85%8D%EC%B2%98%202024%20%EB%A0%88%EC%9D%B4%EC%96%B4%EB%B3%84%20%EB%AA%A8%EB%93%88%20%EA%B5%AC%EC%84%B1%EB%8F%84.drawio.png" alt=""><figcaption></figcaption></figure>

<br>