Skip to content

0.4-New-note-diagram.md

Latest commit

 

History

History
53 lines (43 loc) · 1.66 KB

0.4-New-note-diagram.md

File metadata and controls

53 lines (43 loc) · 1.66 KB
Raw
    sequenceDiagram
        participant Browser
        participant Server

        Browser->>Server: GET /exampleapp/notes
        activate Server
        Server-->>Browser: HTML document
        deactivate Server

        Browser->>Server: GET /exampleapp/main.css
        activate Server
        Server-->>Browser: CSS file
        deactivate Server

        Browser->>Server: GET /exampleapp/main.js
        activate Server
        Server-->>Browser: JavaScript file
        deactivate Server

        Note over Browser: JavaScript starts executing and fetches data from data.json
        Browser->>Server: GET /exampleapp/data.json
        activate Server
        Server-->>Browser: JSON data[{ "content": "HTML is easy", "date": "2023-1-1" }, ... ]
        deactivate Server

        Note over Browser: JavaScript renders notes using fetched data
        
        Browser->>Server: on submit: POST /exampleapp/new_note
        activate Server
        Server-->>Browser: Response with status code 302 and Location: exampleapp/notes
        deactivate Server

        Browser->>Server: GET /exampleapp/notes
        activate Server
        Server-->>Browser: HTML document
        deactivate Server

        Browser->>Server: GET exampleapp/main.css
        activate Server
        Server-->>Browser: CSS file
        deactivate Server

        Browser->>Server: GET /exampleapp/main.js
        activate Server
        Server-->>Browser: JavaScript file
        deactivate Server

        Browser->>Server: GET /exampleapp/data.json
        activate Server
        Server-->>Browser: JSON data[{ "content": "HTML is easy", "date": "2023-1-1" }, ... ]
        deactivate Server
Loading