{"id":5410,"date":"2025-12-23T17:24:15","date_gmt":"2025-12-23T17:24:15","guid":{"rendered":"https:\/\/blog.ggonggong.com\/?p=5410"},"modified":"2025-12-23T17:24:15","modified_gmt":"2025-12-23T17:24:15","slug":"%eb%a8%b8%eb%a9%94%ec%9d%b4%eb%93%9c%ec%b0%a8%ed%8a%b8%ec%9d%98-%ec%a2%85%eb%a5%98-3","status":"publish","type":"post","link":"https:\/\/blog.ggonggong.com\/?p=5410","title":{"rendered":"\uba38\uba54\uc774\ub4dc\ucc28\ud2b8\uc758 \uc885\ub958"},"content":{"rendered":"

<\/p>\n

\n<\/div>\n

\uba38\uba54\uc774\ub4dc(Mermaid) \ucc28\ud2b8 \uc644\uc804 \uc815\ubcf5: \uc885\ub958\ubcc4 \uc774\ud574\uc640 \ud604\uc5c5 \ud65c\uc6a9 \uac00\uc774\ub4dc<\/h2>\n
\n

\uc11c\ub860: \ucf54\ub4dc\ub85c \ub9cc\ub098\ub294 \uc2dc\uac01\uc801 \uc124\uacc4\uc758 \ud601\uba85<\/strong><\/p>\n

\u201c\ubb38\uc11c \uc5c5\ub370\uc774\ud2b8\ud560 \ub54c\ub9c8\ub2e4 \ub2e4\uc774\uc5b4\uadf8\ub7a8\uc774 \uc9c0\uc6cc\uc838\uc11c \ub610 \ucc98\uc74c\ubd80\ud130 \uadf8\ub824\uc57c \ud574!\u201d
\n\u201c\ud300\uc6d0\ub4e4\uc774 \uac01\uc790 \ub2e4\ub978 \ud234\ub85c \ub9cc\ub4e0 \ub2e4\uc774\uc5b4\uadf8\ub7a8\uc774 \ud638\ud658 \uc548 \ub41c\ub2e4\uace0?\u201d<\/p>\n

\uc18c\ud504\ud2b8\uc6e8\uc5b4 \uac1c\ubc1c\uc790\ubd80\ud130 \uae30\uc220 \ubb38\uc11c \uc791\uc131\uc790\uae4c\uc9c0, \ubcf5\uc7a1\ud55c \uc2dc\uc2a4\ud15c\uc744 \uc2dc\uac01\ud654\ud560 \ub54c \ub204\uad6c\ub098 \ud55c \ubc88\ucbe4 \uacaa\ub294 \uace0\ubbfc\uc785\ub2c8\ub2e4. \uc774\ub7f0 \ubb38\uc81c\uc758 \ud574\ub2f5\uc73c\ub85c \ub4f1\uc7a5\ud55c \uac83\uc774 \ubc14\ub85c \uba38\uba54\uc774\ub4dc(Mermaid.js)<\/strong> \uc785\ub2c8\ub2e4. \uba38\uba54\uc774\ub294 \ub2e8\uc21c \ud14d\uc2a4\ud2b8 \uae30\ubc18 \ubb38\ubc95\uc73c\ub85c \ub2e4\uc591\ud55c \ub2e4\uc774\uc5b4\uadf8\ub7a8\uc744 \uc0dd\uc131\ud558\ub294 \uc624\ud508\uc18c\uc2a4 \ub3c4\uad6c\ub85c, Git \uc800\uc7a5\uc18c, \ub9c8\ud06c\ub2e4\uc6b4 \ud30c\uc77c, Confluence, Notion \ub4f1\uacfc \uc27d\uac8c \ud1b5\ud569\ub429\ub2c8\ub2e4. \ucf54\ub4dc\ucc98\ub7fc \ubc84\uc804 \uad00\ub9ac\uac00 \uac00\ub2a5\ud558\uace0, \ud50c\ub7ab\ud3fc \uc758\uc874\uc131\uc774 \uc5c6\uc73c\uba70, \uc774\ud574\ud558\uae30 \uc26c\uc6b4 \ubb38\ubc95<\/strong>\uc73c\ub85c \ud611\uc5c5 \ud6a8\uc728\uc131\uc744 \uadf9\ub300\ud654\ud569\ub2c8\ub2e4. \uc624\ub298\uc740 \uba38\uba54\uc774\uac00 \uc81c\uacf5\ud558\ub294 \uc8fc\uc694 \ucc28\ud2b8 \uc885\ub958\ub97c \uae4a\uc774 \ud30c\ud5e4\uce58\uace0, \uc5b4\ub5a4 \uc0c1\ud669\uc5d0 \uc5b4\ub5a4 \ucc28\ud2b8\ub97c \uc0ac\uc6a9\ud574\uc57c \ud558\ub294\uc9c0 \uc2e4\uc804 \ud301\uacfc \ud568\uaed8 \uc18c\uac1c\ud569\ub2c8\ub2e4.<\/p>\n

\n

\ubcf8\ubb38: \uba38\uba54\uc774\ub4dc\uc758 \ud575\uc2ec \ucc28\ud2b8 \uc885\ub958\uc640 \uad6c\uccb4\uc801 \ud65c\uc6a9\ubc95<\/h3>\n

1. \ud50c\ub85c\uc6b0\ucc28\ud2b8 (Flowchart)<\/h4>\n
    \n
  • \uc6a9\ub3c4:<\/strong> \ud504\ub85c\uc138\uc2a4, \uc54c\uace0\ub9ac\uc998, \uc758\uc0ac\uacb0\uc815 \ud750\ub984, \uc5c5\ubb34 \uc808\ucc28\ub97c \uc9c1\uad00\uc801\uc73c\ub85c \ud45c\ud604. \uac00\uc7a5 \uae30\ubcf8\uc801\uc774\uace0 \ud65c\uc6a9\ub3c4 \ub192\uc740 \ucc28\ud2b8.
    \nMERMAID_PLACEHOLDER_0<\/strong><\/li>\n
  • \uc8fc\uc694 \ud2b9\uc9d5:<\/strong>\n
      \n
    • \ub178\ub4dc \ubaa8\uc591: [ ]<\/code> (\uc9c1\uc0ac\uac01\ud615 – \uacfc\uc815), { }<\/code> (\ub9c8\ub984\ubaa8 – \uc870\uac74), (( ))<\/code> (\uc6d0 – \uc2dc\uc791\/\uc885\ub8cc), >]<\/code> (\ub4a4\uc9d1\ud78c \uc0ac\ub2e4\ub9ac\uaf34 – \uc218\ub3d9 \uc785\ub825), [\/ \/]<\/code> (\ub9c8\ub984\ubaa8 – \ubcd1\ub82c \ucc98\ub9ac) \ub4f1.<\/li>\n
    • \uc5f0\uacb0\uc120: --><\/code> (\uc2e4\uc120 \ud654\uc0b4\ud45c), -.-><\/code> (\uc810\uc120 \ud654\uc0b4\ud45c), ==><\/code> (\uad75\uc740 \ud654\uc0b4\ud45c), -- \ud14d\uc2a4\ud2b8 --><\/code> (\ub77c\ubca8 \ucd94\uac00).<\/li>\n
    • \ud558\uc704 \uadf8\ub798\ud504 \uc815\uc758 \uac00\ub2a5 (subgraph id [...] end<\/code>).<\/li>\n
    • \ubc29\ud5a5 \uc81c\uc5b4 (TD<\/code>: Top-Down, LR<\/code>: Left-Right, RL<\/code>: Right-Left, BT<\/code>: Bottom-Top).<\/li>\n<\/ul>\n<\/li>\n
    • \uc2e4\uc6a9\uc801 \ud301:<\/strong>\n
        \n
      • \ubcf5\uc7a1\ud55c \ud50c\ub85c\uc6b0\ub294 \uc5ec\ub7ec \uac1c\uc758 \uc791\uc740 \uc11c\ube0c\uadf8\ub798\ud504\ub85c \ubd84\ud560\ud558\uc5ec \uac00\ub3c5\uc131 \ud5a5\uc0c1.<\/li>\n
      • \ub178\ub4dc\uc640 \uc120\uc5d0 CSS \ud074\ub798\uc2a4\ub97c \uc801\uc6a9\ud558\uc5ec \uc2a4\ud0c0\uc77c\ub9c1 \uac00\ub2a5 (style \ub178\ub4dcid fill:#f9f,stroke:#333<\/code>).<\/li>\n
      • \uae30\ubcf8 \ubc29\ud5a5(TD<\/code>) \uc678 LR<\/code>(\uac00\ub85c) \ubc29\ud5a5\ub3c4 \ub9ce\uc774 \uc0ac\uc6a9\ub418\uba70, \ub514\uc2a4\ud50c\ub808\uc774 \uacf5\uac04\uc5d0 \ub9de\ucdb0 \uc120\ud0dd.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

        2. \uc2dc\ud000\uc2a4 \ub2e4\uc774\uc5b4\uadf8\ub7a8 (Sequence Diagram)<\/h4>\n
          \n
        • \uc6a9\ub3c4:<\/strong> \uac1d\uccb4\ub098 \uc2dc\uc2a4\ud15c \ucef4\ud3ec\ub10c\ud2b8 \uac04\uc758 \uc2dc\uac04 \ud750\ub984\uc5d0 \ub530\ub978 \uc0c1\ud638\uc791\uc6a9(\uba54\uc2dc\uc9c0 \uad50\ud658)\uc744 \uba85\ud655\ud788 \ubcf4\uc5ec\uc90c. \ud2b9\ud788 API \ud638\ucd9c, \uba54\uc2dc\uc9d5 \uc2dc\uc2a4\ud15c \uc124\uacc4\uc5d0 \ud544\uc218.
          \nMERMAID_PLACEHOLDER_1<\/strong><\/li>\n
        • \uc8fc\uc694 \ud2b9\uc9d5:<\/strong>\n
            \n
          • \ucc38\uc5ec\uc790 \uc815\uc758: participant<\/code>, actor<\/code>, boundary<\/code>, database<\/code> \ub4f1\uc73c\ub85c \uc5ed\ud560 \uc9c0\uc815 \ubc0f \ubcc4\uce6d(as<\/code>) \uc0ac\uc6a9 \uac00\ub2a5.<\/li>\n
          • \uba54\uc2dc\uc9c0 \ud0c0\uc785: ->><\/code> (\uc2e4\uc120 \ud654\uc0b4\ud45c), -->><\/code> (\uc810\uc120 \ubc18\ud658 \uba54\uc2dc\uc9c0), ->x<\/code> (\ube44\ub3d9\uae30, \ub370\uc774\ud130 \uc5c6\uc74c), ->>+<\/code> (\ube44\ub3d9\uae30 + \ud65c\uc131\ud654).<\/li>\n
          • \ud65c\uc131\ud654 \ub9c9\ub300: activate<\/code>\/deactivate<\/code> \ub610\ub294 +<\/code>\/-<\/code> \uc811\ub450\uc0ac\ub85c \uac1d\uccb4\uac00 \uc791\uc5c5\uc744 \uc218\ud589 \uc911\uc784\uc744 \ud45c\uc2dc (activate B<\/code>).<\/li>\n
          • \ub8e8\ud504(loop<\/code>), \uc870\uac74\ubb38(alt<\/code>, opt<\/code>), \ubcd1\ub82c \ucc98\ub9ac(par<\/code>), \uc8fc\uc11d(Note<\/code>) \ucd94\uac00 \uac00\ub2a5.<\/li>\n<\/ul>\n<\/li>\n
          • \uc2e4\uc6a9\uc801 \ud301:<\/strong>\n
              \n
            • \ubcf5\uc7a1\ub3c4 \uad00\ub9ac: \ub108\ubb34 \ub9ce\uc740 \ucc38\uc5ec\uc790\ub098 \uba54\uc2dc\uc9c0\uac00 \uc0dd\uae30\uc9c0 \uc54a\ub3c4\ub85d \uc8fc\uc758.<\/li>\n
            • loop<\/code>, alt<\/code> \uad6c\ubb38 \ub0b4\ubd80\uc5d0 \ub4e4\uc5ec\uc4f0\uae30\ub97c \ud65c\uc6a9\ud558\uc5ec \uac00\ub3c5\uc131 \ud655\ubcf4.<\/li>\n
            • \uc8fc\uc11d(Note left of A: ...<\/code>)\uc744 \ud65c\uc6a9\ud574 \ud575\uc2ec \ub3d9\uc791 \uc124\uba85 \ucd94\uac00.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

              3. \ud074\ub798\uc2a4 \ub2e4\uc774\uc5b4\uadf8\ub7a8 (Class Diagram)<\/h4>\n
                \n
              • \uc6a9\ub3c4:<\/strong> \uac1d\uccb4 \uc9c0\ud5a5 \ud504\ub85c\uadf8\ub798\ubc0d(OOP)\uc5d0\uc11c \ud074\ub798\uc2a4\uc758 \uad6c\uc870, \uc18d\uc131(\uba64\ubc84 \ubcc0\uc218), \uba54\uc11c\ub4dc, \uadf8\ub9ac\uace0 \ud074\ub798\uc2a4 \uac04 \uad00\uacc4(\uc0c1\uc18d, \uc5f0\uad00, \uc758\uc874 \ub4f1)\ub97c \ud45c\ud604.
                \nMERMAID_PLACEHOLDER_2<\/strong><\/li>\n
              • \uc8fc\uc694 \ud2b9\uc9d5:<\/strong>\n
                  \n
                • \ud074\ub798\uc2a4 \uc815\uc758: class \uc774\ub984 { ... }<\/code>. \uba64\ubc84 \ud45c\uae30: +<\/code>(public), -<\/code>(private), #<\/code>(protected), ~<\/code>(package).<\/li>\n
                • \uad00\uacc4 \ud45c\ud604:<\/strong>\n
                    \n
                  • \uc0c1\uc18d(Generalization): <|--<\/code> (\uc0bc\uac01\ud615-\uc2e4\uc120 \uc790\uc2dd->\ubd80\ubaa8)<\/li>\n
                  • \uc2e4\uccb4\ud654(Realization): <|..<\/code><\/li>\n
                  • \uc5f0\uad00(Association): --><\/code> (\ud654\uc0b4\ud45c \ubc29\ud5a5 \uc911\uc694), --<\/code> (\uc591\ubc29\ud5a5). \ub2e4\uc911\uc131("1"<\/code>, "0..*"<\/code>, "n"<\/code>), \ub77c\ubca8 \ucd94\uac00 \uac00\ub2a5.<\/li>\n
                  • \uc9d1\ud569(Aggregation): o--<\/code> (\uc18d\uc774 \ube48 \ub2e4\uc774\uc544\ubaac\ub4dc-\uc2e4\uc120 \uc804\uccb4->\ubd80\ubd84) – \uc804\uccb4\uac00 \uc0ac\ub77c\uc838\ub3c4 \ubd80\ubd84\uc740 \uc874\uc7ac \uac00\ub2a5.<\/li>\n
                  • \ud569\uc131(Composition): *--<\/code> (\uc18d\uc774 \ucc2c \ub2e4\uc774\uc544\ubaac\ub4dc-\uc2e4\uc120 \uc804\uccb4->\ubd80\ubd84) – \uc804\uccb4\uac00 \uc0ac\ub77c\uc9c0\uba74 \ubd80\ubd84\ub3c4 \uc0ac\ub77c\uc9d0. \ub354 \uac15\ud55c \uad00\uacc4.<\/li>\n
                  • \uc758\uc874(Dependency): ..><\/code> (\uc810\uc120 \ud654\uc0b4\ud45c) – \ud55c \ud074\ub798\uc2a4 \ubcc0\uacbd\uc774 \ub2e4\ub978 \ud074\ub798\uc2a4\uc5d0 \uc601\ud5a5 \uc904 \ub54c \uc0ac\uc6a9.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n
                  • \uc2e4\uc6a9\uc801 \ud301:<\/strong>\n
                      \n
                    • \ud074\ub798\uc2a4 \uc0ac\uc774\uc758 \uad00\uacc4\ub294 \uc124\uacc4\uc758 \ud575\uc2ec \ub178\ucd9c\ud558\ubbc0\ub85c \uba85\ud655\ud558\uace0 \uc815\ud655\ud558\uac8c \ud45c\ud604.<\/li>\n
                    • \ub124\uc784\uc2a4\ud398\uc774\uc2a4 \uc9c0\uc6d0 (namespace \ud328\ud0a4\uc9c0\uba85 { class A ... }<\/code>).<\/li>\n
                    • direction LR<\/code> \ub610\ub294 direction RL<\/code> \uc0ac\uc6a9\ud558\uc5ec \uc870\ubc00\ud55c \ub2e4\uc774\uc5b4\uadf8\ub7a8 \ub808\uc774\uc544\uc6c3 \ucd5c\uc801\ud654.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

                      4. \uc0c1\ud0dc \ub2e4\uc774\uc5b4\uadf8\ub7a8 (State Diagram)<\/h4>\n
                        \n
                      • \uc6a9\ub3c4:<\/strong> \ud558\ub098\uc758 \uac1d\uccb4(\uc2dc\uc2a4\ud15c, \ucef4\ud3ec\ub10c\ud2b8) \ub0b4\uc5d0\uc11c \ubc1c\uc0dd\ud558\ub294 \uc0c1\ud0dc \ubcc0\uacbd(State Transition)\uacfc \uc774\ub97c \uc720\ubc1c\ud558\ub294 \uc774\ubca4\ud2b8\/\uc870\uac74, \uadf8\ub9ac\uace0 \uc0c1\ud0dc \ub0b4\uc5d0\uc11c\uc758 \ub3d9\uc791\uc744 \ubaa8\ub378\ub9c1. \ubcf5\uc7a1\ud55c \ubcd1\ud589 \uc0c1\ud0dc \ud45c\ud604 \uac00\ub2a5.
                        \nMERMAID_PLACEHOLDER_3<\/strong><\/li>\n
                      • \uc8fc\uc694 \ud2b9\uc9d5:<\/strong>\n
                          \n
                        • \uc0c1\ud0dc: state \uc0c1\ud0dc\uba85<\/code> \ub610\ub294 state "\uc0c1\ud0dc\uba85" as id<\/code>. \ucd08\uae30 \uc0c1\ud0dc: [*]<\/code>, \ucd5c\uc885 \uc0c1\ud0dc: [*]<\/code>.<\/li>\n
                        • \uc804\ud658: \uc0c1\ud0dc --> \uc0c1\ud0dc : \uc774\ubca4\ud2b8\/\uc870\uac74 [\uc870\uac74] \/ \uc561\uc158<\/code><\/li>\n
                        • \ud569\uc131 \uc0c1\ud0dc(Composite State): \ub0b4\ubd80\uc5d0 \ub2e4\uc2dc \ud558\uc704 \uc0c1\ud0dc \uba38\uc2e0 \uac00\uc9d0 (state \ud070\uc0c1\ud0dc { ... }<\/code>).<\/li>\n
                        • \uc120\ud0dd\uc810(Choice)\/\ud3ec\ud06c(Fork)\/\uc870\uc778(Join)\/\ud788\uc2a4\ud1a0\ub9ac(History) \ub4f1 \ud2b9\uc218 \ub178\ub4dc \uc0ac\uc6a9 \uac00\ub2a5 (state choice_state <<choice>><\/code>).<\/li>\n<\/ul>\n<\/li>\n
                        • \uc2e4\uc6a9\uc801 \ud301:<\/strong>\n
                            \n
                          • \ubcf5\uc7a1\ud55c \uc0c1\ud0dc \uba38\uc2e0 \ubd84\ud574\ub97c \uc704\ud574 \ud569\uc131 \uc0c1\ud0dc \uc801\uadf9 \ud65c\uc6a9.<\/li>\n
                          • stateDiagram-v2<\/code> \uc0ac\uc6a9 \uad8c\uc7a5 (\uae30\uc874 v1\ubcf4\ub2e4 \ud45c\ud604\ub825 \ud5a5\uc0c1).<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

                            5. \uc0ac\uc6a9\uc790 \uc5ec\uc815 \ub2e4\uc774\uc5b4\uadf8\ub7a8 (User Journey Diagram)<\/h4>\n
                              \n
                            • \uc6a9\ub3c4:<\/strong> \ucd5c\uc885 \uc0ac\uc6a9\uc790\uac00 \uc81c\ud488\/\uc11c\ube44\uc2a4\ub97c \uc0ac\uc6a9\ud558\uba70 \uacaa\ub294 \uc804\uccb4\uc801\uc778 \uc5ec\uc815(\uc0ac\uc6a9\uc790 \uc2a4\ud1a0\ub9ac)\uc744 \ud398\ub974\uc18c\ub098\ubcc4\ub85c \uc2dc\uac01\ud654. \uc0ac\uc6a9\uc790 \uacbd\ud5d8(UX) \ub514\uc790\uc778, \uace0\uac1d \uc9c0\ub3c4(Customer Journey Mapping) \ud575\uc2ec \ub3c4\uad6c.\n
                              journey\n  title \uc1fc\ud551 \uc6f9\uc0ac\uc774\ud2b8 \uad6c\ub9e4 \uacfc\uc815\n  section \ud648\ud398\uc774\uc9c0 \ubc29\ubb38\n    \ub79c\ub529 \ud398\uc774\uc9c0 \ud655\uc778: 5: User\n    \uc0c1\ud488 \uac80\uc0c9: 5: User\n    \uce74\ud14c\uace0\ub9ac \ud0d0\uc0c9: 5: User\n  section \uc0c1\ud488 \uc0c1\uc138\n    \uc0c1\ud488 \uc0c1\uc138 \ud398\uc774\uc9c0<\/code><\/pre>\n<\/li>\n<\/ul>\n
                              <\/p>\n
                                import mermaid from ‘https:\/\/cdn.jsdelivr.net\/npm\/mermaid@10\/dist\/mermaid.esm.min.mjs’;<\/p>\n
                                mermaid.initialize({
                              \n    startOnLoad: true,
                              \n    theme: ‘default’,
                              \n    securityLevel: ‘strict’,
                              \n    fontFamily: ‘Arial, sans-serif’,
                              \n    flowchart: {
                              \n      useMaxWidth: true,
                              \n      htmlLabels: true,
                              \n      curve: ‘basis’,
                              \n    },
                              \n  });<\/p>\n
                                \/\/ \ud398\uc774\uc9c0 \ub85c\ub4dc \ud6c4 \ub80c\ub354\ub9c1
                              \n  if (document.readyState === ‘loading’) {
                              \n    document.addEventListener(‘DOMContentLoaded’, () => {
                              \n      mermaid.run();
                              \n    });
                              \n  } else {
                              \n    mermaid.run();
                              \n  }<\/p>\n","protected":false},"excerpt":{"rendered":"
                              \uba38\uba54\uc774\ub4dc(Mermaid) \ucc28\ud2b8 \uc644\uc804 \uc815\ubcf5: \uc885\ub958\ubcc4 \uc774\ud574\uc640 \ud604\uc5c5 \ud65c\uc6a9 \uac00\uc774\ub4dc \uc11c\ub860: \ucf54\ub4dc\ub85c \ub9cc\ub098\ub294 \uc2dc\uac01\uc801 \uc124\uacc4\uc758 \ud601\uba85 \u201c\ubb38\uc11c \uc5c5\ub370\uc774\ud2b8\ud560 \ub54c\ub9c8\ub2e4 \ub2e4\uc774\uc5b4\uadf8\ub7a8\uc774 \uc9c0\uc6cc\uc838\uc11c \ub610 \ucc98\uc74c\ubd80\ud130 \uadf8\ub824\uc57c \ud574!\u201d \u201c\ud300\uc6d0\ub4e4\uc774 \uac01\uc790 \ub2e4\ub978 \ud234\ub85c \ub9cc\ub4e0 \ub2e4\uc774\uc5b4\uadf8\ub7a8\uc774 \ud638\ud658 \uc548 \ub41c\ub2e4\uace0?\u201d \uc18c\ud504\ud2b8\uc6e8\uc5b4 \uac1c\ubc1c\uc790\ubd80\ud130 \uae30\uc220 \ubb38\uc11c \uc791\uc131\uc790\uae4c\uc9c0, \ubcf5\uc7a1\ud55c \uc2dc\uc2a4\ud15c\uc744 \uc2dc\uac01\ud654\ud560 \ub54c \ub204\uad6c\ub098 \ud55c \ubc88\ucbe4 \uacaa\ub294 \uace0\ubbfc\uc785\ub2c8\ub2e4. \uc774\ub7f0 \ubb38\uc81c\uc758 \ud574\ub2f5\uc73c\ub85c \ub4f1\uc7a5\ud55c \uac83\uc774 \ubc14\ub85c \uba38\uba54\uc774\ub4dc(Mermaid.js) \uc785\ub2c8\ub2e4.… <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[52],"tags":[],"class_list":["post-5410","post","type-post","status-publish","format-standard","hentry","category-blog-tips"],"jetpack_publicize_connections":[],"_links":{"self":[{"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/posts\/5410","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5410"}],"version-history":[{"count":1,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/posts\/5410\/revisions"}],"predecessor-version":[{"id":5411,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=\/wp\/v2\/posts\/5410\/revisions\/5411"}],"wp:attachment":[{"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5410"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5410"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.ggonggong.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5410"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}