{"id":4044,"date":"2026-07-02T11:31:52","date_gmt":"2026-07-02T03:31:52","guid":{"rendered":"https:\/\/www.go2posts.com\/vn\/from-chat-to-diagram-a-hands-on-review-of-the-vpascode-automated-documentation-pipeline\/"},"modified":"2026-07-02T11:31:52","modified_gmt":"2026-07-02T03:31:52","slug":"from-chat-to-diagram-a-hands-on-review-of-the-vpascode-automated-documentation-pipeline","status":"publish","type":"post","link":"https:\/\/www.go2posts.com\/vn\/from-chat-to-diagram-a-hands-on-review-of-the-vpascode-automated-documentation-pipeline\/","title":{"rendered":"T\u1eeb Tr\u00f2 Chuy\u1ec7n \u0110\u1ebfn S\u01a1 \u0110\u1ed3: M\u1ed9t B\u00e0i \u0110\u00e1nh Gi\u00e1 Th\u1ef1c T\u1ebf V\u1ec1 D\u00f2ng D\u1eef Li\u1ec7u T\u1ef1 \u0110\u1ed9ng VPasCode"},"content":{"rendered":"

Gi\u1edbi Thi\u1ec7u<\/h2>\n

Trong th\u1ebf gi\u1edbi ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m \u0111\u1ea7y t\u1ed1c \u0111\u1ed9, t\u00e0i li\u1ec7u th\u01b0\u1eddng tr\u1edf th\u00e0nh \u0111i\u1ec3m ngh\u1ebdn. C\u00e1c k\u1ef9 s\u01b0 v\u00e0 qu\u1ea3n l\u00fd s\u1ea3n ph\u1ea9m d\u00e0nh h\u00e0ng gi\u1edd k\u00e9o v\u00e0 th\u1ea3 c\u00e1c h\u1ed9p trong c\u00e1c c\u00f4ng c\u1ee5 m\u00f4 h\u00ecnh h\u00f3a d\u1ef1a tr\u00ean giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng \u0111\u1ed3 h\u1ecda, ch\u1ec9 \u0111\u1ec3 nh\u1eefng s\u01a1 \u0111\u1ed3 \u0111\u00f3 tr\u1edf n\u00ean l\u1ed7i th\u1eddi ngay khi m\u00e3 ngu\u1ed3n thay \u0111\u1ed5i. L\u00e0 ng\u01b0\u1eddi \u0111\u00e3 d\u00e0nh nhi\u1ec1u n\u0103m n\u1ed1i li\u1ec1n kho\u1ea3ng c\u00e1ch gi\u1eefa y\u00eau c\u1ea7u k\u1ef9 thu\u1eadt v\u00e0 giao ti\u1ebfp tr\u1ef1c quan, t\u00f4i lu\u00f4n t\u00ecm ki\u1ebfm m\u1ed9t c\u00e1ch \u0111\u1ec3 l\u00e0m cho vi\u1ec7c v\u1ebd s\u01a1 \u0111\u1ed3 nhanh nh\u1eb9n nh\u01b0 vi\u1ebft m\u00e3.<\/p>\n

G\u1ea7n \u0111\u00e2y, t\u00f4i \u0111\u00e3 kh\u00e1m ph\u00e1 m\u1ed9t quy tr\u00ecnh h\u1ee9a h\u1eb9n gi\u1ea3i quy\u1ebft v\u1ea5n \u0111\u1ec1 n\u00e0y m\u1ed9t c\u00e1ch ch\u00ednh x\u00e1c: m\u1ed9t d\u00f2ng ch\u1ea3y t\u1ef1 \u0111\u1ed9ng l\u1ea5y c\u00e1c l\u1eddi nh\u1eafc ng\u00f4n ng\u1eef t\u1ef1 nhi\u00ean t\u1eeb tr\u1ee3 l\u00fd chatbot AI, chuy\u1ec3n \u0111\u1ed5i ch\u00fang th\u00e0nh\u00a0Visual Paradigm d\u01b0\u1edbi d\u1ea1ng M\u00e3 (VPasCode)<\/strong>, x\u00e1c th\u1ef1c c\u00fa ph\u00e1p, v\u00e0 xu\u1ea5t b\u1ea3n c\u00e1c s\u01a1 \u0111\u1ed3 tr\u1ef1c ti\u1ebfp l\u00ean trang t\u00e0i li\u1ec7u c\u1ee7a b\u1ea1n. \u0110i\u1ec1u n\u00e0y kh\u00f4ng ch\u1ec9 gi\u00fap ti\u1ebft ki\u1ec7m th\u1eddi gian; m\u00e0 c\u00f2n gi\u00fap b\u1ea1n coi c\u00e1c s\u01a1 \u0111\u1ed3 ki\u1ebfn tr\u00fac nh\u01b0 nh\u1eefng t\u00e0i s\u1ea3n \u0111\u01b0\u1ee3c ki\u1ec3m so\u00e1t phi\u00ean b\u1ea3n v\u00e0 c\u00f3 th\u1ec3 ki\u1ec3m th\u1eed. D\u01b0\u1edbi \u0111\u00e2y l\u00e0 ph\u00e2n t\u00edch s\u00e2u c\u1ee7a t\u00f4i v\u1ec1 c\u00e1ch quy tr\u00ecnh n\u00e0y ho\u1ea1t \u0111\u1ed9ng, v\u00ec sao n\u00f3 quan tr\u1ecdng, v\u00e0 c\u00e1ch b\u1ea1n c\u00f3 th\u1ec3 tri\u1ec3n khai n\u00f3 ngay h\u00f4m nay.<\/p>\n

Quy Tr\u00ecnh: Ph\u00e2n T\u00edch T\u1ef1 \u0110\u1ed9ng H\u00f3a<\/h2>\n

H\u1ea1t nh\u00e2n c\u1ee7a h\u1ec7 th\u1ed1ng n\u00e0y l\u00e0 m\u1ed9t chu\u1ed7i c\u00e1c s\u1ef1 ki\u1ec7n li\u1ec1n m\u1ea1ch, lo\u1ea1i b\u1ecf s\u1ef1 can thi\u1ec7p th\u1ee7 c\u00f4ng kh\u1ecfi quy tr\u00ecnh v\u1ebd s\u01a1 \u0111\u1ed3. Thay v\u00ec m\u1edf m\u1ed9t \u1ee9ng d\u1ee5ng m\u00e1y t\u00ednh \u0111\u1ec3 b\u00e0n n\u1eb7ng n\u1ec1, b\u1ea1n t\u01b0\u01a1ng t\u00e1c v\u1edbi m\u1ed9t giao di\u1ec7n d\u1ef1a tr\u00ean v\u0103n b\u1ea3n nh\u1eb9 nh\u00e0ng.<\/p>\n

Lu\u1ed3ng c\u1ea5p cao:<\/strong><\/p>\n

\"VPasCode:<\/p>\n

D\u01b0\u1edbi \u0111\u00e2y l\u00e0 c\u00e1ch t\u1eebng giai \u0111o\u1ea1n ho\u1ea1t \u0111\u1ed9ng trong th\u1ef1c t\u1ebf:<\/p>\n

    \n
  1. T\u1ea1o T\u1ea1o<\/strong>: B\u1ea1n b\u1eaft \u0111\u1ea7u b\u1eb1ng c\u00e1ch g\u1eedi m\u1ed9t kh\u00e1i ni\u1ec7m, t\u1ed5ng quan ki\u1ebfn tr\u00fac ho\u1eb7c y\u00eau c\u1ea7u ph\u1ea7n m\u1ec1m c\u1ee5 th\u1ec3 cho tr\u1ee3 l\u00fd chatbot AI. \u0110i\u1ec1u n\u00e0y t\u1eadn d\u1ee5ng kh\u1ea3 n\u0103ng hi\u1ec3u ng\u1eef c\u1ea3nh v\u00e0 c\u1ea5u tr\u00fac c\u1ee7a m\u00f4 h\u00ecnh ng\u00f4n ng\u1eef l\u1edbn (LLM).<\/li>\n
  2. Chuy\u1ec3n \u0110\u1ed5i<\/strong>: Tr\u1ee3 l\u00fd AI chuy\u1ec3n \u0111\u1ed5i l\u1eddi nh\u1eafc ng\u00f4n ng\u1eef t\u1ef1 nhi\u00ean c\u1ee7a b\u1ea1n th\u00e0nh\u00a0VPasCode<\/strong>. \u0110\u00e2y l\u00e0 m\u1ed9t ng\u00f4n ng\u1eef v\u0103n b\u1ea3n chuy\u00ean bi\u1ec7t, d\u00f9ng \u0111\u1ec3 \u0111\u1ecbnh ngh\u0129a c\u00e1c s\u01a1 \u0111\u1ed3 Visual Paradigm (nh\u01b0 UML, SysML ho\u1eb7c ERD) b\u1eb1ng v\u0103n b\u1ea3n thay v\u00ec giao di\u1ec7n k\u00e9o th\u1ea3.<\/li>\n
  3. X\u00e1c Th\u1ef1c<\/strong>: Tr\u01b0\u1edbc khi m\u00e3 n\u00e0o \u0111\u1ebfn \u0111\u01b0\u1ee3c kho l\u01b0u tr\u1eef c\u1ee7a b\u1ea1n, m\u1ed9t script x\u00e1c th\u1ef1c ho\u1eb7c tr\u00ecnh bi\u00ean d\u1ecbch s\u1ebd ki\u1ec3m tra VPasCode \u0111\u1ec3 ph\u00e1t hi\u1ec7n l\u1ed7i c\u00fa ph\u00e1p. \u0110i\u1ec1u quan tr\u1ecdng l\u00e0 b\u01b0\u1edbc n\u00e0y bao g\u1ed3m\u00a0S\u1eeda T\u1ef1 \u0110\u1ed9ng<\/strong>, n\u01a1i c\u00e1c quy t\u1eafc d\u1ef1a tr\u00ean AI ho\u1eb7c bi\u1ec3u th\u1ee9c ch\u00ednh quy (regex) s\u1ebd s\u1eeda c\u00e1c l\u1ed7i ph\u1ed5 bi\u1ebfn c\u1ee7a m\u00f4 h\u00ecnh ng\u00f4n ng\u1eef l\u1edbn, ch\u1eb3ng h\u1ea1n nh\u01b0 d\u1ea5u ngo\u1eb7c ch\u01b0a \u0111\u00f3ng, thi\u1ebfu bi\u1ec7t danh ho\u1eb7c h\u01b0\u1edbng m\u0169i t\u00ean sai.<\/li>\n
  4. Ti\u1ebfp Nh\u1eadn<\/strong>: M\u00e3 \u0111\u00e3 \u0111\u01b0\u1ee3c s\u1eeda s\u1ebd \u0111\u01b0\u1ee3c \u0111\u1ea9y v\u00e0o\u00a0D\u00f2ng D\u1eef Li\u1ec7u OpenDocs<\/strong>, th\u01b0\u1eddng th\u00f4ng qua Git ho\u1eb7c m\u1ed9t s\u1ef1 ki\u1ec7n API. \u0110i\u1ec1u n\u00e0y \u0111\u1ea3m b\u1ea3o m\u00e3 ngu\u1ed3n s\u01a1 \u0111\u1ed3 c\u1ee7a b\u1ea1n \u0111\u01b0\u1ee3c l\u01b0u c\u00f9ng v\u1edbi m\u00e3 \u1ee9ng d\u1ee5ng.<\/li>\n
  5. Tri\u1ec3n Khai<\/strong>: D\u00f2ng d\u1eef li\u1ec7u bi\u00ean d\u1ecbch m\u00e3 d\u1ef1a tr\u00ean v\u0103n b\u1ea3n th\u00e0nh c\u00e1c s\u01a1 \u0111\u1ed3 tr\u1ef1c quan (PNG ho\u1eb7c SVG) v\u00e0 nh\u00fang ch\u00fang t\u1ef1 \u0111\u1ed9ng v\u00e0o c\u00e1c trang web t\u00e0i li\u1ec7u ho\u1eb7c t\u1ec7p PDF.<\/li>\n<\/ol>\n

    Gi\u1ea3i Th\u00edch C\u00e1c Kh\u00e1i Ni\u1ec7m Ch\u00ednh<\/h2>\n

    \u0110\u1ec3 hi\u1ec3u r\u00f5 to\u00e0n b\u1ed9 quy tr\u00ecnh n\u00e0y, \u0111i\u1ec1u h\u1eefu \u00edch l\u00e0 n\u1eafm \u0111\u01b0\u1ee3c c\u00e1c c\u00f4ng ngh\u1ec7 n\u1ec1n t\u1ea3ng gi\u00fap n\u00f3 tr\u1edf n\u00ean kh\u1ea3 thi.<\/p>\n

    Visual Paradigm d\u01b0\u1edbi d\u1ea1ng M\u00e3 (VPasCode)<\/h3>\n

    VPasCode l\u00e0 \u0111\u1ed9ng c\u01a1 ph\u00eda sau s\u1ef1 thay \u0111\u1ed5i n\u00e0y. N\u00f3 cho ph\u00e9p b\u1ea1n \u0111\u1ecbnh ngh\u0129a c\u00e1c s\u01a1 \u0111\u1ed3 ph\u1ee9c t\u1ea1p b\u1eb1ng c\u00fa ph\u00e1p nghi\u00eam ng\u1eb7t, d\u1ec5 \u0111\u1ecdc cho con ng\u01b0\u1eddi. B\u1eb1ng c\u00e1ch r\u1eddi xa c\u00e1c \u0111\u1ecbnh d\u1ea1ng t\u1ec7p nh\u1ecb ph\u00e2n ho\u1eb7c tr\u1ea1ng th\u00e1i giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng ri\u00eang bi\u1ec7t, b\u1ea1n c\u00f3 th\u1ec3 so s\u00e1nh, h\u1ee3p nh\u1ea5t v\u00e0 xem x\u00e9t c\u00e1c thay \u0111\u1ed5i s\u01a1 \u0111\u1ed3 gi\u1ed1ng nh\u01b0 v\u1edbi m\u00e3 ngu\u1ed3n ti\u00eau chu\u1ea9n.<\/p>\n

    X\u00e1c minh c\u00fa ph\u00e1p v\u00e0 s\u1eeda l\u1ed7i t\u1ef1 \u0111\u1ed9ng<\/h3>\n

    M\u1ed9t trong nh\u1eefng tr\u1edf ng\u1ea1i l\u1edbn nh\u1ea5t \u0111\u1ed1i v\u1edbi m\u00e3 \u0111\u01b0\u1ee3c sinh ra b\u1edfi AI l\u00e0 \u0111\u1ed9 tin c\u1eady. C\u00e1c m\u00f4 h\u00ecnh ng\u00f4n ng\u1eef l\u1edbn (LLMs) r\u1ea5t gi\u1ecfi v\u1ec1 logic nh\u01b0ng c\u00f3 th\u1ec3 g\u1eb7p kh\u00f3 kh\u0103n v\u1edbi c\u00e1c quy t\u1eafc ng\u1eef ph\u00e1p nghi\u00eam ng\u1eb7t. L\u1edbp x\u00e1c minh \u0111\u00f3ng vai tr\u00f2 nh\u01b0 m\u1ed9t l\u1edbp b\u1ea3o v\u1ec7. N\u00f3 ph\u00e2n t\u00edch \u0111\u1ea7u ra \u0111\u1ec3 \u0111\u1ea3m b\u1ea3o t\u1ea5t c\u1ea3 c\u00e1c m\u0169i t\u00ean, h\u00ecnh d\u1ea1ng, m\u1ed1i quan h\u1ec7 v\u00e0 kh\u1ed1i \u0111\u1ec1u tu\u00e2n th\u1ee7 \u0111\u00fang c\u00e1c quy t\u1eafc ng\u1eef ph\u00e1p nghi\u00eam ng\u1eb7t c\u1ee7a b\u1ed9 m\u00e1y m\u00f4 h\u00ecnh h\u00f3a. N\u1ebfu AI m\u1eafc m\u1ed9t l\u1ed7i ch\u00ednh t\u1ea3 nh\u1ecf\u2014v\u00ed d\u1ee5 nh\u01b0 qu\u00ean d\u1ea5u hai ch\u1ea5m ho\u1eb7c c\u0103n ch\u1ec9nh sai m\u1ed9t th\u00e0nh vi\u00ean\u2014th\u00ec l\u1edbp s\u1eeda l\u1ed7i t\u1ef1 \u0111\u1ed9ng s\u1ebd kh\u1eafc ph\u1ee5c ngay l\u1eadp t\u1ee9c, \u0111\u1ea3m b\u1ea3o lu\u1ed3ng x\u1eed l\u00fd kh\u00f4ng bao gi\u1edd b\u1ecb gi\u00e1n \u0111o\u1ea1n do nh\u1eefng l\u1ed7i \u0111\u1ecbnh d\u1ea1ng nh\u1ecf nh\u1eb7t.<\/p>\n

    V\u00ed d\u1ee5 t\u1eebng b\u01b0\u1edbc: X\u00e2y d\u1ef1ng s\u01a1 \u0111\u1ed3 tu\u1ea7n t\u1ef1 \u0111\u0103ng nh\u1eadp<\/h2>\n

    H\u00e3y c\u00f9ng \u0111i qua m\u1ed9t t\u00ecnh hu\u1ed1ng th\u1ef1c t\u1ebf \u0111\u1ec3 th\u1ea5y c\u00e1ch th\u1ee9c n\u00e0y ho\u1ea1t \u0111\u1ed9ng trong th\u1ef1c t\u1ebf. Gi\u1ea3 s\u1eed t\u00f4i c\u1ea7n t\u00e0i li\u1ec7u h\u00f3a lu\u1ed3ng x\u00e1c th\u1ef1c cho m\u1ed9t \u1ee9ng d\u1ee5ng web m\u1edbi.<\/p>\n

    1. \u0110\u1ea7u v\u00e0o t\u1eeb chatbot AI<\/h3>\n

    T\u00f4i m\u1edf giao di\u1ec7n chat AI \u01b0a th\u00edch c\u1ee7a m\u00ecnh v\u00e0 nh\u1eadp m\u1ed9t y\u00eau c\u1ea7u \u0111\u01a1n gi\u1ea3n, b\u1eb1ng ng\u00f4n ng\u1eef t\u1ef1 nhi\u00ean:<\/p>\n

    \n

    \u201cT\u1ea1o m\u1ed9t s\u01a1 \u0111\u1ed3 tu\u1ea7n t\u1ef1 n\u01a1i m\u1ed9t Ng\u01b0\u1eddi d\u00f9ng \u0111\u0103ng nh\u1eadp v\u00e0o \u1ee8ng d\u1ee5ng Web, v\u00e0 \u1ee8ng d\u1ee5ng Web x\u00e1c th\u1ef1c ng\u01b0\u1eddi d\u00f9ng th\u00f4ng qua m\u1ed9t API X\u00e1c th\u1ef1c.\u201d<\/p>\n<\/blockquote>\n

    2. Sinh m\u00e3 VPasCode v\u00e0 ki\u1ec3m tra c\u00fa ph\u00e1p<\/h3>\n

    AI x\u1eed l\u00fd y\u00eau c\u1ea7u v\u00e0 t\u1ea1o ra m\u00f4 h\u00ecnh d\u1ef1a tr\u00ean v\u0103n b\u1ea3n. Trong m\u1ed9t c\u1ea5u h\u00ecnh truy\u1ec1n th\u1ed1ng, t\u00f4i c\u00f3 th\u1ec3 ph\u1ea3i sao ch\u00e9p d\u00e1n v\u00e0o m\u1ed9t c\u00f4ng c\u1ee5 v\u00e0 s\u1eeda l\u1ed7i th\u1ee7 c\u00f4ng. \u1ede \u0111\u00e2y, l\u1edbp S\u1eeda l\u1ed7i t\u1ef1 \u0111\u1ed9ng x\u1eed l\u00fd m\u1ecdi v\u1ea5n \u0111\u1ec1 nh\u1ecf ng\u1ea7m ph\u00eda sau.<\/p>\n

    \u0110\u1ea7u ra VPasCode h\u1ee3p l\u1ec7:<\/strong><\/p>\n

    \n
    \nPlantuml<\/span>
    \n
    \n<\/path><\/path><\/svg>
    \nCh\u1ec9nh s\u1eeda Plantuml trong VPasCode<\/span>
    \n<\/a>\n<\/div>\n
    \n
    \r\n
    \r\n Plantuml<\/span>\r\n \r\n <\/path><\/path><\/svg>\r\n Edit Plantuml in VPasCode<\/span>\r\n <\/a>\r\n <\/div>\r\n
    \r\n 
    @startuml\r\n\r\nparticipant User\r\nparticipant WebApp as \"\u1ee8ng d\u1ee5ng Web\"\r\nparticipant AuthAPI as \"API X\u00e1c th\u1ef1c\"\r\n\r\nUser -> WebApp: Nh\u1eadp th\u00f4ng tin \u0111\u0103ng nh\u1eadp (t\u00ean ng\u01b0\u1eddi d\u00f9ng, m\u1eadt kh\u1ea9u)\r\nWebApp -> AuthAPI: ValidateCredentials(t\u00ean ng\u01b0\u1eddi d\u00f9ng, hash)\r\nAuthAPI --> WebApp: Token (Th\u00e0nh c\u00f4ng 200 OK)\r\nWebApp --> User: Chuy\u1ec3n h\u01b0\u1edbng \u0111\u1ebfn B\u1ea3ng \u0111i\u1ec1u khi\u1ec3n\r\n\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                
    \r\n                    \r\n                        <\/path><\/path><\/svg>\r\n                        Edit Plantuml in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n
    \n
    \n<\/path><\/path><\/svg>
    \nCh\u1ec9nh s\u1eeda Plantuml trong VPasCode<\/span>
    \n<\/a>\n<\/div>\n<\/div>\n
    L\u01b0u \u00fd: N\u1ebfu AI qu\u00ean th\u1ebb \u0111\u00f3ng\u00a0@end_diagram<\/code>\u00a0ho\u1eb7c vi\u1ebft sai\u00a0Participant<\/code>, th\u00ec k\u1ecbch b\u1ea3n x\u00e1c minh s\u1ebd ph\u00e1t hi\u1ec7n v\u00e0 s\u1eeda l\u1ed7i tr\u01b0\u1edbc khi ti\u1ebfp t\u1ee5c.<\/em><\/p>\n
    3. X\u1eed l\u00fd lu\u1ed3ng OpenDocs<\/h3>\n
    Sau khi m\u00e3 \u0111\u01b0\u1ee3c x\u00e1c minh, t\u1ec7p (v\u00ed d\u1ee5 nh\u01b0\u00a0login_flow.vpas<\/code>) s\u1ebd \u0111\u01b0\u1ee3c \u0111\u1ea9y v\u00e0o kho l\u01b0u tr\u1eef t\u00e0i li\u1ec7u. Sau \u0111\u00f3, lu\u1ed3ng t\u1ef1 \u0111\u1ed9ng h\u00f3a s\u1ebd \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t:<\/p>\n