# Generate Diagrams

LLMs can be leveraged to write code for models that represent your software application. 

Since GitBook, the platform we're using to document GDF, has a native integration with MermaidJS, we we use ChatGPT to create a diagram demonstrating digramming functionality. 

## Example: Creating a systems diagram in using ChatGPT

### Prompt:  

{% code title="prompt:" overflow="wrap" %}

```
create a diagram in mermaid js showing how a web app connects to an api and the api connects to a database with details leveraging aws cloud infrastructure and a react native mobile app
```

{% endcode %}

### Response: 

{% @mermaid/diagram content="graph TD;
subgraph AWS Cloud Infrastructure
A(Web App)-->B(API Gateway);
B-->C\[Lambda Function];
C-->D\[Database];
E(Mobile App)-->B;
end

```
subgraph Details
    B-->F[Authentication];
    C-->G[Data Validation];
    C-->H[Data Processing];
    D-->I[Data Storage];
    E-->J[Authentication];
    E-->K[Data Retrieval];
end

subgraph AWS Services
    L[S3]-->M[CloudFront];
    D-->N[RDS];
end

subgraph Deployment
    O[CodePipeline]-->C;
    O-->P[CodeBuild];
    P-->Q[Elastic Beanstalk];
    Q-->A;
    Q-->B;
end
```

" %}

### Summary

Utilizing prompts in generative AI can be beneficial in software development as it accelerates code generation and provides valuable insights by taking advantage of the knowledge of bicycle-app-config technologies like JavaScript, React, Next.js, Chakra-UI, Axios, Node.js, MongoDB, GitHub, and AWS.