{"id":672,"date":"2025-02-18T15:42:00","date_gmt":"2025-02-18T06:42:00","guid":{"rendered":"https:\/\/blog.anchors-biz.com\/?p=672"},"modified":"2025-02-25T19:47:18","modified_gmt":"2025-02-25T10:47:18","slug":"react-hook-usecontext-%ec%9d%b4%ed%95%b4%ed%95%98%ea%b8%b0","status":"publish","type":"post","link":"https:\/\/blog.anchors-biz.com\/?p=672","title":{"rendered":"React Hook – UseContext \uc774\ud574\ud558\uae30"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

React\ub294 \ucef4\ud3ec\ub10c\ud2b8 \uac04 \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud558\uace0 \ub370\uc774\ud130\ub97c \uacf5\uc720\ud558\uae30 \uc704\ud55c \ub2e4\uc591\ud55c \ub3c4\uad6c\ub97c \uc81c\uacf5\ud569\ub2c8\ub2e4. \uadf8\uc911\uc5d0\uc11c\ub3c4 Context API<\/strong>\uc640 useContext <\/strong>\ud6c5\uc740 \ucef4\ud3ec\ub10c\ud2b8 \ud2b8\ub9ac\uc758 \uc5ec\ub7ec \ub808\ubca8\uc5d0\uc11c \ub370\uc774\ud130\ub97c \uc27d\uac8c \uacf5\uc720\ud560 \uc218 \uc788\ub3c4\ub85d \ub3c4\uc640\uc8fc\ub294 \uac15\ub825\ud55c \uae30\ub2a5\uc785\ub2c8\ub2e4. \uc774 \ud3ec\uc2a4\ud2b8\uc5d0\uc11c\ub294 Context API<\/strong>\uc640 useContext<\/strong>\uc758 \ud2b9\uc9d5, \uc0ac\uc6a9 \uc2dc \uc8fc\uc758\ud560 \uc810, \uc5b8\uc81c \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \uc88b\uc740\uc9c0, \uadf8\ub9ac\uace0 \uc608\uc81c\ub97c \ud1b5\ud574 \uc774\ub97c \uc5b4\ub5bb\uac8c \ud65c\uc6a9\ud560 \uc218 \uc788\ub294\uc9c0 \uc54c\uc544\ubcf4\uaca0\uc2b5\ub2c8\ub2e4.<\/p>\n\n\n\n

<\/div>\n\n\n\n
\n\n\n\n

1. Context API\ub780?<\/h2>\n\n\n\n

Context API<\/strong>\ub294 React\uc5d0\uc11c \uc804\uc5ed \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud558\uace0 \ucef4\ud3ec\ub10c\ud2b8 \uac04 \ub370\uc774\ud130\ub97c \uacf5\uc720\ud558\uae30 \uc704\ud55c \uae30\ub2a5\uc785\ub2c8\ub2e4. \uc774\ub97c \ud1b5\ud574 “prop drilling”<\/strong> \ubb38\uc81c\ub97c \ud574\uacb0\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. Prop drilling\uc774\ub780 \ub370\uc774\ud130\ub97c \ud544\uc694\ub85c \ud558\uc9c0 \uc54a\ub294 \uc911\uac04 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\ub3c4 props\ub97c \uc804\ub2ec\ud574\uc57c \ud558\ub294 \uc0c1\ud669\uc744 \ub9d0\ud569\ub2c8\ub2e4.<\/p>\n\n\n\n

Context API\uc758 \uc8fc\uc694 \ud2b9\uc9d5:<\/h4>\n\n\n\n
  1. \uc804\uc5ed \uc0c1\ud0dc \uad00\ub9ac<\/strong>: Context\ub97c \uc0ac\uc6a9\ud558\uba74 \ub370\uc774\ud130\ub97c \uc804\uc5ed\uc801\uc73c\ub85c \uad00\ub9ac\ud558\uace0 \ud544\uc694\ud55c \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \ubc14\ub85c \uc811\uadfc\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
  2. \ud6a8\uc728\uc801\uc778 \ub370\uc774\ud130 \uacf5\uc720<\/strong>: \ucef4\ud3ec\ub10c\ud2b8 \ud2b8\ub9ac\uc758 \uc5b4\ub290 \ub808\ubca8\uc5d0\uc11c\ub3c4 \ub370\uc774\ud130\ub97c \uc27d\uac8c \uacf5\uc720\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
  3. Prop Drilling \ubc29\uc9c0<\/strong>: \uc911\uac04 \ucef4\ud3ec\ub10c\ud2b8\ub97c \uac70\uce58\uc9c0 \uc54a\uace0 \ud544\uc694\ud55c \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \ub370\uc774\ud130\ub97c \uc9c1\uc811 \uc0ac\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li><\/ol>\n\n\n\n
    <\/div>\n\n\n\n
    \n\n\n\n

    2. useContext<\/code>\ub780?<\/h2>\n\n\n\n

    useContext<\/code>\ub294 React\uc758 \ud6c5 \uc911 \ud558\ub098\ub85c, \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c Context \ub370\uc774\ud130\ub97c \uc27d\uac8c \uc0ac\uc6a9\ud560 \uc218 \uc788\ub3c4\ub85d \ub3c4\uc640\uc90d\ub2c8\ub2e4. \uc774\ub97c \ud1b5\ud574 Consumer \ucef4\ud3ec\ub10c\ud2b8\ub97c \uc0ac\uc6a9\ud558\uc9c0 \uc54a\uace0\ub3c4 Context \ub370\uc774\ud130\ub97c \uac00\uc838\uc62c \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\n\n\n\n

    useContext<\/code>\uc758 \uc8fc\uc694 \ud2b9\uc9d5:<\/h4>\n\n\n\n
    1. Context\uc5d0 \uc9c1\uc811 \uc811\uadfc<\/strong>: useContext<\/code>\ub97c \uc0ac\uc6a9\ud558\uba74 Context \ub370\uc774\ud130\ub97c \uac04\ub2e8\ud558\uac8c \uac00\uc838\uc62c \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
    2. \ucf54\ub4dc \uac00\ub3c5\uc131 \ud5a5\uc0c1<\/strong>: Consumer \ucef4\ud3ec\ub10c\ud2b8\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\ubcf4\ub2e4 \ucf54\ub4dc\uac00 \uac04\uacb0\ud558\uace0 \uc77d\uae30 \uc26c\uc6cc\uc9d1\ub2c8\ub2e4.<\/li>
    3. \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc640 \ud638\ud658<\/strong>: React\uc758 \ucd5c\uc2e0 \ud568\uc218\ud615 \ucef4\ud3ec\ub10c\ud2b8\uc640 \ud568\uaed8 \uc0ac\uc6a9\ud558\uae30\uc5d0 \uc801\ud569\ud569\ub2c8\ub2e4.<\/li><\/ol>\n\n\n\n
      <\/div>\n\n\n\n
      \n\n\n\n

      3. Context API\uc640 useContext<\/code>\ub97c \uc5b8\uc81c \uc0ac\uc6a9\ud574\uc57c \ud560\uae4c?<\/h2>\n\n\n\n

      React\uc758 Context API<\/strong>\uc640 useContext Hook<\/strong>\uc740 \ucef4\ud3ec\ub10c\ud2b8 \ud2b8\ub9ac\uc5d0\uc11c \uc804\uc5ed \uc0c1\ud0dc<\/strong>\ub97c \uad00\ub9ac\ud558\uac70\ub098, \uacf5\uc720 \ub370\uc774\ud130<\/strong>\ub97c \ud6a8\uc728\uc801\uc73c\ub85c \uc804\ub2ec\ud558\uae30 \uc704\ud574 \uc0ac\uc6a9\ub418\ub294 \uac15\ub825\ud55c \ub3c4\uad6c\uc774\uc9c0\ub9cc, \ubaa8\ub4e0 \uc0c1\ud669\uc5d0\uc11c \uc801\ud569\ud55c \uac83\uc740 \uc544\ub2d9\ub2c8\ub2e4. \ub2e4\uc74c\uacfc \uac19\uc740 \uacbd\uc6b0\uc5d0 \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \uc88b\uc2b5\ub2c8\ub2e4:<\/p>\n\n\n\n

      1. \uc804\uc5ed \uc0c1\ud0dc \uacf5\uc720<\/strong>: \ud14c\ub9c8, \uc778\uc99d \uc0c1\ud0dc, \uc0ac\uc6a9\uc790 \uc124\uc815 \ub4f1 \uc5ec\ub7ec \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \uacf5\ud1b5\uc801\uc73c\ub85c \uc0ac\uc6a9\ud558\ub294 \ub370\uc774\ud130\ub97c \uad00\ub9ac\ud560 \ub54c.<\/li>
      2. Prop Drilling \ubc29\uc9c0<\/strong>: \ub370\uc774\ud130\ub97c \uc5ec\ub7ec \ucef4\ud3ec\ub10c\ud2b8\uc5d0 \uc804\ub2ec\ud574\uc57c \ud558\uc9c0\ub9cc, \uc911\uac04 \ucef4\ud3ec\ub10c\ud2b8\uac00 \ub370\uc774\ud130\ub97c \uc9c1\uc811 \uc0ac\uc6a9\ud558\uc9c0 \uc54a\ub294 \uacbd\uc6b0.<\/li>
      3. \uac00\ubcbc\uc6b4 \uc0c1\ud0dc \uad00\ub9ac<\/strong>: \uc791\uc740 \uaddc\ubaa8\uc758 \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc5d0\uc11c Redux\uc640 \uac19\uc740 \ubcf5\uc7a1\ud55c \uc0c1\ud0dc \uad00\ub9ac \ub77c\uc774\ube0c\ub7ec\ub9ac \ub300\uc2e0 \uc0ac\uc6a9\ud560 \ub54c.<\/li><\/ol>\n\n\n\n

        3.1. \uc804\uc5ed\uc801\uc73c\ub85c \ub370\uc774\ud130\ub97c \uacf5\uc720\ud574\uc57c \ud560 \ub54c<\/strong><\/h4>\n\n\n\n
        • \uc5ec\ub7ec \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \ub3d9\uc77c\ud55c \ub370\uc774\ud130\ub97c \ud544\uc694\ub85c \ud558\ub294 \uacbd\uc6b0, Context API\ub97c \uc0ac\uc6a9\ud558\uba74 \ub370\uc774\ud130\ub97c \uc27d\uac8c \uacf5\uc720\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
        • \uc608: \uc0ac\uc6a9\uc790 \uc778\uc99d \uc815\ubcf4, \ud14c\ub9c8 \uc124\uc815, \uc5b8\uc5b4 \uc124\uc815 \ub4f1.<\/li><\/ul>\n\n\n\n

          \uc608\uc2dc: \uc0ac\uc6a9\uc790 \uc778\uc99d \uc815\ubcf4 \uacf5\uc720<\/p>\n\n\n\n

          const UserContext = React.createContext();\n\nfunction App() {\n  const user = { name: \"John\", loggedIn: true };\n\n  return (\n    <UserContext.Provider value={user}>\n      <Navbar \/>\n      <Dashboard \/>\n    <\/UserContext.Provider>\n  );\n}\n\nfunction Navbar() {\n  const user = React.useContext(UserContext);\n  return <p>Welcome, {user.name}!<\/p>;\n}<\/code><\/pre>\n\n\n\n
          3.2. Props Drilling\uc744 \ud53c\ud558\uace0 \uc2f6\uc744 \ub54c<\/strong><\/h4>\n\n\n\n
          • \ub370\uc774\ud130\ub098 \ud568\uc218\ub97c \uc5ec\ub7ec \ub2e8\uacc4\uc758 \uc790\uc2dd \ucef4\ud3ec\ub10c\ud2b8\ub85c \uc804\ub2ec\ud574\uc57c \ud560 \ub54c, Context API\ub97c \uc0ac\uc6a9\ud558\uba74 \uc911\uac04 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \ubd88\ud544\uc694\ud558\uac8c props\ub97c \uc804\ub2ec\ud558\uc9c0 \uc54a\uc544\ub3c4 \ub429\ub2c8\ub2e4.<\/li>
          • \uc608: \uae4a\uc740 \ucef4\ud3ec\ub10c\ud2b8 \ud2b8\ub9ac\uc5d0\uc11c \ud14c\ub9c8\ub098 \uc124\uc815 \uac12\uc744 \uc804\ub2ec\ud574\uc57c \ud558\ub294 \uacbd\uc6b0.<\/li><\/ul>\n\n\n\n
            \uc608\uc2dc<\/strong>: \ud14c\ub9c8 \uc124\uc815 \uc804\ub2ec<\/p>\n\n\n\n
            const ThemeContext = React.createContext();\n\nfunction App() {\n  return (\n    <ThemeContext.Provider value=\"dark\">\n      <Toolbar \/>\n    <\/ThemeContext.Provider>\n  );\n}\n\nfunction Toolbar() {\n  return (\n    <div>\n      <ThemedButton \/>\n    <\/div>\n  );\n}\n\nfunction ThemedButton() {\n  const theme = React.useContext(ThemeContext);\n  return <button className={theme}>Click me<\/button>;\n}<\/code><\/pre>\n\n\n\n
            \n\n\n\n
            3.3. \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c \uc0ac\uc6a9\ud558\uae30\uc5d4 \uacfc\ub3c4\ud55c \uacbd\uc6b0<\/strong><\/h4>\n\n\n\n
            • Redux, MobX\uc640 \uac19\uc740 \uc0c1\ud0dc \uad00\ub9ac \ub77c\uc774\ube0c\ub7ec\ub9ac\ub294 \uac15\ub825\ud558\uc9c0\ub9cc, \uc791\uc740 \ud504\ub85c\uc81d\ud2b8\ub098 \uac04\ub2e8\ud55c \uc0c1\ud0dc \uacf5\uc720\uc5d0\ub294 \uacfc\ub3c4\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
            • Context API\ub294 React\uc5d0 \ub0b4\uc7a5\ub418\uc5b4 \uc788\uc5b4 \ucd94\uac00\uc801\uc778 \ub77c\uc774\ube0c\ub7ec\ub9ac \uc5c6\uc774 \uac04\ub2e8\ud55c \uc804\uc5ed \uc0c1\ud0dc \uad00\ub9ac\ub97c \uad6c\ud604\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li><\/ul>\n\n\n\n
              \uc608\uc2dc<\/strong>: \uac04\ub2e8\ud55c \uc804\uc5ed \uc0c1\ud0dc \uad00\ub9ac<\/p>\n\n\n\n
              const CounterContext = React.createContext();\n\nfunction App() {\n  const [count, setCount] = React.useState(0);\n\n  return (\n    <CounterContext.Provider value={{ count, setCount }}>\n      <Counter \/>\n    <\/CounterContext.Provider>\n  );\n}\n\nfunction Counter() {\n  const { count, setCount } = React.useContext(CounterContext);\n  return (\n    <div>\n      <p>Count: {count}<\/p>\n      <button onClick={() => setCount(count + 1)}>Increment<\/button>\n    <\/div>\n  );\n}<\/code><\/pre>\n\n\n\n
              \n\n\n\n
              3.4. \ucef4\ud3ec\ub10c\ud2b8 \uac04\uc758 \ub370\uc774\ud130 \uc758\uc874\uc131\uc774 \ub192\uc744 \ub54c<\/strong><\/h4>\n\n\n\n
              • \uc5ec\ub7ec \ucef4\ud3ec\ub10c\ud2b8\uac00 \ub3d9\uc77c\ud55c \ub370\uc774\ud130\ub97c \ucc38\uc870\ud558\uac70\ub098, \ub370\uc774\ud130 \ubcc0\uacbd\uc5d0 \ub530\ub77c \ub3d9\uc791\uc774 \ub2ec\ub77c\uc9c0\ub294 \uacbd\uc6b0 Context API\ub97c \uc0ac\uc6a9\ud558\uba74 \ub370\uc774\ud130 \uc758\uc874\uc131\uc744 \uc27d\uac8c \uad00\ub9ac\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li>
              • \uc608: \ub2e4\uad6d\uc5b4 \uc9c0\uc6d0(\uc5b8\uc5b4 \uc124\uc815), \uc0ac\uc6a9\uc790 \uad8c\ud55c \uad00\ub9ac \ub4f1.<\/li><\/ul>\n\n\n\n
                <\/div>\n\n\n\n
                \n\n\n\n
                4. \uc5b8\uc81c \uc0ac\uc6a9\ud558\uc9c0 \ub9d0\uc544\uc57c \ud560\uae4c?<\/strong><\/h3>\n\n\n\n
                1. \ub370\uc774\ud130\uac00 \ud2b9\uc815 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c\ub9cc \uc0ac\uc6a9\ub420 \ub54c<\/strong>
                  • Context API\ub294 \uc804\uc5ed\uc801\uc73c\ub85c \ub370\uc774\ud130\ub97c \uacf5\uc720\ud558\uae30 \uc704\ud55c \ub3c4\uad6c\uc785\ub2c8\ub2e4. \ud2b9\uc815 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c\ub9cc \ud544\uc694\ud55c \ub370\uc774\ud130\ub77c\uba74, props<\/strong>\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \ub354 \uc801\ud569\ud569\ub2c8\ub2e4.<\/li><\/ul><\/li>
                  • \ube48\ubc88\ud55c \uc0c1\ud0dc \uc5c5\ub370\uc774\ud2b8\uac00 \ud544\uc694\ud55c \uacbd\uc6b0<\/strong>
                    • Context API\ub294 \uc804\uc5ed \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud560 \uc218 \uc788\uc9c0\ub9cc, \uc0c1\ud0dc\uac00 \uc790\uc8fc \ubcc0\uacbd\ub418\uba74 Context\ub97c \uad6c\ub3c5\ud558\ub294 \ubaa8\ub4e0 \ucef4\ud3ec\ub10c\ud2b8\uac00 \ub9ac\ub80c\ub354\ub9c1\ub429\ub2c8\ub2e4.<\/li>
                    • \uc774 \uacbd\uc6b0, Redux, Zustand, Recoil\uacfc \uac19\uc740 \uc0c1\ud0dc \uad00\ub9ac \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \ub354 \ud6a8\uc728\uc801\uc77c \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/li><\/ul><\/li>
                    • \ubcf5\uc7a1\ud55c \uc0c1\ud0dc \uad00\ub9ac\uac00 \ud544\uc694\ud55c \uacbd\uc6b0<\/strong>
                      • Context API\ub294 \uac04\ub2e8\ud55c \uc804\uc5ed \uc0c1\ud0dc \uad00\ub9ac\uc5d0 \uc801\ud569\ud569\ub2c8\ub2e4. \uc0c1\ud0dc\uac00 \ubcf5\uc7a1\ud558\uac70\ub098 \uc5ec\ub7ec \uc561\uc158\uacfc \ube44\ub3d9\uae30 \uc791\uc5c5\uc774 \ud544\uc694\ud55c \uacbd\uc6b0, Redux\uc640 \uac19\uc740 \ub77c\uc774\ube0c\ub7ec\ub9ac\ub97c \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \ub354 \uc801\ud569\ud569\ub2c8\ub2e4.<\/li><\/ul><\/li><\/ol>\n\n\n\n
                        <\/div>\n\n\n\n
                        \n\n\n\n
                        \ub9c8\ubb34\ub9ac<\/h2>\n\n\n\n
                        Context API<\/strong>\uc640 useContext <\/strong>\ud6c5\uc740 React \uc560\ud50c\ub9ac\ucf00\uc774\uc158\uc5d0\uc11c \uc804\uc5ed \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud558\uace0 \ub370\uc774\ud130\ub97c \uacf5\uc720\ud558\ub294 \ub370 \ub9e4\uc6b0 \uc720\uc6a9\ud55c \ub3c4\uad6c\uc785\ub2c8\ub2e4. Prop Drilling \ubb38\uc81c\ub97c \ud574\uacb0\ud558\uace0 \ucf54\ub4dc\uc758 \uac00\ub3c5\uc131\uc744 \ub192\uc774\ub294 \ub370 \ud070 \ub3c4\uc6c0\uc744 \uc90d\ub2c8\ub2e4. \ud558\uc9c0\ub9cc \uc131\ub2a5 \ubb38\uc81c\uc640 \ucef4\ud3ec\ub10c\ud2b8 \uc7ac\uc0ac\uc6a9\uc131 \uac10\uc18c\ub97c \ubc29\uc9c0\ud558\uae30 \uc704\ud574 \uc2e0\uc911\ud558\uac8c \uc0ac\uc6a9\ud574\uc57c \ud569\ub2c8\ub2e4.<\/p>\n\n\n\n
                        <\/div>\n\n\n\n
                        <\/p>\n\n\n\n
                        <\/p>\n\n\n\n
                        \"\"<\/figure>\n","protected":false},"excerpt":{"rendered":"
                        React\ub294 \ucef4\ud3ec\ub10c\ud2b8 \uac04 \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud558\uace0 \ub370\uc774\ud130\ub97c \uacf5\uc720\ud558\uae30 \uc704\ud55c \ub2e4\uc591\ud55c \ub3c4\uad6c\ub97c \uc81c\uacf5\ud569\ub2c8\ub2e4. \uadf8\uc911\uc5d0\uc11c\ub3c4 Context API\uc640 useContext \ud6c5\uc740 \ucef4\ud3ec\ub10c\ud2b8 \ud2b8\ub9ac\uc758 \uc5ec\ub7ec \ub808\ubca8\uc5d0\uc11c \ub370\uc774\ud130\ub97c \uc27d\uac8c \uacf5\uc720\ud560 \uc218 \uc788\ub3c4\ub85d \ub3c4\uc640\uc8fc\ub294 \uac15\ub825\ud55c \uae30\ub2a5\uc785\ub2c8\ub2e4. \uc774 \ud3ec\uc2a4\ud2b8\uc5d0\uc11c\ub294 Context API\uc640 useContext\uc758 \ud2b9\uc9d5, \uc0ac\uc6a9 \uc2dc \uc8fc\uc758\ud560 \uc810, \uc5b8\uc81c \uc0ac\uc6a9\ud558\ub294 \uac83\uc774 \uc88b\uc740\uc9c0, \uadf8\ub9ac\uace0 \uc608\uc81c\ub97c \ud1b5\ud574 \uc774\ub97c \uc5b4\ub5bb\uac8c \ud65c\uc6a9\ud560 \uc218 \uc788\ub294\uc9c0 \uc54c\uc544\ubcf4\uaca0\uc2b5\ub2c8\ub2e4. 1. Context API\ub780? Context […]<\/p>\n","protected":false},"author":16,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_mi_skip_tracking":false},"categories":[3],"tags":[60,59,65,55,66],"_links":{"self":[{"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/posts\/672"}],"collection":[{"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=672"}],"version-history":[{"count":3,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/posts\/672\/revisions"}],"predecessor-version":[{"id":703,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=\/wp\/v2\/posts\/672\/revisions\/703"}],"wp:attachment":[{"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=672"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=672"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.anchors-biz.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=672"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}