### Architecture Modeling Examples

Source: https://likec4.dev

Incremental examples showing how to define actors, systems, and components with descriptions and relationships.

```c4
model {
  customer = actor 'Customer' {
    description 'A user of our product'
  }
  cloud = system 'Our SaaS' {
    description 'Our product'
  }
  customer -> cloud 'uses to manage data'
}
```

```c4
model {
  customer = actor 'Customer' {
    description 'A user of our product'
  }
  cloud = system 'Our SaaS' {
    description 'Our product'
    ui = component 'Frontend'
    customer -> ui 'opens in browser'
  }
  customer -> cloud 'uses to manage data'
}
```

```c4
model {
  customer = actor 'Customer' {
    description 'A user of our product'
  }
  cloud = system 'Our SaaS' {
    description 'Our product'
    ui = component 'Frontend'
    customer -> ui 'opens in browser'
    backend = component 'Backend'
    ui -> backend 'requests via HTTPS'
  }
  customer -> cloud 'uses to manage data'
}
```

--------------------------------

### LikeC4 CLI Commands

Source: https://likec4.dev

Common CLI commands for building, generating components, and serving the architecture documentation site.

```bash
$ likec4 build
  Building static site...
$ likec4 generate react
  Generated React components
$ likec4 serve
  Serving at http://localhost:5173
```

--------------------------------

### Define Architecture with LikeC4 DSL

Source: https://likec4.dev

Basic structure for defining actors, systems, and components within a model block.

```c4
model {
  customer = actor 'Customer'
  cloud = system 'Our SaaS' {
    ui = component 'Frontend'
    api = component 'Backend'
    ui -> api 'requests'
  }
  customer -> ui
}
```

--------------------------------

### Define Custom Element Specifications

Source: https://likec4.dev

Configure element styles and types using the specification block.

```c4
specification {
  element actor {
    style {
      shape person
    }
  }
  element system
  element component
  relationship async
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.