# mb-111-3/role-based-access-control-rbac-system architecture

> Architecture diagram of the GitHub repository mb-111-3/role-based-access-control-rbac-system, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/mb-111-3/role-based-access-control-rbac-system
- Repository: https://github.com/mb-111-3/role-based-access-control-rbac-system

## Overview

This is a React and Go RBAC application for managing accounts and content under admin, editor, and viewer roles. A user registers or logs in through the client; the client stores the returned identity and JWT, then uses the token for protected API requests. Gin routes apply authentication and role checks before dispatching account or content operations, which use GORM and MySQL. The README documents dashboard, content, and admin capabilities; some page and handler wiring is represented from that documentation because those sources were not sampled.

Main entry points: [`client/src/App.jsx`](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/App.jsx) (Route application), [`client/src/api/axios.js`](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/api/axios.js) (API client), [`server/routes/routes.go`](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/routes/routes.go) (API routes), [`server/handlers/auth.go`](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/auth.go) (Authentication)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["React client"]
  node_app["Route application<br/>[App.jsx]"]
  node_auth_context["Auth state<br/>[AuthContext.jsx]"]
  node_api_client["API client<br/>[axios.js]"]
  node_login["Login page<br/>[Login.jsx]"]
  node_register["Registration page<br/>[Register.jsx]"]
  node_dashboard["Dashboard<br/>[Dashboard.jsx]"]
  node_content_page["Content page<br/>[ContentPage.jsx]"]
  node_admin_panel["Admin panel<br/>[AdminPanel.jsx]"]
end

subgraph group_api["API and security"]
  node_server["Gin server<br/>[main.go]"]
  node_routes["API routes<br/>[routes.go]"]
  node_auth_middleware["JWT and roles<br/>[auth.go]"]
end

subgraph group_domain["Account and content"]
  node_auth_handlers["Authentication<br/>[auth.go]"]
  node_user_handlers["User management<br/>[users.go]"]
  node_content_handlers["Content management<br/>[content.go]"]
end

subgraph group_persistence["Persistence"]
  node_database_config["DB setup and seeds<br/>[database.go]"]
  node_models["User and content models<br/>[models.go]"]
  node_mysql[("MySQL")]
end

node_user(("User"))

node_user -->|"uses"| node_app
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_register
node_app -->|"routes to"| node_dashboard
node_app -->|"routes to"| node_content_page
node_app -->|"admin route"| node_admin_panel
node_app -->|"reads auth state"| node_auth_context
node_login -->|"requests login"| node_api_client
node_register -->|"requests registration"| node_api_client
node_api_client -->|"sends API requests"| node_server
node_api_client -->|"uses stored token"| node_auth_context
node_admin_panel -->|"manages users"| node_api_client
node_content_page -->|"content requests"| node_api_client
node_server -->|"connects, migrates, seeds"| node_database_config
node_server -->|"registers routes"| node_routes
node_routes -->|"guards protected routes"| node_auth_middleware
node_routes -->|"dispatches auth"| node_auth_handlers
node_routes -->|"dispatches user actions"| node_user_handlers
node_routes -->|"dispatches content actions"| node_content_handlers
node_auth_handlers -->|"signs JWT"| node_auth_middleware
node_auth_handlers -->|"reads and writes accounts"| node_mysql
node_user_handlers -->|"manages accounts"| node_mysql
node_content_handlers -->|"manages content"| node_mysql
node_database_config -->|"connects and seeds"| node_mysql
node_database_config -->|"migrates"| node_models
node_auth_handlers -->|"uses user model"| node_models
node_user_handlers -->|"uses user model"| node_models
node_content_handlers -->|"uses content model"| node_models

click node_app "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/App.jsx"
click node_auth_context "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/context/AuthContext.jsx"
click node_api_client "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/api/axios.js"
click node_login "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Login.jsx"
click node_register "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Register.jsx"
click node_dashboard "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Dashboard.jsx"
click node_content_page "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/ContentPage.jsx"
click node_admin_panel "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/AdminPanel.jsx"
click node_server "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/main.go"
click node_routes "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/routes/routes.go"
click node_auth_middleware "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/middleware/auth.go"
click node_auth_handlers "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/auth.go"
click node_user_handlers "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/users.go"
click node_content_handlers "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/content.go"
click node_database_config "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/config/database.go"
click node_models "https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/models/models.go"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app,node_auth_context,node_api_client,node_login,node_register,node_dashboard,node_content_page,node_admin_panel,node_user toneBlue
class node_server,node_routes,node_auth_middleware toneAmber
class node_auth_handlers,node_user_handlers,node_content_handlers toneMint
class node_database_config,node_models,node_mysql toneRose
```

## Components

### React client

- [Route application](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/App.jsx): `client/src/App.jsx`
- [Auth state](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/context/AuthContext.jsx): `client/src/context/AuthContext.jsx`
- [API client](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/api/axios.js): `client/src/api/axios.js`
- [Login page](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Login.jsx): `client/src/pages/Login.jsx`
- [Registration page](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Register.jsx): `client/src/pages/Register.jsx`
- [Dashboard](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/Dashboard.jsx): `client/src/pages/Dashboard.jsx`
- [Content page](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/ContentPage.jsx): `client/src/pages/ContentPage.jsx`
- [Admin panel](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/client/src/pages/AdminPanel.jsx): `client/src/pages/AdminPanel.jsx`

### API and security

- [Gin server](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/main.go): `server/main.go`
- [API routes](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/routes/routes.go): `server/routes/routes.go`
- [JWT and roles](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/middleware/auth.go): `server/middleware/auth.go`

### Account and content

- [Authentication](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/auth.go): `server/handlers/auth.go`
- [User management](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/users.go): `server/handlers/users.go`
- [Content management](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/handlers/content.go): `server/handlers/content.go`

### Persistence

- [DB setup and seeds](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/config/database.go): `server/config/database.go`
- [User and content models](https://github.com/mb-111-3/role-based-access-control-rbac-system/blob/main/server/models/models.go): `server/models/models.go`
- **MySQL**

### Other components

- **User**

## Connections

- User → Route application: uses
- Route application → Login page: routes to
- Route application → Registration page: routes to
- Route application → Dashboard: routes to
- Route application → Content page: routes to
- Route application → Admin panel: admin route
- Route application → Auth state: reads auth state
- Login page → API client: requests login
- Registration page → API client: requests registration
- API client → Gin server: sends API requests
- API client → Auth state: uses stored token
- Admin panel → API client: manages users
- Content page → API client: content requests
- Gin server → DB setup and seeds: connects, migrates, seeds
- Gin server → API routes: registers routes
- API routes → JWT and roles: guards protected routes
- API routes → Authentication: dispatches auth
- API routes → User management: dispatches user actions
- API routes → Content management: dispatches content actions
- Authentication → JWT and roles: signs JWT
- Authentication → MySQL: reads and writes accounts
- User management → MySQL: manages accounts
- Content management → MySQL: manages content
- DB setup and seeds → MySQL: connects and seeds
- DB setup and seeds → User and content models: migrates
- Authentication → User and content models: uses user model
- User management → User and content models: uses user model
- Content management → User and content models: uses content model
